fix(theme): correct custom properties subtraction (#2932)

akveo · Nov 5, 2021 · 4e63abc · 4e63abc
1 parent a1c53d3
commit 4e63abc
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 15 deletions.
diff --git a/src/framework/theme/components/sidebar/_sidebar.component.theme.scss b/src/framework/theme/components/sidebar/_sidebar.component.theme.scss
@@ -5,9 +5,7 @@
  */
 
 @mixin nb-sidebar-theme() {
-
   nb-sidebar {
-
     background-color: nb-theme(sidebar-background-color);
     box-shadow: nb-theme(sidebar-shadow);
     color: nb-theme(sidebar-text-color);
@@ -33,9 +31,10 @@
       }
 
       @include nb-scrollbars(
-          nb-theme(sidebar-scrollbar-color),
-          nb-theme(sidebar-scrollbar-background-color),
-          nb-theme(sidebar-scrollbar-width));
+        nb-theme(sidebar-scrollbar-color),
+        nb-theme(sidebar-scrollbar-background-color),
+        nb-theme(sidebar-scrollbar-width)
+      );
     }
 
     // TODO: width used to use transition on width
@@ -52,7 +51,8 @@
         overflow: hidden;
       }
 
-      nb-sidebar-header,  nb-sidebar-footer {
+      nb-sidebar-header,
+      nb-sidebar-footer {
         width: 0;
         padding: 0;
         overflow: hidden;
@@ -84,7 +84,9 @@
         }
 
         > .menu-items > .menu-item > a {
-          span, nb-badge, .expand-state {
+          span,
+          nb-badge,
+          .expand-state {
             display: none;
           }
         }
@@ -112,7 +114,6 @@
             display: none;
           }
         }
-
       }
       // we need to pull the content
       &.left.fixed ~ .content {
@@ -139,7 +140,7 @@
       }
 
       &.fixed.end ~ .content {
-        @include nb-ltr(margin-right,nb-theme(sidebar-width-compact));
+        @include nb-ltr(margin-right, nb-theme(sidebar-width-compact));
         @include nb-rtl(margin-left, nb-theme(sidebar-width-compact));
       }
 
@@ -182,7 +183,7 @@
     }
 
     nb-menu {
-      margin: 0 -#{nb-theme(sidebar-padding)} -#{nb-theme(sidebar-padding)};
+      margin: 0 calc(#{nb-theme(sidebar-padding)} * -1) calc(#{nb-theme(sidebar-padding)} * -1);
     }
   }
 }
diff --git a/src/framework/theme/components/timepicker/_timepicker.component.theme.scss b/src/framework/theme/components/timepicker/_timepicker.component.theme.scss
@@ -44,15 +44,16 @@
       }
 
       @include nb-scrollbars(
-          nb-theme(timepicker-scrollbar-color),
-          nb-theme(timepicker-scrollbar-background-color),
-          nb-theme(timepicker-scrollbar-width));
+        nb-theme(timepicker-scrollbar-color),
+        nb-theme(timepicker-scrollbar-background-color),
+        nb-theme(timepicker-scrollbar-width)
+      );
     }
 
     &.supports-scrollbar-theming {
       .values-list:hover .list-item:not(.am-pm-item) {
-        @include nb-ltr(margin-right, -#{nb-theme(timepicker-scrollbar-width)});
-        @include nb-rtl(margin-left, -#{nb-theme(timepicker-scrollbar-width)});
+        @include nb-ltr(margin-right, calc(#{nb-theme(timepicker-scrollbar-width)} * -1));
+        @include nb-rtl(margin-left, calc(#{nb-theme(timepicker-scrollbar-width)} * -1));
       }
     }