From 9cb1f835a93501d9566ea2a3123d92eecd73f27d Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 1 Aug 2023 12:12:01 +0300 Subject: [PATCH 1/6] Update material theming with Angular 15 --- library-css/material.scss | 23 +++++++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/library-css/material.scss b/library-css/material.scss index 65ec8fa..2f27467 100644 --- a/library-css/material.scss +++ b/library-css/material.scss @@ -1,6 +1,6 @@ @use '@angular/material' as mat; -@use '@angular/material/theming'; @include mat.core(); + $primary-color: ( 0: #211F7E, 100: #211F7E, @@ -13,12 +13,27 @@ $secondary-color: ( 700: #3086ED, contrast: (50: #ffffff) ); +$warn-color: ( + 0: #BD640D, + 100: #BD640D, + 700: #BD640D, + contrast: (50: #ffffff) +); $my-app-primary: mat.define-palette($primary-color, 0); -$my-app-accent: mat.define-palette($secondary-color, 0); -$my-app-theme: mat.define-light-theme($my-app-primary, $my-app-accent); +$my-app-accent: mat.define-palette($secondary-color, 0); +$my-app-warn: mat.define-palette($warn-color, 0); +$my-app-theme: mat.define-light-theme(( + color: ( + primary: $my-app-primary, + accent: $my-app-accent, + warn: $my-app-warn + ), + typography: mat.define-typography-config(), + density: 0, +)); @include mat.all-component-themes($my-app-theme); .cdk-global-overlay-wrapper, .cdk-overlay-container { - z-index: 9999!important; + z-index: 9999 !important; } -- 2.17.1 From ae7e623418e7362e80cf9f65db7a004c0857d239 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 22 Aug 2023 17:09:03 +0300 Subject: [PATCH 2/6] Update to Uikit 3.16.24 --- less/dashboard.less | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/less/dashboard.less b/less/dashboard.less index a725dd5..bbeab06 100644 --- a/less/dashboard.less +++ b/less/dashboard.less @@ -33,8 +33,9 @@ @dashboard-sidebar-toggle-size: @icon-button-small-size; @dashboard-sidebar-toggle-top: 50%; +@dashboard-menu-section-font-size: @global-small-font-size; +@dashboard-menu-section-line-height: 1.5 * @global-small-font-size; @dashboard-menu-section-margin: 10px; -@dashboard-menu-section-item-line-height: @global-control-small-height; @dashboard-menu-section-item-padding-vertical: 5px; @dashboard-menu-section-item-padding-horizontal: 20px; @dashboard-menu-section-item-padding-horizontal-s: 30px; @@ -85,7 +86,7 @@ } .sidebar_mobile_toggle { - line-height: @dashboard-menu-section-item-line-height; + line-height: @dashboard-menu-section-line-height; & .menu-icon { background-color: @dashboard-primary-background; @@ -102,7 +103,7 @@ & > a { position: relative; padding: @dashboard-menu-section-item-padding-vertical @dashboard-menu-section-item-padding-horizontal; - line-height: @dashboard-menu-section-item-line-height; + line-height: @dashboard-menu-section-line-height; &:not(.uk-flex) { display: block; @@ -119,7 +120,7 @@ & > a { padding: @dashboard-menu-section-item-padding-vertical @dashboard-menu-section-item-padding-horizontal; - &::after { + .uk-nav-parent-icon::after { color: @dashboard-menu-section-item-parent-icon-color; } @@ -128,7 +129,7 @@ right: (@dashboard-menu-section-item-padding-horizontal/2); top: 50%; transform: translate(-50%, -50%); - line-height: (@dashboard-menu-section-item-line-height - 10px); + line-height: (@dashboard-menu-section-line-height - 10px); } } @@ -203,8 +204,15 @@ } } - &:not(.mobile) .uk-nav-default:extend(.uk-text-small) { + &:not(.mobile) .uk-nav-default { + font-size: @dashboard-menu-section-font-size; + line-height: @dashboard-menu-section-line-height; margin-left: @dashboard-menu-section-margin; + + & .uk-nav-sub > li { + font-size: @dashboard-menu-section-font-size; + line-height: @dashboard-menu-section-line-height; + } } } -- 2.17.1 From a7e2f9882fc3cbb9f14ced3e0600d15bf2ffb887 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 29 Aug 2023 14:34:54 +0300 Subject: [PATCH 3/6] Fix material theme, where it wasn't applied in slider-toggle component. --- library-css/material.scss | 27 ++++++++++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) diff --git a/library-css/material.scss b/library-css/material.scss index 2f27467..363cc6d 100644 --- a/library-css/material.scss +++ b/library-css/material.scss @@ -4,24 +4,45 @@ $primary-color: ( 0: #211F7E, 100: #211F7E, + 200: #211F7E, + 300: #211F7E, + 400: #211F7E, + 500: #211F7E, + 600: #211F7E, 700: #211F7E, + 800: #211F7E, + 900: #211F7E, contrast: (50: #ffffff) ); $secondary-color: ( 0: #3086ED, 100: #3086ED, + 200: #3086ED, + 300: #3086ED, + 400: #3086ED, + 500: #3086ED, + 600: #3086ED, 700: #3086ED, + 800: #3086ED, + 900: #3086ED, contrast: (50: #ffffff) ); $warn-color: ( 0: #BD640D, 100: #BD640D, + 200: #BD640D, + 300: #BD640D, + 400: #BD640D, + 500: #BD640D, + 600: #BD640D, 700: #BD640D, + 800: #BD640D, + 900: #BD640D, contrast: (50: #ffffff) ); -$my-app-primary: mat.define-palette($primary-color, 0); -$my-app-accent: mat.define-palette($secondary-color, 0); -$my-app-warn: mat.define-palette($warn-color, 0); +$my-app-primary: mat.define-palette($primary-color); +$my-app-accent: mat.define-palette($secondary-color); +$my-app-warn: mat.define-palette($warn-color); $my-app-theme: mat.define-light-theme(( color: ( primary: $my-app-primary, -- 2.17.1 From 0a58acbbd45074327642e132cd7deae31188a978 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Wed, 25 Oct 2023 15:15:52 +0300 Subject: [PATCH 4/6] [angular-16 | DONE | CHANGED]: Make dashboard-sidebar sticky instead of fixed. --- less/dashboard.less | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/less/dashboard.less b/less/dashboard.less index bbeab06..20f6ea8 100644 --- a/less/dashboard.less +++ b/less/dashboard.less @@ -231,8 +231,11 @@ .sidebar_main_swipe { #sidebar_main { + height: calc(100vh - @dashboard-header-height); + position: relative; + #sidebar_toggle { - position: fixed; + position: absolute; z-index: @dashboard-z-index + 1; top: @dashboard-sidebar-toggle-top; left: @dashboard-sidebar-width; @@ -272,14 +275,14 @@ #sidebar_content { width: @dashboard-sidebar-width; - position: fixed; + position: absolute; top: 0; bottom: 0; left: 0; - padding-top: @dashboard-header-height; z-index: @dashboard-z-index; background: @dashboard-sidebar-background; - border-right: @dashboard-sidebar-border-width solid @dashboard-sidebar-border; + border: @dashboard-sidebar-border-width solid @dashboard-sidebar-border; + border-left: none; transition: width @dashboard-transition-delay linear; -webkit-transition: width @dashboard-transition-delay linear; -moz-transition: width @dashboard-transition-delay linear; @@ -289,6 +292,8 @@ } @{dashboard-pages}, @{dashboard-elements} { + width: 100vw; + box-sizing: border-box; padding-left: @dashboard-sidebar-width; transition: padding-left @dashboard-transition-delay linear; -webkit-transition: padding-left @dashboard-transition-delay linear; -- 2.17.1 From 41852761e79c5cbfa299d5c38f5de0e63d59471c Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Fri, 27 Oct 2023 17:11:08 +0300 Subject: [PATCH 5/6] Fix width of page-content-pages in dashboard --- less/dashboard.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/less/dashboard.less b/less/dashboard.less index 20f6ea8..7161ffa 100644 --- a/less/dashboard.less +++ b/less/dashboard.less @@ -292,7 +292,7 @@ } @{dashboard-pages}, @{dashboard-elements} { - width: 100vw; + width: 100%; box-sizing: border-box; padding-left: @dashboard-sidebar-width; transition: padding-left @dashboard-transition-delay linear; -- 2.17.1 From 8cd9a6dcdc33c4bcaf4e0aaebd199209670d7d8c Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Fri, 27 Oct 2023 17:11:08 +0300 Subject: [PATCH 6/6] [angular-16 | DONE | FIXED]: Fix width of page-content-pages in dashboard. --- less/dashboard.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/less/dashboard.less b/less/dashboard.less index 20f6ea8..7161ffa 100644 --- a/less/dashboard.less +++ b/less/dashboard.less @@ -292,7 +292,7 @@ } @{dashboard-pages}, @{dashboard-elements} { - width: 100vw; + width: 100%; box-sizing: border-box; padding-left: @dashboard-sidebar-width; transition: padding-left @dashboard-transition-delay linear; -- 2.17.1