Improve dark themes

Add better contrast to dark themes on various instances
Add yellow as accent color for red themes
This commit is contained in:
Sean 2020-06-18 13:11:45 +02:00
parent b43151fd59
commit 912a528f8a
5 changed files with 8 additions and 7 deletions

View File

@ -134,8 +134,8 @@
{{ getTitleWithChanges() }}
</h1>
<button
class="primary-accent-by-theme"
mat-icon-button
color="accent"
(click)="toggleFavorite()"
matTooltip="{{ 'Mark as personal favorite' | translate }}"
>

View File

@ -141,6 +141,7 @@ $narrow-spacing: (
* Custom configuration for dark themes
*/
[class^="openslides-"][class*="-dark-theme"] {
color: white;
.logo-container {
img.dark {
display: inherit;

View File

@ -15,11 +15,11 @@
h1,
h3.accent {
color: mat-color($primary);
color: mat-color(if($is-dark-theme, $accent, $primary));
}
a {
color: mat-color($primary);
color: mat-color(if($is-dark-theme, $accent, $primary));
}
.anchor-button {
@ -31,8 +31,8 @@
color: mat-color($accent);
}
.button24 {
color: mat-color($primary);
.primary-accent-by-theme {
color: mat-color(if($is-dark-theme, $accent, $primary));
}
//custom table header for search button, filtering and more. Used in ListViews

View File

@ -1,7 +1,7 @@
@import './assets/styles/color-palettes/os-red.scss';
$openslides-primary: mat-palette($openslides-primary-red, 500, 300, 900);
$openslides-accent: mat-palette($openslides-primary-red, 500, 300, 900);
$openslides-accent: mat-palette($mat-amber);
$openslides-warn: mat-palette($mat-orange, 700, 300, 900);
$openslides-red-dark: mat-dark-theme($openslides-primary, $openslides-accent, $openslides-warn);

View File

@ -1,7 +1,7 @@
@import './assets/styles/color-palettes/os-red.scss';
$openslides-primary: mat-palette($openslides-primary-red, 500, 300, 900);
$openslides-accent: mat-palette($openslides-primary-red, 500, 300, 900);
$openslides-accent: mat-palette($mat-amber);
$openslides-warn: mat-palette($mat-orange, 700, 300, 900);
$openslides-red-light: mat-light-theme($openslides-primary, $openslides-accent, $openslides-warn);