material-theme.scss

@import '~@angular/material/theming';

$uw-accent: (
	50 : #f8e1e2,
	100 : #eeb4b6,
	200 : #e28286,
	300 : #d65055,
	400 : #ce2b30,
	500 : #c5050c,
	600 : #bf040a,
	700 : #b80408,
	800 : #b00306,
	900 : #a30103,
	A100 : #ffcece,
	A200 : #ff9b9b,
	A400 : #ff6868,
	A700 : #ff4e4e,
	contrast: (
		50 : #000000,
		100 : #000000,
		200 : #000000,
		300 : #ffffff,
		400 : #ffffff,
		500 : #ffffff,
		600 : #ffffff,
		700 : #ffffff,
		800 : #ffffff,
		900 : #ffffff,
		A100 : #000000,
		A200 : #000000,
		A400 : #000000,
		A700 : #000000,
	)
);

$uw-primary: (
	50 : #e1eff5,
	100 : #b4d7e5,
	200 : #82bcd4,
	300 : #4fa1c2,
	400 : #2a8db5,
	500 : #0479a8,
	600 : #0371a0,
	700 : #036697,
	800 : #025c8d,
	900 : #01497d,
	A100 : #aad6ff,
	A200 : #77bdff,
	A400 : #44a5ff,
	A700 : #2a99ff,
	contrast: (
		50 : #000000,
		100 : #000000,
		200 : #000000,
		300 : #000000,
		400 : #ffffff,
		500 : #ffffff,
		600 : #ffffff,
		700 : #ffffff,
		800 : #ffffff,
		900 : #ffffff,
		A100 : #000000,
		A200 : #000000,
		A400 : #000000,
		A700 : #000000,
	)
);

$uw-warn: (
	50 : #fff0e0,
	100 : #ffd9b3,
	200 : #ffc080,
	300 : #ffa64d,
	400 : #ff9326,
	500 : #ff8000,
	600 : #ff7800,
	700 : #ff6d00,
	800 : #ff6300,
	900 : #ff5000,
	A100 : #ffffff,
	A200 : #fff5f2,
	A400 : #ffcfbf,
	A700 : #ffbca6,
	contrast: (
		50 : #000000,
		100 : #000000,
		200 : #000000,
		300 : #000000,
		400 : #000000,
		500 : #000000,
		600 : #000000,
		700 : #000000,
		800 : #000000,
		900 : #ffffff,
		A100 : #000000,
		A200 : #000000,
		A400 : #000000,
		A700 : #000000,
	)
);

$custom-typography: mat-typography-config($font-family: '"Helvetica Neue", Georgia, Helvetica, Arial, sans-serif');
@include mat-core($custom-typography);

$my-app-primary: mat-palette($uw-primary);
$my-app-accent:  mat-palette($uw-accent);
$my-app-warn:    mat-palette($uw-warn);
$my-app-theme: mat-light-theme($my-app-primary, $my-app-accent, $my-app-warn);

@include angular-material-theme($my-app-theme);

// Since we're not using uw-style for buttons we need to add a few styles to mirror its appearance.
button {
	text-transform: uppercase;
}

.btn-primary {
	background-color: map-get($uw-primary, 500);
	color: #fff;
	font-weight: 400;
}