do not create empty css variables (#36)

blidblid · Aug 22, 2023 · 08ed954 · 08ed954
1 parent 4375ff1
commit 08ed954
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 13 deletions.
diff --git a/libs/angular/package.json b/libs/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@berg-layout/angular",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "license": "MIT",
   "repository": {
     "url": "https://github.com/blidblid/berg-layout"

diff --git a/libs/core/package.json b/libs/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@berg-layout/core",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "license": "MIT",
   "repository": {
     "url": "https://github.com/blidblid/berg-layout"

diff --git a/libs/core/src/lib/styles/_core.scss b/libs/core/src/lib/styles/_core.scss
@@ -459,7 +459,7 @@ $transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
     .berg-panel-resize-toggle-right,
     .berg-panel-resize-toggle-bottom,
     .berg-panel-resize-toggle-left {
-      background: var(--berg-panel-resize-indicator-color);
+      background: var(--berg-panel-resizing-indicator-color);
     }
   }
 }
diff --git a/libs/core/src/lib/styles/util/_theme.scss b/libs/core/src/lib/styles/util/_theme.scss
@@ -41,13 +41,39 @@
   $previewing-indicator-color: map-get($colors, 'previewing-indicator-color') or
     $resizing-indicator-color;
 
-  --berg-layout-content-background: #{$background-center};
-  --berg-panel-backdrop-background: #{$background-backdrop};
-  --berg-panel-border-color: #{$border-color};
-  --berg-panel-top-background: #{$background-top};
-  --berg-panel-right-background: #{$background-right};
-  --berg-panel-bottom-background: #{$background-bottom};
-  --berg-panel-left-background: #{$background-left};
-  --berg-panel-resize-indicator-color: #{$resizing-indicator-color};
-  --berg-panel-previewing-indicator-color: #{$previewing-indicator-color};
+  @if $background-center {
+    --berg-layout-content-background: #{$background-center};
+  }
+
+  @if $background-backdrop {
+    --berg-panel-backdrop-background: #{$background-backdrop};
+  }
+
+  @if $border-color {
+    --berg-panel-border-color: #{$border-color};
+  }
+
+  @if $background-top {
+    --berg-panel-top-background: #{$background-top};
+  }
+
+  @if $background-right {
+    --berg-panel-right-background: #{$background-right};
+  }
+
+  @if $background-bottom {
+    --berg-panel-bottom-background: #{$background-bottom};
+  }
+
+  @if $background-left {
+    --berg-panel-left-background: #{$background-left};
+  }
+
+  @if $resizing-indicator-color {
+    --berg-panel-resizing-indicator-color: #{$resizing-indicator-color};
+  }
+
+  @if $previewing-indicator-color {
+    --berg-panel-previewing-indicator-color: #{$previewing-indicator-color};
+  }
 }
diff --git a/libs/react/package.json b/libs/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@berg-layout/react",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "license": "MIT",
   "repository": {
     "url": "https://github.com/blidblid/berg-layout"