fix: CSS Syntax Errors (#3198)

* add imports for cssvar * removes syntax error * remove errors
gambitph · Jun 24, 2024 · 1749bd4 · 1749bd4
1 parent 3077a79
commit 1749bd4
Show file tree

Hide file tree

Showing 7 changed files with 9 additions and 6 deletions.
diff --git a/src/block-components/image/style.scss b/src/block-components/image/style.scss
@@ -46,7 +46,7 @@
 			mask-repeat: no-repeat;
 			mask-size: contain;
 			mask-position: center;
-			border-radius: none;
+			border-radius: 0;
 		}
 	}
 	// Firefox doesn't stretch SVG masks via attributes, stretching is done here. Fixes #246.

diff --git a/src/block/horizontal-scroller/editor.scss b/src/block/horizontal-scroller/editor.scss
@@ -10,7 +10,7 @@
 	height: var(--stk-column-height);
 	padding-inline-start: var(--stk-left-offset, 0px);
 	scrollbar-color: var(--stk-scrollbar-thumb-color, #d3d3d3) var(--stk-scrollbar-track-color, #eee); // For Firefox
-	scrollbar-width: var(--stk-scrollbar-height-firefox, "auto"); // For Firefox
+	scrollbar-width: var(--stk-scrollbar-height-firefox, auto); // For Firefox
 	> * {
 		scroll-snap-align: var(--stk-snapping, center);
 		width: 100% !important;

diff --git a/src/block/horizontal-scroller/style.scss b/src/block/horizontal-scroller/style.scss
@@ -20,7 +20,7 @@
 		}
 		&.stk--with-scrollbar {
 			scrollbar-color: var(--stk-scrollbar-thumb-color, #d3d3d3) var(--stk-scrollbar-track-color, #eee); // For Firefox
-			scrollbar-width: var(--stk-scrollbar-height-firefox, "auto"); // For Firefox
+			scrollbar-width: var(--stk-scrollbar-height-firefox, auto); // For Firefox
 			&::-webkit-scrollbar {
 				height: var(--stk-scrollbar-height, 10px);
 			}

diff --git a/src/block/progress-circle/style.scss b/src/block/progress-circle/style.scss
@@ -23,7 +23,7 @@
 			fill: none;
 			stroke: var(--progress-background, #f0f0f0);
 			stroke-width: var(--progress-thickness, 8px);
-			stroke-linecap: var(--progress-rounded, "unset");
+			stroke-linecap: var(--progress-rounded, butt);
 			// should be 50% of the size to fix resizing issue
 			cy: calc(var(--progress-size, 150px) / 2);
 			cx: calc(var(--progress-size, 150px) / 2);

diff --git a/src/styles/block-compat.scss b/src/styles/block-compat.scss
@@ -28,8 +28,9 @@ body.stk--is-neve-theme {
 
 // Kadence theme
 // Kadence adds negative inline margins that screws up our blocks, make the selector more specific.
-body.stk--is-kadence-theme {
-	:is(.entry-content, .site-content) .stk-block > .stk-inner-blocks:is(.alignwide, :not(.alignwide)) {
+body.stk--is-kadence-theme :is(.entry-content, .site-content) .stk-block > .stk-inner-blocks {
+	&.alignwide,
+	&:not(.alignwide) {
 		margin-left: auto;
 		margin-right: auto;
 	}

diff --git a/src/styles/deprecated-block.scss b/src/styles/deprecated-block.scss
@@ -1,4 +1,5 @@
 @import "breakpoints";
+@import "cssvars";
 
 // Button alignment.
 .stk-block .stk-button-group {

diff --git a/src/styles/deprecated-editor-block.scss b/src/styles/deprecated-editor-block.scss
@@ -1,4 +1,5 @@
 @import "editor-breakpoints";
+@import "cssvars";
 
 // Button alignment.
 .stk-button-group {