changed stylesheets to use refactored theming files
parent
221ec8cc6b
commit
1e7656308a
|
@ -1,3 +1,4 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import "mycroft-colors";
|
@import "mycroft-colors";
|
||||||
|
|
||||||
/* Split the screen in half */
|
/* Split the screen in half */
|
||||||
|
@ -14,7 +15,7 @@
|
||||||
/* Top Half */
|
/* Top Half */
|
||||||
.top {
|
.top {
|
||||||
top: 0;
|
top: 0;
|
||||||
background-color: $mycroft-primary;
|
background-color: mat-color($mycroft-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Bottom Half */
|
/* Bottom Half */
|
||||||
|
@ -30,7 +31,7 @@ mat-tab-group {
|
||||||
}
|
}
|
||||||
|
|
||||||
.login-options {
|
.login-options {
|
||||||
background-color: $mycroft-white;
|
background-color: mat-contrast($mycroft-primary, 500);
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||||
width: 320px;
|
width: 320px;
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import "mycroft-colors";
|
@import "mycroft-colors";
|
||||||
|
|
||||||
/* Split the screen in half */
|
/* Split the screen in half */
|
||||||
|
@ -15,7 +16,7 @@
|
||||||
#top-half {
|
#top-half {
|
||||||
@include half-screen;
|
@include half-screen;
|
||||||
top: 0;
|
top: 0;
|
||||||
background-color: $mycroft-primary;
|
background-color: mat-color($mycroft-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Bottom Half */
|
/* Bottom Half */
|
||||||
|
|
|
@ -1,32 +1,27 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import 'mycroft-colors';
|
@import 'mycroft-colors';
|
||||||
@import "components/buttons";
|
@import "components/buttons";
|
||||||
|
|
||||||
form {
|
form {
|
||||||
background-color: $mycroft-white;
|
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
|
||||||
fa-icon {
|
fa-icon {
|
||||||
color: $mycroft-dark-grey;
|
color: mat-color($mycroft-accent, A700);
|
||||||
margin-right: 15px;
|
margin-right: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
mat-checkbox {
|
mat-checkbox {
|
||||||
color: $mycroft-dark-grey;
|
color: mat-color($mycroft-accent, A700);
|
||||||
}
|
}
|
||||||
#forgot-password {
|
#forgot-password {
|
||||||
margin-left: 30px;
|
margin-left: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
@include action-button;
|
@include action-button-primary;
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: $mycroft-tertiary-green;
|
|
||||||
color: $mycroft-secondary;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,14 +1,15 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import 'mycroft-colors';
|
@import 'mycroft-colors';
|
||||||
|
|
||||||
#login-options {
|
#login-options {
|
||||||
background-color: $mycroft-white;
|
background-color: mat-contrast($mycroft-primary, 500);
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||||
width: 320px;
|
width: 320px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mat-subheading-2 {
|
.mat-subheading-2 {
|
||||||
color: $mycroft-dark-grey;
|
color: mat-color($mycroft-accent, A700);
|
||||||
margin-bottom: -15px;
|
margin-bottom: -15px;
|
||||||
margin-top: -15px;
|
margin-top: -15px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
|
@ -1,8 +1,9 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import 'mycroft-colors';
|
@import 'mycroft-colors';
|
||||||
|
|
||||||
@mixin login-button {
|
@mixin login-button {
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
color: $mycroft-white;
|
color: mat-contrast($mycroft-primary, 500);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
width: 280px;
|
width: 280px;
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
@import "~@angular/material/theming";
|
||||||
@import "mycroft-colors";
|
@import "mycroft-colors";
|
||||||
|
|
||||||
// The angular material spinner was limiting in color choices we built our own
|
// The angular material spinner was limiting in color choices we built our own
|
||||||
|
@ -15,7 +16,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.mat-h3 {
|
.mat-h3 {
|
||||||
color: $mycroft-secondary;
|
color: mat-color($mycroft-accent);
|
||||||
font-size: 40px;
|
font-size: 40px;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -23,6 +24,6 @@
|
||||||
|
|
||||||
#logout-spinner {
|
#logout-spinner {
|
||||||
@include spinner-common;
|
@include spinner-common;
|
||||||
border-right-color: $mycroft-secondary;
|
border-right-color: mat-color($mycroft-accent);
|
||||||
border-top-color: $mycroft-secondary;
|
border-top-color: mat-color($mycroft-accent);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue