MycroftAI
/
selene-ui
mirror of https://github.com/MycroftAI/selene-ui.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

updated CSS that was missed when converting to Material 14

test
Chris Veilleux 2022-10-14 15:54:10 -05:00
parent 8e230b28c8
commit 0f48d969f9
2 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
projects/sso/src/app/modules/new-account/authentication-step/authentication-step.component.html
View File

@ -6,12 +6,14 @@
<mat-card class="mat-elevation-z0"> <mat-card class="mat-elevation-z0">
<h2 class="mat-h2">Log In With...</h2> <h2 class="mat-h2">Log In With...</h2>
<p class="mat-body">{{federatedLoginText}}</p> <p class="mat-body">{{federatedLoginText}}</p>
<sso-google-button (googleToken)="onFederatedLogin($event)"></sso-google-button> <div id="federated-buttons">
<sso-facebook-button (facebookToken)="onFederatedLogin($event)"></sso-facebook-button> <sso-google-button (googleToken)="onFederatedLogin($event)"></sso-google-button>
<sso-github-button [newAccount]="true"></sso-github-button> <sso-facebook-button (facebookToken)="onFederatedLogin($event)"></sso-facebook-button>
<p [hidden]="!federatedErrorMessage" id="federated-error" class="mat-body"> <sso-github-button [newAccount]="true"></sso-github-button>
{{federatedErrorMessage}} <p [hidden]="!federatedErrorMessage" id="federated-error" class="mat-body">
</p> {{federatedErrorMessage}}
</p>
</div>
</mat-card> </mat-card>
<h1 class="mat-h1">OR</h1> <h1 class="mat-h1">OR</h1>

12
projects/sso/src/app/modules/new-account/authentication-step/authentication-step.component.scss
View File

@ -1,5 +1,5 @@
@import "@angular/material/theming"; @use "@angular/material" as mat;
@import "src/stylesheets/mycroft-theme"; @use "mycroft-theme" as theme;
mat-card { mat-card {
margin-left: auto; margin-left: auto;
@ -7,7 +7,7 @@ mat-card {
max-width: 800px; max-width: 800px;
mat-card-title { mat-card-title {
color: mat-color($mycroft-primary); color: mat.get-color-from-palette(theme.$mycroft-primary, 500);
} }
mat-card { mat-card {
@ -15,16 +15,16 @@ mat-card {
max-width: 400px; max-width: 400px;
.mat-h2 { .mat-h2 {
color: mat-color($mycroft-accent, A700); color: mat.get-color-from-palette(theme.$mycroft-accent, A700);
font-size: 20px; font-size: 20px;
} }
#federated-error { #federated-error {
color: mat-color($mycroft-warn) color: mat.get-color-from-palette(theme.$mycroft-warn, 500);
} }
} }
.mat-h1 { .mat-h1 {
color: mat-color($mycroft-primary); color: mat.get-color-from-palette(theme.$mycroft-primary, 500);
padding: 32px; padding: 32px;
} }
} }