Removes gray hue from text on buttons

This commit is contained in:
apapachristou 2019-11-04 18:21:07 +02:00
parent 8adfc1d46d
commit f1df43ca4a
1 changed files with 111 additions and 126 deletions

View File

@ -1,5 +1,5 @@
@import 'app/ui/misc/navigation/navigation.component.scss'; @import "app/ui/misc/navigation/navigation.component.scss";
@import '~@angular/material/theming'; // @import '../../../node_modules/@angular/material/theming'; @import "~@angular/material/theming"; // @import '../../../node_modules/@angular/material/theming';
$app-blue-theme-primary-palette: ( $app-blue-theme-primary-palette: (
50: #e2eef1, 50: #e2eef1,
@ -17,67 +17,53 @@ $app-blue-theme-primary-palette: (
A400: #25c0ff, A400: #25c0ff,
A700: #0bb9ff, A700: #0bb9ff,
contrast: ( contrast: (
50: $black-87-opacity, 50: #000000,
100: $black-87-opacity, 100: #000000,
200: $black-87-opacity, 200: #000000,
300: white, 300: #000000,
400: white, 400: #ffffff,
500: $white-87-opacity, 500: #ffffff,
600: $white-87-opacity, 600: #ffffff,
700: $white-87-opacity, 700: #ffffff,
800: $white-87-opacity, 800: #ffffff,
900: $white-87-opacity, 900: #ffffff,
A100: $black-87-opacity, A100: #000000,
A200: white, A200: #000000,
A400: white, A400: #ffffff,
A700: $white-87-opacity, A700: #ffffff
), )
); );
$app-blue-theme-accent-palette: ( $app-blue-theme-accent-palette: (
50 : #e0f6f3, 50: #e0f6f3,
100 : #b3e8e2, 100: #b3e8e2,
200 : #80d9cf, 200: #80d9cf,
300 : #4dc9bc, 300: #4dc9bc,
400 : #26bead, 400: #26bead,
500 : #00b29f, 500: #00b29f,
600 : #00ab97, 600: #00ab97,
700 : #00a28d, 700: #00a28d,
800 : #009983, 800: #009983,
900 : #008a72, 900: #008a72,
A100 : #b6fff0, A100: #b6fff0,
A200 : #83ffe6, A200: #83ffe6,
A400 : #50ffdc, A400: #50ffdc,
A700 : #36ffd7, A700: #36ffd7,
// 50: #fce4ec,
// 100: #f8bbd0,
// 200: #f48fb1,
// 300: #f06292,
// 400: #ec407a,
// 500: #e91e63,
// 600: #d81b60,
// 700: #c2185b,
// 800: #ad1457,
// 900: #880e4f,
// A100: #ff80ab,
// A200: #ff4081,
// A400: #f50057,
// A700: #c51162,
contrast: ( contrast: (
50: $black-87-opacity, 50: #000000,
100: $black-87-opacity, 100: #000000,
200: $black-87-opacity, 200: #000000,
300: $black-87-opacity, 300: #000000,
400: $black-87-opacity, 400: #000000,
500: white, 500: #ffffff,
600: white, 600: #ffffff,
700: $white-87-opacity, 700: #000000,
800: $white-87-opacity, 800: #000000,
900: $white-87-opacity, 900: #000000,
A100: $black-87-opacity, A100: #000000,
A200: white, A200: #ffffff,
A400: white, A400: #ffffff,
A700: white, A700: #ffffff
) )
); );
@ -99,7 +85,7 @@ $app-blue-theme-background: (
selected-disabled-button: map_get($mat-grey, 400), selected-disabled-button: map_get($mat-grey, 400),
disabled-button-toggle: map_get($mat-grey, 200), disabled-button-toggle: map_get($mat-grey, 200),
unselected-chip: map_get($mat-grey, 300), unselected-chip: map_get($mat-grey, 300),
disabled-list-option: map_get($mat-grey, 200), disabled-list-option: map_get($mat-grey, 200)
); );
$app-blue-theme-foreground: ( $app-blue-theme-foreground: (
@ -116,7 +102,7 @@ $app-blue-theme-foreground: (
text: rgba(black, 0.87), text: rgba(black, 0.87),
slider-min: rgba(black, 0.87), slider-min: rgba(black, 0.87),
slider-off: rgba(black, 0.26), slider-off: rgba(black, 0.26),
slider-off-active: rgba(black, 0.38), slider-off-active: rgba(black, 0.38)
); );
$custom-theme: ( $custom-theme: (
@ -125,11 +111,11 @@ $custom-theme: (
warn: $app-blue-theme-warn, warn: $app-blue-theme-warn,
is-dark: false, is-dark: false,
foreground: $app-blue-theme-foreground, foreground: $app-blue-theme-foreground,
background: $app-blue-theme-background, background: $app-blue-theme-background
); );
$custom-typography: mat-typography-config( $custom-typography: mat-typography-config(
$font-family: 'Lato, regular', $font-family: "Lato, regular",
$headline: mat-typography-level(32px, 48px, 700), $headline: mat-typography-level(32px, 48px, 700),
$body-1: mat-typography-level(16px, 24px, 500) $body-1: mat-typography-level(16px, 24px, 500)
); );
@ -152,5 +138,4 @@ $custom-typography: mat-typography-config(
// Override the typography in the core CSS. // Override the typography in the core CSS.
@include mat-core($custom-typography); @include mat-core($custom-typography);
} }