parent
17c3d1ade1
commit
9286d91031
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,11 +1,4 @@
|
|||||||
.inline-spinner {
|
.inline-spinner {
|
||||||
display: inline-flex !important;
|
display: inline-flex !important;
|
||||||
top: 0px !important;
|
top: 0 !important;
|
||||||
}
|
|
||||||
|
|
||||||
.icon-pinned {
|
|
||||||
padding-left: 16px;
|
|
||||||
width:24px;
|
|
||||||
height:24px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
}
|
||||||
|
@ -1,19 +1,19 @@
|
|||||||
$font-family: 'Roboto', sans-serif;
|
$font-family: 'Roboto', sans-serif;
|
||||||
|
|
||||||
$nodes-toolbar-height: 5.2rem;
|
$nodes-toolbar-height: 52px;
|
||||||
$horizontal-toolbar-height: 6rem;
|
$horizontal-toolbar-height: 60px;
|
||||||
|
|
||||||
$font-family: 'Roboto', sans-serif;
|
$font-family: 'Roboto', sans-serif;
|
||||||
$font-size: 1.4rem;
|
$font-size: 1.4rem;
|
||||||
$toolbar-height: 4.8rem;
|
$toolbar-height: 48px;
|
||||||
$regular-sidenav-width: 22rem;
|
$regular-sidenav-width: 220px;
|
||||||
$compact-sidenav-width: 18.5rem;
|
$compact-sidenav-width: 185px;
|
||||||
$mini-sidenav-width: 10rem;
|
$mini-sidenav-width: 100px;
|
||||||
$sidenav-info-height: 9rem;
|
$sidenav-info-height: 90px;
|
||||||
$settings-nav-width: 15rem;
|
$settings-nav-width: 150px;
|
||||||
$gap: 0.8rem;
|
$gap: 8px;
|
||||||
$icon-size: 3.6rem;
|
$icon-size: 3.6rem;
|
||||||
$pubkey-info-height: 1.5rem;
|
$pubkey-info-height: 15px;
|
||||||
|
$tree-node-height:48px;
|
||||||
$fa-icon-small-size: 2rem;
|
$fa-icon-small-size: 2rem;
|
||||||
$fa-icon-regular-size: 4rem;
|
$fa-icon-regular-size: 4rem;
|
@ -1,48 +1,73 @@
|
|||||||
@import '~@angular/material/theming';
|
@import '~@angular/material/theming';
|
||||||
@include mat-core();
|
@include mat-core();
|
||||||
@import 'change-theme';
|
@import 'change-theme';
|
||||||
|
@import 'typography';
|
||||||
|
|
||||||
.rtl-container{
|
.rtl-container{
|
||||||
&.purple-white-light-theme {
|
&.purple-white-light-theme {
|
||||||
@debug "PURPLE LIGHT THEME";
|
@debug "PURPLE LIGHT THEME";
|
||||||
@import "../skins/light-purple";
|
@import "../skins/light-purple";
|
||||||
@include angular-material-theme($purple-white-light-theme);
|
@include angular-material-theme($purple-white-light-theme);
|
||||||
@include change-theme($purple-white-light-theme, $alternate-purple-white-light-theme);
|
@include change-theme($purple-white-light-theme, $alternate-purple-white-light-theme);
|
||||||
}
|
&.small-font {@include mat-core($small-typography);}
|
||||||
&.purple-white-dark-theme {
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
@debug "PURPLE DARK THEME";
|
&.large-font {@include mat-core($large-typography);}
|
||||||
@import "../skins/dark-purple";
|
}
|
||||||
@include angular-material-theme($purple-white-dark-small-theme);
|
&.purple-white-dark-theme {
|
||||||
@include change-theme($purple-white-dark-small-theme, $alternate-purple-white-dark-theme);
|
@debug "PURPLE DARK THEME";
|
||||||
}
|
@import "../skins/dark-purple";
|
||||||
&.light-blue{
|
@include angular-material-theme($purple-white-dark-theme);
|
||||||
@import "../skins/light-blue";
|
@include change-theme($purple-white-dark-theme, $alternate-purple-white-dark-theme);
|
||||||
@include angular-material-theme($blue-light-theme);
|
&.small-font {@include mat-core($small-typography);}
|
||||||
@include change-theme($blue-light-theme, $alternate-blue-light-theme);
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
|
}
|
||||||
|
&.light-blue{
|
||||||
|
@import "../skins/light-blue";
|
||||||
|
@include angular-material-theme($blue-light-theme);
|
||||||
|
@include change-theme($blue-light-theme, $alternate-blue-light-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
&.light-teal{
|
&.light-teal{
|
||||||
@import "../skins/light-teal";
|
@import "../skins/light-teal";
|
||||||
@include angular-material-theme($teal-light-theme);
|
@include angular-material-theme($teal-light-theme);
|
||||||
@include change-theme($teal-light-theme, $alternate-teal-light-theme);
|
@include change-theme($teal-light-theme, $alternate-teal-light-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
&.light-blue-gray{
|
&.light-blue-gray{
|
||||||
@import "../skins/light-bluegray";
|
@import "../skins/light-bluegray";
|
||||||
@include angular-material-theme($blue-gray-light-theme);
|
@include angular-material-theme($blue-gray-light-theme);
|
||||||
@include change-theme($blue-gray-light-theme, $alternate-blue-gray-light-theme);
|
@include change-theme($blue-gray-light-theme, $alternate-blue-gray-light-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
&.dark-blue{
|
&.dark-blue{
|
||||||
@import "../skins/dark-blue";
|
@import "../skins/dark-blue";
|
||||||
@include angular-material-theme($blue-dark-theme);
|
@include angular-material-theme($blue-dark-theme);
|
||||||
@include change-theme($blue-dark-theme, $alternate-blue-dark-theme);
|
@include change-theme($blue-dark-theme, $alternate-blue-dark-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
&.dark-green{
|
&.dark-green{
|
||||||
@import "../skins/dark-green";
|
@import "../skins/dark-green";
|
||||||
@include angular-material-theme($green-dark-theme);
|
@include angular-material-theme($green-dark-theme);
|
||||||
@include change-theme($green-dark-theme, $alternate-green-dark-theme);
|
@include change-theme($green-dark-theme, $alternate-green-dark-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
&.dark-pink{
|
&.dark-pink{
|
||||||
@import "../skins/dark-pink";
|
@import "../skins/dark-pink";
|
||||||
@include angular-material-theme($pink-dark-theme);
|
@include angular-material-theme($pink-dark-theme);
|
||||||
@include change-theme($pink-dark-theme, $alternate-pink-dark-theme);
|
@include change-theme($pink-dark-theme, $alternate-pink-dark-theme);
|
||||||
|
&.small-font {@include mat-core($small-typography);}
|
||||||
|
&.regular-font {@include mat-core($regular-typography);}
|
||||||
|
&.large-font {@include mat-core($large-typography);}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -0,0 +1,47 @@
|
|||||||
|
$small-typography: mat-typography-config(
|
||||||
|
$display-4: (font-size: 100px, line-height: 105px, font-weight: 300),
|
||||||
|
$display-3: (font-size: 50px, line-height: 54px, font-weight: 400),
|
||||||
|
$display-2: (font-size: 40px, line-height: 45px, font-weight: 400),
|
||||||
|
$display-1: (font-size: 30px, line-height: 35px, font-weight: 400),
|
||||||
|
$headline: (font-size: 20px, line-height: 28px, font-weight: 400),
|
||||||
|
$title: (font-size: 16px, line-height: 28px, font-weight: 500),
|
||||||
|
$subheading-2: (font-size: 14px, line-height: 25px, font-weight: 400),
|
||||||
|
$subheading-1: (font-size: 13px, line-height: 23px, font-weight: 400),
|
||||||
|
$body-2: (font-size: 12px, line-height: 20px, font-weight: 500),
|
||||||
|
$body-1: (font-size: 12px, line-height: 18px, font-weight: 400),
|
||||||
|
$caption: (font-size: 10px, line-height: 18px, font-weight: 400),
|
||||||
|
$button: (font-size: 12px, line-height: 12px, font-weight: 500),
|
||||||
|
$input: (font-size: inherit, line-height: 1.125, font-weight: 400)
|
||||||
|
);
|
||||||
|
|
||||||
|
$regular-typography: mat-typography-config(
|
||||||
|
$display-4: (font-size: 112px, line-height: 112px, font-weight: 300),
|
||||||
|
$display-3: (font-size: 56px, line-height: 56px, font-weight: 400),
|
||||||
|
$display-2: (font-size: 45px, line-height: 48px, font-weight: 400),
|
||||||
|
$display-1: (font-size: 34px, line-height: 40px, font-weight: 400),
|
||||||
|
$headline: (font-size: 24px, line-height: 32px, font-weight: 400),
|
||||||
|
$title: (font-size: 20px, line-height: 32px, font-weight: 500),
|
||||||
|
$subheading-2: (font-size: 16px, line-height: 28px, font-weight: 400),
|
||||||
|
$subheading-1: (font-size: 15px, line-height: 24px, font-weight: 400),
|
||||||
|
$body-2: (font-size: 14px, line-height: 24px, font-weight: 500),
|
||||||
|
$body-1: (font-size: 14px, line-height: 20px, font-weight: 400),
|
||||||
|
$caption: (font-size: 12px, line-height: 20px, font-weight: 400),
|
||||||
|
$button: (font-size: 14px, line-height: 14px, font-weight: 500),
|
||||||
|
$input: (font-size: inherit, line-height: 1.125, font-weight: 400)
|
||||||
|
);
|
||||||
|
|
||||||
|
$large-typography: mat-typography-config(
|
||||||
|
$display-4: (font-size: 124px, line-height: 124px, font-weight: 300),
|
||||||
|
$display-3: (font-size: 62px, line-height: 62px, font-weight: 400),
|
||||||
|
$display-2: (font-size: 54px, line-height: 60px, font-weight: 400),
|
||||||
|
$display-1: (font-size: 40px, line-height: 46px, font-weight: 400),
|
||||||
|
$headline: (font-size: 30px, line-height: 36px, font-weight: 400),
|
||||||
|
$title: (font-size: 26px, line-height: 38px, font-weight: 500),
|
||||||
|
$subheading-2: (font-size: 20px, line-height: 32px, font-weight: 400),
|
||||||
|
$subheading-1: (font-size: 18px, line-height: 28px, font-weight: 400),
|
||||||
|
$body-2: (font-size: 16px, line-height: 26px, font-weight: 500),
|
||||||
|
$body-1: (font-size: 16px, line-height: 22px, font-weight: 400),
|
||||||
|
$caption: (font-size: 14px, line-height: 22px, font-weight: 400),
|
||||||
|
$button: (font-size: 16px, line-height: 16px, font-weight: 500),
|
||||||
|
$input: (font-size: inherit, line-height: 1.125, font-weight: 400)
|
||||||
|
);
|
Loading…
Reference in New Issue