Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

migrating variables

This commit is contained in:
Nicolas Constant 2024-04-28 17:00:59 -04:00
parent b3c41cafc2
commit e6d77a9b0e
6 changed files with 114 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/app/components/stream/status/status.component.scss
View File

@ -34,10 +34,6 @@
}
.status-selected {
background-color: #0f111a;
background-color: desaturate(lighten(#0f111a, 5%), 4%);
background-color: #0a0a10;
background-color: #1e2734;
background-color: $selected-status;
}
@ -80,41 +76,25 @@
padding-top: 1px;
}
&--bot {
background-color: rgb(0, 225, 255);
background-color: rgb(0, 159, 180);
background-color: rgb(0, 114, 129);
background-color: var(--label-bot);
}
&--xpost {
background-color: rgb(255, 153, 0);
background-color: rgb(189, 113, 0);
background-color: rgb(156, 94, 0);
background-color: var(--label-xpost);
}
&--thread {
background-color: rgb(0, 187, 84);
background-color: rgb(0, 136, 61);
background-color: rgb(0, 114, 51);
background-color: var(--label-thread);
}
&--discuss {
background-color: rgb(90, 0, 143);
background-color: var(--label-discuss);
}
&--old {
background-color: rgb(150, 0, 0);
background-color: var(--label-old);
}
&--remote {
background-color: rgb(161, 64, 140);
background-color: rgb(33, 69, 136);
background-color: rgb(38, 77, 148);
background-color: var(--label-remote);
}
&--edited {
background-color: rgb(167, 0, 153);
background-color: rgb(0, 128, 167);
background-color: rgb(65, 65, 71);
background-color: rgb(144, 184, 0);
background-color: rgb(82, 105, 0);
background-color: rgb(95, 95, 95);
// color: black;
background-color: var(--label-edited);
}
}
&__name {
@ -183,13 +163,8 @@
border-radius: 4px;
// color: #6d8fd3;
// color: #7282a1;
// color: #838da1;
color: #919bb1;
// background-color: #273149;
// background-color: #1f273a;
background-color: #171d2b;
color: var(--status-content-warning-closed-color);
background-color: var(--status-content-warning-closed-background);
}
&--title {

29
src/app/components/stream/stream-statuses/stream-statuses.component.scss
View File

@ -12,7 +12,7 @@
position: relative;
z-index: 1;
display: inline-block;
border-bottom: 1px solid black;
border-bottom: 1px solid var(--stream-toot-load-buffer-border);
padding: 10px;
margin: 0;
text-align: center;
@ -22,14 +22,14 @@
color: $status-secondary-color;
&:hover {
color: white;
color: var(--stream-toot-load-buffer-color-hover);
text-decoration: none;
}
}
&__error {
padding: 20px 20px 0 20px;
color: rgb(255, 113, 113);
color: var(--stream-toot-error);
}
&__content {
@ -47,8 +47,7 @@
height: 25px;
position: absolute;
top: -15px;
background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
background: radial-gradient(ellipse at center, rgba(150, 192, 255, 0.514), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
background: radial-gradient(ellipse at center, var(--stream-new-notification-1), var(--stream-new-notification-2), var(--stream-new-notification-3));
transition: all .5s;
opacity: 0;
@ -60,7 +59,7 @@
&__status:not(:last-child) {
border: solid #06070b;
border: solid var(--stream-toot-status-not-last-child-border);
border-width: 0 0 1px 0;
}
&__remove-cw {
@ -72,13 +71,7 @@
padding: 5px;
height: 45px;
&--button {
// width: calc(80%);
// margin-left: 40%;
// transform: translateX(-40%);
&--button {
transition: all .2s;
text-decoration: none;
padding: 5px 5px;
@ -88,17 +81,13 @@
border: 3px $status-secondary-color double;
border: 0;
background-color: var(--color-secondary);
background-color: $status-secondary-color;
// background-color: rgb(238, 238, 238);
color: white;
color: var(--stream-remove-cw-color);
&:hover{
background-color: $status-secondary-color;
background-color: rgb(238, 238, 238);
color: black;
//border: 3px $hover-color double;
background-color: var(--stream-remove-cw-background-hover);
color: var(--stream-remove-cw-color-hover);
}
}
}

7
src/app/components/stream/stream.component.scss
View File

@ -20,7 +20,7 @@
&__stream-header {
position: relative;
width: $stream-column-width;
border-bottom: 1px solid #222736;
border-bottom: 1px solid var(--stream-column-border);
}
&__open-menu {
width: $stream-header-height - 10px;
@ -31,11 +31,10 @@
right: 5px;
&:hover &--icon {
color: darken(whitesmoke, 30);
color: var(--stream-column-icon-hover);
}
&--icon {
color: whitesmoke; // float: left;
// position: relative;
color: var(--stream-column-icon);
position: absolute;
top: 4px;
left: 8px;

30
src/app/themes/implementations/default.ts
View File

@ -72,5 +72,35 @@ export const defaultTheme: Theme = {
"--settings-text-input-background": "#242836",
"--settings-text-input-foreground": "white",
"--settings-text-input-border": "#32384d",
"--stream-column-icon": "whitesmoke",
"--stream-column-icon-hover": "#acacac",
"--stream-column-border": "#222736",
"--label-bot": "#007281",
"--label-xpost": "#9c5e00",
"--label-thread": "#007233",
"--label-discuss": "#5a008f",
"--label-old": "#960000",
"--label-remote": "#264d94",
"--label-edited": "#5f5f5f",
"--status-content-warning-closed-color": "#919bb1",
"--status-content-warning-closed-background": "#171d2b",
"--stream-new-notification-1": "#96c0ff83",
"--stream-new-notification-2": "#ffffff00",
"--stream-new-notification-3": "#ffffff00",
"--stream-remove-cw-background-hover": "#eeeeee",
"--stream-remove-cw-color-hover": "black",
"--stream-remove-cw-color": "white",
"--stream-toot-error": "#ff7171",
"--stream-toot-load-buffer-color-hover": "white",
"--stream-toot-load-buffer-border": "black",
"--stream-toot-status-not-last-child-border": "#06070b",
}
};

39
src/app/themes/implementations/light.ts
View File

@ -8,8 +8,9 @@ export const lightTheme: Theme = {
"--font-color-secondary": "#bfbfbf",
"--font-link-primary": "#595c67",
"--font-link-primary-hover": "#8f93a2",
"--color-primary": "#141824",
"--color-secondary": "#090b10",
"--color-primary": "#ffffff",
"--color-secondary": "#e6ebf0",
"--column-color": "#0f111a",
"--column-header-background-color": "#0c0c10",
@ -18,7 +19,7 @@ export const lightTheme: Theme = {
"--btn-primary-color": "#444f74",
"--btn-primary-font-color": "white",
"--status-primary-color": "#fff",
"--status-secondary-color": "#4e5572",
"--status-secondary-color": "#292c37",
"--status-links-color": "#d9e1e8",
"--boost-color": "#5098eb",
"--update-color": "#95e470",
@ -29,7 +30,7 @@ export const lightTheme: Theme = {
"--button-color-hover": "white",
"--button-border-color": "#303957",
"--column-background": "#0f111a",
"--column-background": "#f6f7f9",
"--card-border-color": "#2b344d",
@ -72,5 +73,35 @@ export const lightTheme: Theme = {
"--settings-text-input-background": "#242836",
"--settings-text-input-foreground": "white",
"--settings-text-input-border": "#32384d",
"--stream-column-icon": "whitesmoke",
"--stream-column-icon-hover": "#acacac",
"--stream-column-border": "#222736",
"--label-bot": "#007281",
"--label-xpost": "#9c5e00",
"--label-thread": "#007233",
"--label-discuss": "#5a008f",
"--label-old": "#960000",
"--label-remote": "#264d94",
"--label-edited": "#5f5f5f",
"--status-content-warning-closed-color": "#919bb1",
"--status-content-warning-closed-background": "#171d2b",
"--stream-new-notification-1": "#96c0ff83",
"--stream-new-notification-2": "#ffffff00",
"--stream-new-notification-3": "#ffffff00",
"--stream-remove-cw-background-hover": "#eeeeee",
"--stream-remove-cw-color-hover": "black",
"--stream-remove-cw-color": "white",
"--stream-toot-error": "#ff7171",
"--stream-toot-load-buffer-color-hover": "white",
"--stream-toot-load-buffer-border": "black",
"--stream-toot-status-not-last-child-border": "#06070b",
}
};

28
src/sass/_variables.scss
View File

@ -68,7 +68,35 @@
--settings-text-input-foreground: white;
--settings-text-input-border: #32384d;
--stream-column-icon: whitesmoke;
--stream-column-icon-hover: #acacac; //darken(whitesmoke, 30);
--stream-column-border: #222736;
--label-bot: #007281;
--label-xpost: #9c5e00;
--label-thread: #007233;
--label-discuss: #5a008f;
--label-old: #960000;
--label-remote: #264d94;
--label-edited: #5f5f5f;
--status-content-warning-closed-color: #919bb1;
--status-content-warning-closed-background: #171d2b;
--stream-new-notification-1: #96c0ff83;
--stream-new-notification-2: #ffffff00;
--stream-new-notification-3: #ffffff00;
--stream-remove-cw-background-hover: #eeeeee;
--stream-remove-cw-color-hover: black;
--stream-remove-cw-color: white;
--stream-toot-error: #ff7171;
--stream-toot-load-buffer-color-hover: white;
--stream-toot-load-buffer-border: black;
--stream-toot-status-not-last-child-border: #06070b;
--color-primary-lighter-5: hsl(from var(var(--color-primary)) h s calc(l + 5%));