Ménage
Test avec le thème pour récupérer les icones
This commit is contained in:
@@ -35,8 +35,7 @@
|
||||
"styles": [
|
||||
"src/assets/css/styles-app-loading.scss",
|
||||
"src/assets/css/styles.css",
|
||||
"src/assets/css/new-theme.scss",
|
||||
"@angular/material/prebuilt-themes/pink-bluegrey.css"
|
||||
"src/assets/css/new-theme.scss"
|
||||
],
|
||||
"scripts": []
|
||||
},
|
||||
|
||||
@@ -27,7 +27,11 @@
|
||||
<mat-sidenav-container>
|
||||
<mat-sidenav #snav mode="over" style="padding: 0 20px 0 10px">
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="Summary">timeline</mat-icon>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Summary"
|
||||
fontIcon="timeline"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/summary"
|
||||
routerLinkActive="active"
|
||||
@@ -38,9 +42,11 @@
|
||||
<hr class="splitter" />
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="List of jumps"
|
||||
>list_alt</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="List of jumps"
|
||||
fontIcon="list_alt"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/jumps"
|
||||
routerLinkActive="active"
|
||||
@@ -50,7 +56,11 @@
|
||||
>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="Add jumps">add_circle</mat-icon>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Add jumps"
|
||||
fontIcon="add_circle"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/newjump"
|
||||
routerLinkActive="active"
|
||||
@@ -61,9 +71,11 @@
|
||||
<hr class="splitter" />
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="List of tunnel flights"
|
||||
>list_alt</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="List of tunnel flights"
|
||||
fontIcon="list_alt"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/tunnelFlights"
|
||||
routerLinkActive="active"
|
||||
@@ -73,9 +85,11 @@
|
||||
>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="Add flights in tunnel"
|
||||
>add_circle</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Add flights in tunnel"
|
||||
fontIcon="add_circle"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/newTunnelFlight"
|
||||
routerLinkActive="active"
|
||||
@@ -86,7 +100,11 @@
|
||||
<hr class="splitter" />
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="Dropzones">store</mat-icon>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Dropzones"
|
||||
fontIcon="store"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/dzs"
|
||||
routerLinkActive="active"
|
||||
@@ -96,9 +114,11 @@
|
||||
>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="Aircrafts"
|
||||
>airplanemode_active</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Aircrafts"
|
||||
fontIcon="airplanemode_active"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/aircrafts"
|
||||
routerLinkActive="active"
|
||||
@@ -108,9 +128,11 @@
|
||||
>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="List of jump types"
|
||||
>flight_land</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="List of jump types"
|
||||
fontIcon="flight_land"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/jumpTypes"
|
||||
routerLinkActive="active"
|
||||
@@ -120,9 +142,11 @@
|
||||
>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list>
|
||||
<mat-icon aria-hidden="false" aria-label="List of gears"
|
||||
>settings_input_antenna</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="List of gears"
|
||||
fontIcon="settings_input_antenna"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/gears"
|
||||
routerLinkActive="active"
|
||||
@@ -133,9 +157,11 @@
|
||||
</mat-nav-list>
|
||||
<mat-nav-list *ngIf="currentUser">
|
||||
<hr class="splitter" />
|
||||
<mat-icon aria-hidden="false" aria-label="User account"
|
||||
>account_box</mat-icon
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="User account"
|
||||
fontIcon="account_box"
|
||||
></mat-icon>
|
||||
<a
|
||||
routerLink="/user"
|
||||
routerLinkActive="active"
|
||||
@@ -146,7 +172,11 @@
|
||||
</a>
|
||||
</mat-nav-list>
|
||||
<mat-nav-list *ngIf="currentUser">
|
||||
<mat-icon aria-hidden="false" aria-label="To logout">logout</mat-icon>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="To logout"
|
||||
fontIcon="logout"
|
||||
></mat-icon>
|
||||
<span (click)="snav.toggle(); logout()" style="cursor: pointer">{{
|
||||
"App_Nav_Logout" | translate
|
||||
}}</span>
|
||||
|
||||
@@ -1,23 +1,61 @@
|
||||
<div class="content">
|
||||
<p>
|
||||
<a class="nostyle" routerLink="/summary" routerLinkActive="active" skipLocationChange>
|
||||
<mat-icon aria-hidden="false" aria-label="Summary" style="width: 128px; height:128px; font-size: 128px;">timeline</mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="nostyle" routerLink="/newjump" routerLinkActive="active" skipLocationChange>
|
||||
<mat-icon aria-hidden="false" aria-label="Add jumps" style="width: 128px; height:128px; font-size: 128px;">add_circle</mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="nostyle" routerLink="/jumps" routerLinkActive="active" skipLocationChange>
|
||||
<mat-icon aria-hidden="false" aria-label="List of jumps" style="width: 128px; height:128px; font-size: 128px;">list_alt</mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="nostyle" routerLink="/tunnelFlights" routerLinkActive="active" skipLocationChange>
|
||||
<img src="assets/img/tunnel.jpg" alt="Tunnel flights" style="width: 128px; height:128px; font-size: 128px;" />
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="nostyle"
|
||||
routerLink="/summary"
|
||||
routerLinkActive="active"
|
||||
skipLocationChange
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Summary"
|
||||
style="width: 128px; height: 128px; font-size: 128px"
|
||||
fontIcon="timeline"
|
||||
></mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="nostyle"
|
||||
routerLink="/newjump"
|
||||
routerLinkActive="active"
|
||||
skipLocationChange
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="Add jumps"
|
||||
style="width: 128px; height: 128px; font-size: 128px"
|
||||
fontIcon="add_circle"
|
||||
></mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="nostyle"
|
||||
routerLink="/jumps"
|
||||
routerLinkActive="active"
|
||||
skipLocationChange
|
||||
>
|
||||
<mat-icon
|
||||
aria-hidden="false"
|
||||
aria-label="List of jumps"
|
||||
style="width: 128px; height: 128px; font-size: 128px"
|
||||
fontIcon="list_alt"
|
||||
></mat-icon>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
class="nostyle"
|
||||
routerLink="/tunnelFlights"
|
||||
routerLinkActive="active"
|
||||
skipLocationChange
|
||||
>
|
||||
<img
|
||||
src="assets/img/tunnel.jpg"
|
||||
alt="Tunnel flights"
|
||||
style="width: 128px; height: 128px; font-size: 128px"
|
||||
/>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -5,11 +5,13 @@ import {
|
||||
Validators,
|
||||
ReactiveFormsModule,
|
||||
} from "@angular/forms";
|
||||
import { AuthenticationService } from "../../services/authentication.service";
|
||||
import { User } from "../../models/user";
|
||||
import { ListOfImagesComponent } from "../list-of-images/list-of-images.component";
|
||||
import { MatLabel, MatFormFieldModule } from "@angular/material/form-field";
|
||||
import { TranslateModule } from "@ngx-translate/core";
|
||||
import { TranslateModule, TranslatePipe } from "@ngx-translate/core";
|
||||
import { MatInputModule } from "@angular/material/input";
|
||||
import { MatButtonModule } from "@angular/material/button";
|
||||
|
||||
import { AuthenticationService } from "../../services/authentication.service";
|
||||
import { ListOfImagesComponent } from "../list-of-images/list-of-images.component";
|
||||
|
||||
@Component({
|
||||
selector: "app-user-profile",
|
||||
@@ -17,10 +19,12 @@ import { TranslateModule } from "@ngx-translate/core";
|
||||
styleUrls: ["./user-profile.component.css"],
|
||||
imports: [
|
||||
ListOfImagesComponent,
|
||||
ReactiveFormsModule,
|
||||
MatLabel,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatButtonModule,
|
||||
TranslateModule,
|
||||
ReactiveFormsModule,
|
||||
],
|
||||
})
|
||||
export class UserProfileComponent implements OnInit {
|
||||
|
||||
@@ -1,48 +0,0 @@
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/Material-Icons-Fallback.woff2) format('woff2');
|
||||
}
|
||||
|
||||
/* .material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-moz-font-feature-settings: 'liga';
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
} */
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px; /* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
/* Support for IE. */
|
||||
font-feature-settings: 'liga';
|
||||
}
|
||||
@@ -1,168 +0,0 @@
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Cyrillic-ext.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Cyrillic.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* greek-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Greek-ext.woff2) format('woff2');
|
||||
unicode-range: U+1F00-1FFF;
|
||||
}
|
||||
/* greek */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Greek.woff2) format('woff2');
|
||||
unicode-range: U+0370-03FF;
|
||||
}
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Vietnamese.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Latin-ext.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../font/300/Latin.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Cyrillic-ext.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Cyrillic.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* greek-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Greek-ext.woff2) format('woff2');
|
||||
unicode-range: U+1F00-1FFF;
|
||||
}
|
||||
/* greek */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Greek.woff2) format('woff2');
|
||||
unicode-range: U+0370-03FF;
|
||||
}
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Vietnamese.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Latin-ext.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/400/Latin.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Cyrillic-ext.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Cyrillic.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* greek-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Greek-ext.woff2) format('woff2');
|
||||
unicode-range: U+1F00-1FFF;
|
||||
}
|
||||
/* greek */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Greek.woff2) format('woff2');
|
||||
unicode-range: U+0370-03FF;
|
||||
}
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Vietnamese.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Latin-ext.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url(../font/500/Latin.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
@@ -1,6 +1,18 @@
|
||||
/* These tokens are generated using https://themes.angular-material.dev/ */
|
||||
/* Preview: https://themes.angular-material.dev/?seed-error=%23FF5449&seed-neutral=%23938F94&seed-neutral-variant=%23948F99&seed-primary=%236750A4&seed-secondary=%23958DA4&seed-tertiary=%23B58392 */
|
||||
/* Preview: https://themes.angular-material.dev/?bold-font-weight=700&brand-font-family=Roboto&medium-font-weight=500&plain-font-family=Roboto®ular-font-weight=400&seed-error=%23FF5449&seed-neutral=%23938F94&seed-neutral-variant=%23948F99&seed-primary=%236750A4&seed-secondary=%23958DA4&seed-tertiary=%23B58392 */
|
||||
/* Seed Colors: primary: #6750A4, secondary: #958DA4, tertiary: #B58392, error: #FF5449, neutral: #938F94, neutral-variant: #948F99 */
|
||||
/* Seed Typography: plain-font-family: Roboto, brand-font-family: Roboto, bold-font-weight: 700, medium-font-weight: 500, regular-font-weight: 400 */
|
||||
|
||||
/* Make sure to import fonts in `<head>` of html */
|
||||
/*
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto&family=Roboto&display=swap');
|
||||
</style>
|
||||
|
||||
OR
|
||||
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&family=Roboto&display=swap">
|
||||
*/
|
||||
|
||||
@use "@angular/material" as mat;
|
||||
|
||||
@@ -127,122 +139,67 @@
|
||||
));
|
||||
}
|
||||
|
||||
/* Typography */
|
||||
:root, :host {
|
||||
/* core typography tokens are not generating css variables, hence below */
|
||||
--mat-sys-brand-font-family: Roboto;
|
||||
--mat-sys-plain-font-family: Roboto;
|
||||
--mat-sys-bold-font-weight: 700;
|
||||
--mat-sys-medium-font-weight: 500;
|
||||
--mat-sys-regular-font-weight: 400;
|
||||
|
||||
// https://theme-builder-1623190217839.web.app/
|
||||
|
||||
// @use '@angular/material' as mat;
|
||||
|
||||
// @import "Material-Icons";
|
||||
// @import "Roboto";
|
||||
|
||||
/*
|
||||
// Be sure that you only ever include this mixin once!
|
||||
@include mat.core();
|
||||
|
||||
// Define your theme with color palettes, typography and density
|
||||
|
||||
$mat-theme-primary-palette: map-merge(mat.$cyan-palette, ( contrast: (100: #150c4a,)));
|
||||
$mat-theme-primary: mat.define-palette(
|
||||
$mat-theme-primary-palette,
|
||||
$default: 100,
|
||||
$lighter: 100,
|
||||
$darker: 700,
|
||||
$text: 500
|
||||
);
|
||||
|
||||
$mat-theme-accent-palette: map-merge(mat.$teal-palette, ( 501: #4d77b6,contrast: (501: white,A100: white,A200: white,)));
|
||||
$mat-theme-accent: mat.define-palette(
|
||||
$mat-theme-accent-palette,
|
||||
$default: 501,
|
||||
$lighter: A100,
|
||||
$darker: A200,
|
||||
$text: 600
|
||||
);
|
||||
|
||||
$mat-theme-warn-palette: map-merge(mat.$pink-palette, ( ));
|
||||
$mat-theme-warn: mat.define-palette(
|
||||
$mat-theme-warn-palette,
|
||||
$default: A200,
|
||||
$lighter: 500,
|
||||
$darker: 500,
|
||||
$text: A700
|
||||
);
|
||||
|
||||
$mat-dark-theme-primary-palette: map-merge(mat.$lime-palette, ( contrast: (200: #030844,A100: rgba(0,0,0, 0.87),A700: rgba(0,0,0, 0.87),)));
|
||||
$mat-dark-theme-primary: mat.define-palette(
|
||||
$mat-dark-theme-primary-palette,
|
||||
$default: 200,
|
||||
$lighter: A100,
|
||||
$darker: A700,
|
||||
$text: 700
|
||||
);
|
||||
|
||||
$mat-dark-theme-accent-palette: map-merge(mat.$green-palette, ( contrast: (A200: black,50: black,A400: black,)));
|
||||
$mat-dark-theme-accent: mat.define-palette(
|
||||
$mat-dark-theme-accent-palette,
|
||||
$default: A200,
|
||||
$lighter: 50,
|
||||
$darker: A400,
|
||||
$text: A100
|
||||
);
|
||||
|
||||
$mat-dark-theme-warn-palette: map-merge(mat.$pink-palette, ( contrast: (A100: black,100: white,)));
|
||||
$mat-dark-theme-warn: mat.define-palette(
|
||||
$mat-dark-theme-warn-palette,
|
||||
$default: A100,
|
||||
$lighter: 100,
|
||||
$darker: A700,
|
||||
$text: 100
|
||||
);
|
||||
|
||||
// @import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300&display=swap');
|
||||
|
||||
$mat-typography: mat.define-typography-config(
|
||||
$font-family: 'Rubik',
|
||||
$display-4: mat.define-typography-level($font-size: 96px, $font-weight: 300, $font-family: Rubik),
|
||||
$display-3: mat.define-typography-level($font-size: 60px, $font-weight: 500, $font-family: Rubik),
|
||||
$display-2: mat.define-typography-level($font-size: 48px, $font-weight: 500, $font-family: Rubik),
|
||||
$display-1: mat.define-typography-level($font-size: 34px, $font-weight: 500, $font-family: Rubik),
|
||||
$headline: mat.define-typography-level($font-size: 24px, $font-weight: 500, $font-family: Rubik),
|
||||
$title: mat.define-typography-level($font-size: 20px, $font-weight: 500, $font-family: Rubik),
|
||||
$subheading-2: mat.define-typography-level($font-size: 18px, $font-weight: 500, $font-family: Rubik),
|
||||
$subheading-1: mat.define-typography-level($font-size: 20px, $font-weight: 500, $font-family: Rubik),
|
||||
$body-2: mat.define-typography-level($font-size: 16px, $font-weight: 400, $font-family: Rubik),
|
||||
$body-1: mat.define-typography-level($font-size: 18px, $font-weight: 400, $font-family: Rubik),
|
||||
$caption: mat.define-typography-level($font-size: 16px, $font-weight: Medium, $font-family: Rubik),
|
||||
$button: mat.define-typography-level($font-size: 16px, $font-weight: 500, $font-family: Rubik),
|
||||
// Line-height must be unit-less fraction of the font-size.
|
||||
$input: mat.define-typography-level($font-size: inherit, $line-height: 1.125, $font-weight: 500, $font-family: Rubik),
|
||||
);
|
||||
|
||||
$mat-density: 0;
|
||||
// @include mat.elevation(
|
||||
// $zValue: 12,
|
||||
// $color: #000,
|
||||
// $opacity: 0.5
|
||||
// );
|
||||
|
||||
$mat-core-theme: mat.define-light-theme((
|
||||
color: (
|
||||
primary: $mat-theme-primary,
|
||||
accent: $mat-theme-accent,
|
||||
warn: $mat-theme-warn
|
||||
),
|
||||
typography: $mat-typography,
|
||||
density: $mat-density
|
||||
@include mat.theme-overrides((
|
||||
brand-family: Roboto,
|
||||
plain-family: Roboto,
|
||||
bold-weight: 700,
|
||||
medium-weight: 500,
|
||||
regular-weight: 400,
|
||||
headline-large-font: var(--mat-sys-brand-font-family),
|
||||
headline-medium-font: var(--mat-sys-brand-font-family),
|
||||
headline-small-font: var(--mat-sys-brand-font-family),
|
||||
display-large-font: var(--mat-sys-brand-font-family),
|
||||
display-medium-font: var(--mat-sys-brand-font-family),
|
||||
display-small-font: var(--mat-sys-brand-font-family),
|
||||
title-large-font: var(--mat-sys-brand-font-family),
|
||||
body-large: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size) / var(--mat-sys-body-large-line-height) var(--mat-sys-body-large-font),
|
||||
body-medium: var(--mat-sys-body-medium-weight) var(--mat-sys-body-medium-size) / var(--mat-sys-body-medium-line-height) var(--mat-sys-body-medium-font),
|
||||
body-small: var(--mat-sys-body-small-weight) var(--mat-sys-body-small-size) / var(--mat-sys-body-small-line-height) var(--mat-sys-body-small-font),
|
||||
label-large: var(--mat-sys-label-large-weight) var(--mat-sys-label-large-size) / var(--mat-sys-label-large-line-height) var(--mat-sys-label-large-font),
|
||||
label-medium: var(--mat-sys-label-medium-weight) var(--mat-sys-label-medium-size) / var(--mat-sys-label-medium-line-height) var(--mat-sys-label-medium-font),
|
||||
label-small: var(--mat-sys-label-small-weight) var(--mat-sys-label-small-size) / var(--mat-sys-label-small-line-height) var(--mat-sys-label-small-font),
|
||||
title-large: var(--mat-sys-title-large-weight) var(--mat-sys-title-large-size) / var(--mat-sys-title-large-line-height) var(--mat-sys-title-large-font),
|
||||
title-medium: var(--mat-sys-title-medium-weight) var(--mat-sys-title-medium-size) / var(--mat-sys-title-medium-line-height) var(--mat-sys-title-medium-font),
|
||||
title-small: var(--mat-sys-title-small-weight) var(--mat-sys-title-small-size) / var(--mat-sys-title-small-line-height) var(--mat-sys-title-small-font),
|
||||
headline-large: var(--mat-sys-headline-large-weight) var(--mat-sys-headline-large-size) / var(--mat-sys-headline-large-line-height) var(--mat-sys-headline-large-font),
|
||||
headline-medium: var(--mat-sys-headline-medium-weight) var(--mat-sys-headline-medium-size) / var(--mat-sys-headline-medium-line-height) var(--mat-sys-headline-medium-font),
|
||||
headline-small: var(--mat-sys-headline-small-weight) var(--mat-sys-headline-small-size) / var(--mat-sys-headline-small-line-height) var(--mat-sys-headline-small-font),
|
||||
display-large: var(--mat-sys-display-large-weight) var(--mat-sys-display-large-size) / var(--mat-sys-display-large-line-height) var(--mat-sys-display-large-font),
|
||||
display-medium: var(--mat-sys-display-medium-weight) var(--mat-sys-display-medium-size) / var(--mat-sys-display-medium-line-height) var(--mat-sys-display-medium-font),
|
||||
display-small: var(--mat-sys-display-small-weight) var(--mat-sys-display-small-size) / var(--mat-sys-display-small-line-height) var(--mat-sys-display-small-font),
|
||||
body-large-font: var(--mat-sys-plain-font-family),
|
||||
body-medium-font: var(--mat-sys-plain-font-family),
|
||||
body-small-font: var(--mat-sys-plain-font-family),
|
||||
label-large-font: var(--mat-sys-plain-font-family),
|
||||
label-medium-font: var(--mat-sys-plain-font-family),
|
||||
label-small-font: var(--mat-sys-plain-font-family),
|
||||
title-medium-font: var(--mat-sys-plain-font-family),
|
||||
title-small-font: var(--mat-sys-plain-font-family),
|
||||
label-large-weight-prominent: var(--mat-sys-bold-font-weight),
|
||||
label-medium-weight-prominent: var(--mat-sys-bold-font-weight),
|
||||
label-large-weight: var(--mat-sys-medium-font-weight),
|
||||
label-medium-weight: var(--mat-sys-medium-font-weight),
|
||||
label-small-weight: var(--mat-sys-medium-font-weight),
|
||||
title-medium-weight: var(--mat-sys-medium-font-weight),
|
||||
title-small-weight: var(--mat-sys-medium-font-weight),
|
||||
body-large-weight: var(--mat-sys-regular-font-weight),
|
||||
body-medium-weight: var(--mat-sys-regular-font-weight),
|
||||
body-small-weight: var(--mat-sys-regular-font-weight),
|
||||
display-large-weight: var(--mat-sys-regular-font-weight),
|
||||
display-medium-weight: var(--mat-sys-regular-font-weight),
|
||||
display-small-weight: var(--mat-sys-regular-font-weight),
|
||||
headline-large-weight: var(--mat-sys-regular-font-weight),
|
||||
headline-medium-weight: var(--mat-sys-regular-font-weight),
|
||||
headline-small-weight: var(--mat-sys-regular-font-weight),
|
||||
title-large-weight: var(--mat-sys-regular-font-weight),
|
||||
));
|
||||
|
||||
$mat-dark-theme: mat.define-dark-theme((
|
||||
color: (
|
||||
primary: $mat-dark-theme-primary,
|
||||
accent: $mat-dark-theme-accent,
|
||||
warn: $mat-dark-theme-warn,
|
||||
)
|
||||
));
|
||||
|
||||
@include mat.all-component-themes($mat-core-theme);
|
||||
|
||||
.dark-theme {
|
||||
@include mat.all-component-colors($mat-dark-theme);
|
||||
}
|
||||
*/
|
||||
}
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -9,6 +9,10 @@
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
|
||||
/>
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico" />
|
||||
|
||||
<style>
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto&family=Roboto&display=swap");
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="mat-app-background">
|
||||
|
||||
Reference in New Issue
Block a user