REMOVE material-dashboard and bootstrap from angular json, add boostrap overwrite files to styles.scss, relevant fixes
This commit is contained in:
mchouliara
parent
b165d867f5
commit
9cedd91309
|
|
@ -25,8 +25,6 @@
|
||||||
{ "glob": "**/*", "input": "node_modules/tinymce", "output": "/tinymce/" }
|
{ "glob": "**/*", "input": "node_modules/tinymce", "output": "/tinymce/" }
|
||||||
],
|
],
|
||||||
"styles": [
|
"styles": [
|
||||||
"node_modules/bootstrap/dist/css/bootstrap.min.css",
|
|
||||||
"src/assets/scss/material-dashboard.scss",
|
|
||||||
"src/styles.scss",
|
"src/styles.scss",
|
||||||
"node_modules/cookieconsent/build/cookieconsent.min.css"
|
"node_modules/cookieconsent/build/cookieconsent.min.css"
|
||||||
],
|
],
|
||||||
|
|
@ -113,7 +111,6 @@
|
||||||
"tsConfig": "src/tsconfig.spec.json",
|
"tsConfig": "src/tsconfig.spec.json",
|
||||||
"scripts": [],
|
"scripts": [],
|
||||||
"styles": [
|
"styles": [
|
||||||
"src/assets/scss/material-dashboard.scss",
|
|
||||||
"src/styles.scss",
|
"src/styles.scss",
|
||||||
"node_modules/tinymce/tinymce.min.js"
|
"node_modules/tinymce/tinymce.min.js"
|
||||||
],
|
],
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
@use 'sass:math';
|
@use 'sass:math';
|
||||||
@import "assets/scss/core/_variables.scss";
|
|
||||||
|
|
||||||
.full-width{
|
.full-width{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
||||||
|
|
@ -31,8 +31,6 @@
|
||||||
|
|
||||||
.card-content {
|
.card-content {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-weight: 300;
|
|
||||||
font-size: 1rem;
|
|
||||||
letter-spacing: 0px;
|
letter-spacing: 0px;
|
||||||
color: var(--dark-gray);
|
color: var(--dark-gray);
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
|
|
@ -56,7 +54,6 @@
|
||||||
|
|
||||||
.personal-usage {
|
.personal-usage {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-weight: 300;
|
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
letter-spacing: 0px;
|
letter-spacing: 0px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
|
|
@ -348,7 +345,6 @@ mat-tab-group.my-mat-tab .mat-mdc-tab-header .mat-mdc-tab-label-container .mat-m
|
||||||
.new-releases-content {
|
.new-releases-content {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-size: 1rem;
|
|
||||||
letter-spacing: 0px;
|
letter-spacing: 0px;
|
||||||
color: var(--dark-gray);
|
color: var(--dark-gray);
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
letter-spacing: 0px;
|
letter-spacing: 0px;
|
||||||
color: var(--dark-gray);
|
color: var(--dark-gray);
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
margin: 3rem 0rem 3rem 0rem;
|
margin: 2rem 0rem 1.5rem 0rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.heading {
|
.heading {
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<ng-container>
|
<ng-container>
|
||||||
<nav class="navbar navbar-expand-lg fixed-navbar">
|
<nav class="fixed-navbar">
|
||||||
<div class="container-fluid h-100">
|
<div class="container-fluid d-flex align-items-center h-100">
|
||||||
<button class="hamburger change" id="hamburger" (click)="toggleMyNav($event)" [attr.aria-label]="'ALT-TEXT.HAMBURGER' | translate">
|
<button class="hamburger change" id="hamburger" (click)="toggleMyNav($event)" [attr.aria-label]="'ALT-TEXT.HAMBURGER' | translate">
|
||||||
<div class="icon-bar1"></div>
|
<div class="icon-bar1"></div>
|
||||||
<div class="icon-bar2"></div>
|
<div class="icon-bar2"></div>
|
||||||
|
|
@ -74,7 +74,7 @@
|
||||||
|
|
||||||
<ng-template #userSettingsTemplate>
|
<ng-template #userSettingsTemplate>
|
||||||
@if(this.isAuthenticated()) {
|
@if(this.isAuthenticated()) {
|
||||||
<button (click)="openProfile()" [matTooltip]="userName" style="border: none; background-color: transparent;">
|
<button (click)="openProfile()" [matTooltip]="userName" style="border: none; background-color: transparent; min-width: 48px; min-height: 48px">
|
||||||
<img alt="{{('ALT-TEXT.USER-OPTIONS' | translate) ?? 'user options'}}" mat-card-avatar class="my-mat-card-avatar" [src]="getPrincipalAvatar() ?? getDefaultAvatar()" (error)="this.applyFallbackAvatar($event)">
|
<img alt="{{('ALT-TEXT.USER-OPTIONS' | translate) ?? 'user options'}}" mat-card-avatar class="my-mat-card-avatar" [src]="getPrincipalAvatar() ?? getDefaultAvatar()" (error)="this.applyFallbackAvatar($event)">
|
||||||
</button>
|
</button>
|
||||||
}@else {
|
}@else {
|
||||||
|
|
|
||||||
|
|
@ -17,6 +17,7 @@ $mat-card-header-size: 40px !default;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-mat-card-avatar {
|
.my-mat-card-avatar {
|
||||||
height: $mat-card-header-size;
|
height: $mat-card-header-size;
|
||||||
width: $mat-card-header-size;
|
width: $mat-card-header-size;
|
||||||
|
|
@ -87,11 +88,11 @@ $mat-card-header-size: 40px !default;
|
||||||
|
|
||||||
.hamburger {
|
.hamburger {
|
||||||
all:unset;
|
all:unset;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 0.6rem;
|
padding: 0.6rem;
|
||||||
margin-left: 0.8rem;
|
margin-left: 0.8rem;
|
||||||
margin-right: 0.8rem;
|
margin-right: 0.8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hamburger:hover, .hamburger:focus {
|
.hamburger:hover, .hamburger:focus {
|
||||||
|
|
|
||||||
|
|
@ -253,7 +253,7 @@ a:hover {
|
||||||
letter-spacing: 0px;
|
letter-spacing: 0px;
|
||||||
color: var(--dark-gray);
|
color: var(--dark-gray);
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
margin: 3rem 0rem 3rem 0rem;
|
margin: 2rem 0rem 1.5rem 0rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-icon {
|
.link-icon {
|
||||||
|
|
|
||||||
|
|
@ -1,143 +1,147 @@
|
||||||
$mat-card-header-size: 30px !default;
|
$mat-card-header-size: 30px !default;
|
||||||
|
.sidebar-wrapper {
|
||||||
.logo-img {
|
height: 100%;
|
||||||
width: 60px;
|
display: flex;
|
||||||
display: block;
|
flex-direction: column;
|
||||||
max-height: none;
|
.logo-img {
|
||||||
margin-left: 50px;
|
width: 60px;
|
||||||
}
|
display: block;
|
||||||
|
max-height: none;
|
||||||
.logo-img img {
|
margin-left: 50px;
|
||||||
width: 155px;
|
}
|
||||||
top: 0px;
|
|
||||||
position: inherit;
|
.logo-img img {
|
||||||
}
|
width: 155px;
|
||||||
|
top: 0px;
|
||||||
.sidebarSubtitle p {
|
position: inherit;
|
||||||
margin-left: 20px;
|
}
|
||||||
color: rgb(166, 166, 166);
|
|
||||||
}
|
.sidebarSubtitle p {
|
||||||
|
margin-left: 20px;
|
||||||
.nav hr {
|
color: rgb(166, 166, 166);
|
||||||
border-top: 1px solid #fff;
|
}
|
||||||
border-bottom: 1px solid #E1E1E1;
|
|
||||||
}
|
.nav hr {
|
||||||
|
border-top: 1px solid #fff;
|
||||||
.sidebar-footer {
|
border-bottom: 1px solid #E1E1E1;
|
||||||
margin-top: auto;
|
}
|
||||||
}
|
|
||||||
|
.sidebar-footer {
|
||||||
.sidebar-nav {
|
margin-top: auto;
|
||||||
background: white;
|
}
|
||||||
height: 70px;
|
|
||||||
}
|
.sidebar-nav {
|
||||||
|
background: white;
|
||||||
.nav-row {
|
height: 70px;
|
||||||
display: flex;
|
}
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
.nav-row {
|
||||||
width: 100%;
|
display: flex;
|
||||||
padding: 0.5rem 0.8rem 0.5rem 1.2rem;
|
flex-direction: row;
|
||||||
text-align: left;
|
align-items: center;
|
||||||
letter-spacing: 0px;
|
width: 100%;
|
||||||
color: #000000;
|
padding: 0.5rem 0.8rem 0.5rem 1.2rem;
|
||||||
opacity: 1;
|
text-align: left;
|
||||||
font-size:0.93rem;
|
letter-spacing: 0px;
|
||||||
}
|
color: #000000;
|
||||||
|
opacity: 1;
|
||||||
.nav-subrow {
|
font-size:0.93rem;
|
||||||
display: flex;
|
}
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
.nav-subrow {
|
||||||
width: 100%;
|
display: flex;
|
||||||
text-align: left;
|
flex-direction: row;
|
||||||
letter-spacing: 0px;
|
align-items: center;
|
||||||
color: #000000;
|
width: 100%;
|
||||||
opacity: 1;
|
text-align: left;
|
||||||
font-size:0.93rem;
|
letter-spacing: 0px;
|
||||||
}
|
color: #000000;
|
||||||
|
opacity: 1;
|
||||||
.nav-row:hover, .nav-row:focus {
|
font-size:0.93rem;
|
||||||
background-color: #ececec;
|
}
|
||||||
border-radius: 6px;
|
|
||||||
}
|
.nav-row:hover, .nav-row:focus {
|
||||||
|
background-color: #ececec;
|
||||||
.icon {
|
border-radius: 6px;
|
||||||
width: 24px;
|
}
|
||||||
height: 24px;
|
|
||||||
vertical-align: middle;
|
.icon {
|
||||||
color: #6B6B6B;
|
width: 24px;
|
||||||
}
|
height: 24px;
|
||||||
|
vertical-align: middle;
|
||||||
.nav-row span {
|
color: #6B6B6B;
|
||||||
padding-left: 1.5rem;
|
}
|
||||||
}
|
|
||||||
|
.nav-row span {
|
||||||
.mat-list {
|
padding-left: 1.5rem;
|
||||||
padding-top: 0px !important;
|
}
|
||||||
display: flex !important;
|
|
||||||
}
|
.mat-list {
|
||||||
|
padding-top: 0px !important;
|
||||||
.mat-list div {
|
display: flex !important;
|
||||||
width: 100%;
|
}
|
||||||
}
|
|
||||||
|
.mat-list div {
|
||||||
|
width: 100%;
|
||||||
.my-mat-card-avatar {
|
}
|
||||||
height: $mat-card-header-size;
|
|
||||||
width: $mat-card-header-size;
|
|
||||||
border-radius: 50%;
|
.my-mat-card-avatar {
|
||||||
flex-shrink: 0;
|
height: $mat-card-header-size;
|
||||||
margin-right: 7px;
|
width: $mat-card-header-size;
|
||||||
}
|
border-radius: 50%;
|
||||||
|
flex-shrink: 0;
|
||||||
.nav-list-item-hidden {
|
margin-right: 7px;
|
||||||
display: none !important;
|
}
|
||||||
}
|
|
||||||
|
.nav-list-item-hidden {
|
||||||
.login {
|
display: none !important;
|
||||||
margin-top: 15px !important;
|
}
|
||||||
}
|
|
||||||
|
.login {
|
||||||
.login-label {
|
margin-top: 15px !important;
|
||||||
text-transform: uppercase;
|
}
|
||||||
}
|
|
||||||
|
.login-label {
|
||||||
.firstSubtitle {
|
text-transform: uppercase;
|
||||||
margin-top: 20px;
|
}
|
||||||
}
|
|
||||||
|
.firstSubtitle {
|
||||||
.icon-mask {
|
margin-top: 20px;
|
||||||
color: #6b6b6b;
|
}
|
||||||
transform: translate(-8px, 8px);
|
|
||||||
}
|
.icon-mask {
|
||||||
|
color: #6b6b6b;
|
||||||
.active a {
|
transform: translate(-8px, 8px);
|
||||||
font-weight: 700;
|
}
|
||||||
}
|
|
||||||
|
.active a {
|
||||||
.active a i {
|
font-weight: 700;
|
||||||
color: var(--primary-color);
|
}
|
||||||
}
|
|
||||||
|
.active a i {
|
||||||
.inner-line {
|
color: var(--primary-color);
|
||||||
margin-left: 12px;
|
}
|
||||||
margin-right: 10px;
|
|
||||||
width: 20px;
|
.inner-line {
|
||||||
height: 13px;
|
margin-left: 12px;
|
||||||
border-left: 1px solid #cccccc;
|
margin-right: 10px;
|
||||||
border-bottom: 1px solid #cccccc;
|
width: 20px;
|
||||||
}
|
height: 13px;
|
||||||
|
border-left: 1px solid #cccccc;
|
||||||
.icon-external {
|
border-bottom: 1px solid #cccccc;
|
||||||
font-size: 1rem;
|
}
|
||||||
padding-left: 0.4rem !important;
|
|
||||||
color: #6b6b6b;
|
.icon-external {
|
||||||
}
|
font-size: 1rem;
|
||||||
|
padding-left: 0.4rem !important;
|
||||||
mat-list-item {
|
color: #6b6b6b;
|
||||||
display: flex !important;
|
}
|
||||||
height: auto !important;
|
|
||||||
|
mat-list-item {
|
||||||
|
display: flex !important;
|
||||||
|
height: auto !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
::ng-deep .mat-list-item-content {
|
::ng-deep .mat-list-item-content {
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
|
||||||
|
|
||||||
h1, .h1 {
|
h1, .h1 {
|
||||||
font-size: $font-size-h1;
|
font-size: $font-size-h1;
|
||||||
line-height: 1.15em;
|
line-height: 1.5em;
|
||||||
}
|
}
|
||||||
h2, .h2{
|
h2, .h2{
|
||||||
font-size: $font-size-h2;
|
font-size: $font-size-h2;
|
||||||
|
|
@ -34,59 +34,62 @@ h5, .h5 {
|
||||||
}
|
}
|
||||||
h6, .h6{
|
h6, .h6{
|
||||||
font-size: $font-size-h6;
|
font-size: $font-size-h6;
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: $font-weight-bold;
|
font-weight: $font-weight-bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title,
|
small {
|
||||||
.card-title,
|
font-size: $font-size-small;
|
||||||
.info-title,
|
|
||||||
.footer-brand,
|
|
||||||
.footer-big h5,
|
|
||||||
.footer-big h4,
|
|
||||||
.media .media-heading{
|
|
||||||
//font-weight: $font-weight-extra-bold;
|
|
||||||
// font-family: $font-family-serif;
|
|
||||||
|
|
||||||
&,
|
|
||||||
a{
|
|
||||||
color: $black-color;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-blog .card-title{
|
// .title,
|
||||||
font-weight: $font-weight-extra-bold;
|
// .card-title,
|
||||||
}
|
// .info-title,
|
||||||
|
// .footer-brand,
|
||||||
|
// .footer-big h5,
|
||||||
|
// .footer-big h4,
|
||||||
|
// .media .media-heading{
|
||||||
|
// //font-weight: $font-weight-extra-bold;
|
||||||
|
// // font-family: $font-family-serif;
|
||||||
|
|
||||||
h2.title{
|
// &,
|
||||||
margin-bottom: $margin-base * 2;
|
// a{
|
||||||
}
|
// color: $black-color;
|
||||||
|
// text-decoration: none;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
.description,
|
// .card-blog .card-title{
|
||||||
.card-description,
|
// font-weight: $font-weight-extra-bold;
|
||||||
.footer-big p{
|
// }
|
||||||
color: $gray-light;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-warning {
|
// h2.title{
|
||||||
color: $brand-warning !important;
|
// margin-bottom: $margin-base * 2;
|
||||||
}
|
// }
|
||||||
.text-primary {
|
|
||||||
color: $brand-primary !important;
|
// .description,
|
||||||
}
|
// .card-description,
|
||||||
.text-danger {
|
// .footer-big p{
|
||||||
color: $brand-danger !important;
|
// color: $gray-light;
|
||||||
}
|
// }
|
||||||
.text-success {
|
|
||||||
color: $brand-success !important;
|
// .text-warning {
|
||||||
}
|
// color: $brand-warning !important;
|
||||||
.text-info {
|
// }
|
||||||
color: $brand-info !important;
|
// .text-primary {
|
||||||
}
|
// color: $brand-primary !important;
|
||||||
.text-rose{
|
// }
|
||||||
color: $brand-rose !important;
|
// .text-danger {
|
||||||
}
|
// color: $brand-danger !important;
|
||||||
.text-gray{
|
// }
|
||||||
color: $gray-color !important;
|
// .text-success {
|
||||||
}
|
// color: $brand-success !important;
|
||||||
|
// }
|
||||||
|
// .text-info {
|
||||||
|
// color: $brand-info !important;
|
||||||
|
// }
|
||||||
|
// .text-rose{
|
||||||
|
// color: $brand-rose !important;
|
||||||
|
// }
|
||||||
|
// .text-gray{
|
||||||
|
// color: $gray-color !important;
|
||||||
|
// }
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@
|
||||||
// https://www.google.com/design/spec/style/typography.html#typography-styles
|
// https://www.google.com/design/spec/style/typography.html#typography-styles
|
||||||
// http://www.getmdl.io/styles/index.html
|
// http://www.getmdl.io/styles/index.html
|
||||||
|
|
||||||
|
|
||||||
$font-family-sans-serif: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
|
$font-family-sans-serif: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
|
||||||
$font-family-serif: 'Roboto Slab', 'Times New Roman', serif !default;
|
$font-family-serif: 'Roboto Slab', 'Times New Roman', serif !default;
|
||||||
//$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
|
//$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
|
||||||
|
|
@ -19,89 +20,19 @@ $font-size-sm: .875rem !default;
|
||||||
$font-size-xs: .75rem !default;
|
$font-size-xs: .75rem !default;
|
||||||
|
|
||||||
|
|
||||||
$font-size-h1: 3.3125rem;
|
$font-size-h1: 2.5rem;
|
||||||
$font-size-h2: 2.25rem !default;
|
$font-size-h2: 2.25rem !default;
|
||||||
$font-size-h3: 1.5625rem;
|
$font-size-h3: 1.5625rem;
|
||||||
$font-size-h4: 1.125rem !default;
|
$font-size-h4: 1.125rem !default;
|
||||||
$font-size-h5: 1.0625rem !default;
|
$font-size-h5: 1.0625rem !default;
|
||||||
$font-size-h6: 0.75rem !default;
|
$font-size-h6: 1rem !default;
|
||||||
$font-paragraph: 14px !default;
|
$font-paragraph: 14px !default;
|
||||||
$font-size-navbar: 16px !default;
|
$font-size-navbar: 16px !default;
|
||||||
$font-size-small: 12px !default;
|
$font-size-small: 13px !default;
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
$display1-size: 7rem !default; // md display-4 112px was 6rem;
|
|
||||||
$display2-size: 3.5rem !default; // md display-3 56px was 5.5rem
|
|
||||||
$display3-size: 2.8125rem !default; // md display-2 45px was 4.5rem
|
|
||||||
$display4-size: 2.125rem !default; // md display-1 34px was 3.5rem
|
|
||||||
//
|
|
||||||
//$display1-weight: 300 !default;
|
|
||||||
//$display2-weight: 300 !default;
|
|
||||||
//$display3-weight: 300 !default;
|
|
||||||
//$display4-weight: 300 !default;
|
|
||||||
//
|
|
||||||
$line-height-base: 1.5 !default;
|
|
||||||
//
|
|
||||||
$headings-margin-bottom: math.div($spacer, 2) !default;
|
|
||||||
//$headings-font-family: inherit !default;
|
|
||||||
$headings-font-weight: 400 !default; // was 500
|
|
||||||
|
|
||||||
$font-weight-light: 300 !default;
|
$font-weight-light: 200 !default;
|
||||||
$font-weight-default: 400 !default;
|
$font-weight-default: 300 !default;
|
||||||
$font-weight-bold: 500 !default;
|
$font-weight-bold: 400 !default;
|
||||||
$font-weight-extra-bold: 700 !default;
|
$font-weight-extra-bold: 500 !default;
|
||||||
|
|
||||||
$font-size-large: 1em !default;
|
|
||||||
$font-size-large-navbar: 20px !default;
|
|
||||||
|
|
||||||
//$headings-line-height: 1.1 !default;
|
|
||||||
//$headings-color: inherit !default;
|
|
||||||
//
|
|
||||||
//$lead-font-size: 1.25rem !default;
|
|
||||||
//$lead-font-weight: 300 !default;
|
|
||||||
//
|
|
||||||
//$text-muted: $gray-light !default;
|
|
||||||
//
|
|
||||||
//$abbr-border-color: $gray-light !default;
|
|
||||||
//
|
|
||||||
//$blockquote-small-color: $gray-light !default;
|
|
||||||
//$blockquote-font-size: ($font-size-base * 1.25) !default;
|
|
||||||
//$blockquote-border-color: $gray-lighter !default;
|
|
||||||
//
|
|
||||||
//$hr-border-color: rgba(0,0,0,.1) !default;
|
|
||||||
//$hr-border-width: $border-width !default;
|
|
||||||
//
|
|
||||||
//$list-inline-padding: 5px !default;
|
|
||||||
//
|
|
||||||
//$dt-font-weight: bold !default;
|
|
||||||
//
|
|
||||||
//$nested-kbd-font-weight: bold !default;
|
|
||||||
|
|
||||||
$padding-input-vertical: 11px !default;
|
|
||||||
$padding-input-horizontal: 19px !default;
|
|
||||||
|
|
||||||
$padding-btn-vertical: 11px !default;
|
|
||||||
$padding-btn-horizontal: 22px !default;
|
|
||||||
|
|
||||||
$padding-base-vertical: .5rem !default;
|
|
||||||
$padding-base-horizontal: .7rem !default;
|
|
||||||
|
|
||||||
$padding-round-horizontal: 23px !default;
|
|
||||||
|
|
||||||
$padding-simple-vertical: 10px !default;
|
|
||||||
$padding-simple-horizontal: 17px !default;
|
|
||||||
|
|
||||||
$padding-large-vertical: 15px !default;
|
|
||||||
$padding-large-horizontal: 48px !default;
|
|
||||||
|
|
||||||
$padding-small-vertical: 5px !default;
|
|
||||||
$padding-small-horizontal: 15px !default;
|
|
||||||
|
|
||||||
$padding-label-vertical: 2px !default;
|
|
||||||
$padding-label-horizontal: 12px !default;
|
|
||||||
|
|
||||||
$margin-large-vertical: 30px !default;
|
|
||||||
$margin-base-vertical: 15px !default;
|
|
||||||
|
|
||||||
$margin-base-horizontal: 15px !default;
|
|
||||||
|
|
@ -1,13 +1,12 @@
|
||||||
@use '@angular/material'as mat;
|
@use '@angular/material'as mat;
|
||||||
|
|
||||||
|
|
||||||
// @import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
|
// @import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
|
||||||
// @import "src/assets/scss/material-dashboard.scss";
|
// @import "src/assets/scss/material-dashboard.scss";
|
||||||
|
|
||||||
|
|
||||||
//Material-Bootstrap configuration
|
//Material-Bootstrap configuration
|
||||||
|
@import '../node_modules/bootstrap/scss/bootstrap.scss';
|
||||||
@import "assets/scss/bootstrap-material";
|
@import "assets/scss/bootstrap-material";
|
||||||
// @import "/node_modules/bootstrap/scss/bootstrap";
|
|
||||||
|
|
||||||
// @import "@covalent/core/theming/all-theme";
|
// @import "@covalent/core/theming/all-theme";
|
||||||
// @import "@angular/material/theming"; // @import '../node_modules/@angular/material/theming';
|
// @import "@angular/material/theming"; // @import '../node_modules/@angular/material/theming';
|
||||||
|
|
@ -19,9 +18,14 @@
|
||||||
// Guided Tour style
|
// Guided Tour style
|
||||||
@import '../node_modules/ngx-guided-tour/scss/guided-tour-base-theme.scss';
|
@import '../node_modules/ngx-guided-tour/scss/guided-tour-base-theme.scss';
|
||||||
|
|
||||||
|
|
||||||
// Be sure that you only ever include this mixin once!
|
// Be sure that you only ever include this mixin once!
|
||||||
@include mat.core();
|
@include mat.core();
|
||||||
|
|
||||||
|
// styles moved from material-dashboard.scss -> overwrite bootstrap default styles
|
||||||
|
@import "assets/scss/core/variables/type";
|
||||||
|
@import "assets/scss/core/type";
|
||||||
|
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--primary-color: #18488F;
|
--primary-color: #18488F;
|
||||||
|
|
@ -82,30 +86,35 @@ $mat-dark-theme-warn: mat.m2-define-palette($mat-dark-theme-warn-palette,
|
||||||
$darker: A700,
|
$darker: A700,
|
||||||
$text: 100);
|
$text: 100);
|
||||||
|
|
||||||
|
|
||||||
|
//including the typography rules from _type.scss here
|
||||||
$mat-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;',
|
$mat-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;',
|
||||||
// $display-4: mat.m2-define-typography-level($font-size: 96px, $font-weight: 300, $font-family: 'Roboto, sans-serif;'),
|
$headline-1: mat.m2-define-typography-level($font-size: 2.5rem),
|
||||||
// $display-3: mat.m2-define-typography-level($font-size: 60px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$headline-2: mat.m2-define-typography-level($font-size: 2.25rem),
|
||||||
// $display-2: mat.m2-define-typography-level($font-size: 48px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$headline-3: mat.m2-define-typography-level($font-size: 1.5625rem),
|
||||||
// $display-1: mat.m2-define-typography-level($font-size: 34px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$headline-4: mat.m2-define-typography-level($font-size: 1.125rem),
|
||||||
// $headline: mat.m2-define-typography-level($font-size: 24px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$headline-5: mat.m2-define-typography-level($font-size: 1.0625rem),
|
||||||
// $title: mat.m2-define-typography-level($font-size: 20px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$headline-6: mat.m2-define-typography-level($font-size: 1rem ),
|
||||||
// $subheading-2: mat.m2-define-typography-level($font-size: 18px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$body-1: mat.m2-define-typography-level($font-size: 1.125rem),
|
||||||
// $subheading-1: mat.m2-define-typography-level($font-size: 20px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
$body-2: mat.m2-define-typography-level($font-size: 0.9rem),
|
||||||
$body-2: mat.m2-define-typography-level($font-size: 16px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$button: mat.m2-define-typography-level($font-size: 0.87rem),
|
||||||
$body-1: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$caption: mat.m2-define-typography-level($font-size: 0.77rem),
|
||||||
// $caption: mat.m2-define-typography-level($font-size: 16px, $font-weight: Medium, $font-family: 'Roboto, sans-serif;'),
|
|
||||||
$button: mat.m2-define-typography-level($font-size: 0.87rem, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
|
||||||
// Line-height must be unit-less fraction of the font-size.
|
// Line-height must be unit-less fraction of the font-size.
|
||||||
// $input: mat.m2-define-typography-level($font-size: inherit, $line-height: 1.125, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
|
// $input: mat.m2-define-typography-level($font-size: inherit, $line-height: 1.125),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$mat-accessibility-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;',
|
$mat-accessibility-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;',
|
||||||
$body-1: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$headline-1: mat.m2-define-typography-level($font-size: 2.5rem),
|
||||||
$body-2: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$headline-2: mat.m2-define-typography-level($font-size: 2.38rem),
|
||||||
$button: mat.m2-define-typography-level($font-size: 16px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$headline-3: mat.m2-define-typography-level($font-size: 1.6925rem),
|
||||||
$caption: mat.m2-define-typography-level($font-size: 16px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
|
$headline-4: mat.m2-define-typography-level($font-size: 1.255rem),
|
||||||
|
$headline-5: mat.m2-define-typography-level($font-size: 1.1925rem),
|
||||||
|
$headline-6: mat.m2-define-typography-level($font-size: 1.13rem ),
|
||||||
|
$body-1: mat.m2-define-typography-level($font-size: 1.255rem),
|
||||||
|
$body-2: mat.m2-define-typography-level($font-size: 1.15rem),
|
||||||
|
$button: mat.m2-define-typography-level($font-size: 1rem),
|
||||||
);
|
);
|
||||||
|
|
||||||
$mat-density: 0;
|
$mat-density: 0;
|
||||||
|
|
@ -140,25 +149,32 @@ $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme
|
||||||
|
|
||||||
.accessibility-theme {
|
.accessibility-theme {
|
||||||
@include mat.all-component-themes($mat-accessibility-theme);
|
@include mat.all-component-themes($mat-accessibility-theme);
|
||||||
|
|
||||||
// change individual classes set in components' scss
|
// change individual classes set in components' scss
|
||||||
.frame-txt, .action-list-text, .stepper-back, .nav-row, .nav-subrow, .center-content, .form-check,
|
.frame-txt, .action-list-text, .stepper-back, .nav-row, .nav-subrow, .center-content, .form-check,
|
||||||
.nav-row, .nav-subrow, .sidebar-footer .option, label.mdc-label,.description-label {
|
.nav-row, .nav-subrow, .sidebar-footer .option {
|
||||||
font-size: max(1rem, 16px) !important;
|
font-size: 1rem !important;
|
||||||
}
|
}
|
||||||
.action-list-label, .actions-list, small {
|
.action-list-label, .actions-list, small {
|
||||||
font-size: max(1rem, 13px) !important;
|
font-size: 0.8em !important;
|
||||||
}
|
}
|
||||||
.status-chip {
|
.status-chip {
|
||||||
font-size: 14px;
|
font-size: 14px !important;
|
||||||
|
}
|
||||||
|
.plan-title, .plan-title-draft, .description-title, .description-title-draft {
|
||||||
|
font-size: 1.2rem !important;
|
||||||
|
}
|
||||||
|
.plan-subtitle, .description-subtitle {
|
||||||
|
font-size: 1rem !important;
|
||||||
|
}
|
||||||
|
.heading {
|
||||||
|
font-size: 1.255rem !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// styles moved from material-dashboard.scss
|
|
||||||
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
|
|
||||||
font-family: Roboto, sans-serif;
|
|
||||||
font-weight: 300;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: var(--link-color);
|
color: var(--link-color);
|
||||||
|
|
@ -169,12 +185,15 @@ a {
|
||||||
&.color-unset {
|
&.color-unset {
|
||||||
color: #000000;
|
color: #000000;
|
||||||
}
|
}
|
||||||
|
& .material-icons { //_misc.scss
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
.required-text {
|
border: 0;
|
||||||
font-size: 13px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//TODO: angular update @import '../node_modules/dragula/dist/dragula.css';
|
//TODO: angular update @import '../node_modules/dragula/dist/dragula.css';
|
||||||
/* in-flight clone */
|
/* in-flight clone */
|
||||||
.gu-mirror {
|
.gu-mirror {
|
||||||
|
|
@ -326,10 +345,6 @@ a {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// .gray-container {
|
|
||||||
// background: linear-gradient(180deg, #f6f6f6, #fff);
|
|
||||||
// margin: 5px 0px;
|
|
||||||
// }
|
|
||||||
|
|
||||||
.main-content {
|
.main-content {
|
||||||
background-color: #f5f5f5;
|
background-color: #f5f5f5;
|
||||||
|
|
@ -675,6 +690,7 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
||||||
////////*////////
|
////////*////////
|
||||||
///
|
///
|
||||||
///
|
///
|
||||||
|
///
|
||||||
ul.horizontal-list {
|
ul.horizontal-list {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue