You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
95 lines
2.6 KiB
95 lines
2.6 KiB
|
|
// Custom Theming for Angular Material
|
|
// For more information: https://material.angular.io/guide/theming
|
|
@use '@angular/material' as mat;
|
|
// Plus imports for other components in your app.
|
|
|
|
// Include the common styles for Angular Material. We include this here so that you only
|
|
// have to load a single css file for Angular Material in your app.
|
|
// Be sure that you only ever include this mixin once!
|
|
@include mat.core();
|
|
|
|
// Define the palettes for your theme using the Material Design palettes available in palette.scss
|
|
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
|
|
// hue. Available color palettes: https://material.io/design/color/
|
|
$f13_ang_web-primary: mat.define-palette(mat.$red-palette);
|
|
$f13_ang_web-accent: mat.define-palette(mat.$red-palette, A200, A100, A400);
|
|
|
|
// The warn palette is optional (defaults to red).
|
|
$f13_ang_web-warn: mat.define-palette(mat.$red-palette);
|
|
|
|
// Create the theme object. A theme consists of configurations for individual
|
|
// theming systems such as "color" or "typography".
|
|
$f13_ang_web-theme: mat.define-light-theme((
|
|
color: (
|
|
primary: $f13_ang_web-primary,
|
|
accent: $f13_ang_web-accent,
|
|
warn: $f13_ang_web-warn,
|
|
)
|
|
));
|
|
|
|
// Include theme styles for core and each component used in your app.
|
|
// Alternatively, you can import and @include the theme mixins for each component
|
|
// that you are using.
|
|
@include mat.all-component-themes($f13_ang_web-theme);
|
|
|
|
/* You can add global styles to this file, and also import other style files */
|
|
|
|
@font-face {
|
|
font-family: Lato;
|
|
src: url('assets/fonts/Lato-Regular.ttf') format('truetype');
|
|
}
|
|
|
|
@font-face {
|
|
font-family: LatoBlack;
|
|
src: url('assets/fonts/Lato-Black.ttf') format('truetype');
|
|
}
|
|
|
|
@font-face {
|
|
font-family: LatoThin;
|
|
src: url('assets/fonts/Lato-Thin.ttf') format('truetype');
|
|
}
|
|
|
|
|
|
html, body { height: 100%; }
|
|
body { margin: 0; font-family: Lato, Roboto, "Helvetica Neue", sans-serif; }
|
|
|
|
h1,h2,h3,h4,h5,h6 {
|
|
font-family: LatoBlack, Roboto, "Helvetica Neue", sans-serif;
|
|
}
|
|
|
|
span {
|
|
font-family: LatoThin, Roboto, "Helvetica Neue", sans-serif;
|
|
}
|
|
|
|
.lato {
|
|
font-family: LatoBlack, Roboto, "Helvetica Neue", sans-serif;
|
|
}
|
|
|
|
.mat-card-subtitle {
|
|
font-family: LatoThin, Roboto, "Helvetica Neue", sans-serif;
|
|
}
|
|
|
|
.spacer {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.f13_color_primary {
|
|
color: #ef7f41;
|
|
}
|
|
|
|
.f13_color_secondary {
|
|
color: #d6473c;
|
|
}
|
|
|
|
.f13_color_extra {
|
|
color: #5e7edf;
|
|
}
|
|
|
|
.content-in-center {
|
|
width: 66%; margin: 0 auto
|
|
}
|
|
|
|
.content-in-center-header {
|
|
display: flex; width: 66%; padding-left: calc((100% - 66%)/2); padding-right: calc((100% - 66%)/2); margin: 0 auto; background: linear-gradient(to top, #f2a998, #e65e11);
|
|
}
|
|
|