hippoz/waffle
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

improve handling of themes

Browse source
This commit is contained in:
hippoz 2022-08-31 16:12:54 +03:00
parent 4d4e054291
commit 0c6c88f7f5
Signed by: hippoz
GPG key ID: 7C52899193467641
3 changed files with 11 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
frontend/public/global.css
View file

@ -29,6 +29,7 @@
--foreground-color-2: rgb(218, 219, 220); --foreground-color-2: rgb(218, 219, 220);
--foreground-color-3: rgb(153, 154, 155); --foreground-color-3: rgb(153, 154, 155);
--foreground-color-4: rgb(123, 124, 125); --foreground-color-4: rgb(123, 124, 125);
--colored-element-text-color: var(--foreground-color-1);
--purple-1: hsl(280, 78%, 50%); --purple-1: hsl(280, 78%, 50%);
--blue-1: hsl(200, 78%, 50%); --blue-1: hsl(200, 78%, 50%);
@ -211,12 +212,12 @@ body {
/* button */ /* button */
.button { .button {
color: var(--foreground-color-1);
background-color: var(--background-color-2); background-color: var(--background-color-2);
text-align: center; text-align: center;
border: none; border: none;
padding: var(--space-sm); padding: var(--space-sm);
border-radius: var(--radius-md); border-radius: var(--radius-md);
color: currentColor;
font: inherit; font: inherit;
max-height: 3em; max-height: 3em;
} }
@ -226,6 +227,7 @@ body {
} }
.button-accent { .button-accent {
color: var(--colored-element-text-color);
background-color: var(--purple-2); background-color: var(--purple-2);
} }
@ -238,6 +240,7 @@ body {
} }
.button-red { .button-red {
color: var(--colored-element-text-color);
background-color: var(--red-2); background-color: var(--red-2);
} }
@ -368,9 +371,14 @@ body {
} }
.sidebar-button.selected { .sidebar-button.selected {
color: var(--colored-element-text-color);
background-color: var(--purple-2); background-color: var(--purple-2);
} }
.sidebar-button.selected .icon-button {
color: var(--colored-element-text-color);
}
/*! the tweaks below are heavily based on modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */ /*! the tweaks below are heavily based on modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
*, *,

13
frontend/src/components/Main.svelte
View file

@ -21,19 +21,8 @@
--background-color-1: rgb(253, 254, 255); --background-color-1: rgb(253, 254, 255);
--background-color-2: rgb(218, 219, 220); --background-color-2: rgb(218, 219, 220);
--background-color-3: rgb(173, 174, 175); --background-color-3: rgb(173, 174, 175);
}
.button { --colored-element-text-color: var(--background-color-0);
color: var(--foreground-color-1);
}
.button-red, .button-accent {
color: var(--background-color-1);
}
.sidebar-button.selected,
.sidebar-button.selected .icon-button {
color: var(--background-color-1);
} }
</style> </style>
{/if} {/if}

2
frontend/src/components/Message.svelte
View file

@ -9,7 +9,7 @@
.message { .message {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
overflow-x: none; overflow-x: hidden;
word-break: break-all; word-break: break-all;
padding: var(--space-xxs) var(--space-normplus) var(--space-xxs) var(--space-normplus); padding: var(--space-xxs) var(--space-normplus) var(--space-xxs) var(--space-normplus);
} }