fix: fix scss

5 files changed, 35 insertions, 26 deletions

diff --git a/src/scss/_variable.scss b/src/scss/_variable.scss
index 6c9b578..6a010ae 100644
--- a/src/scss/_variable.scss
+++ b/src/scss/_variable.scss
@@ -2,10 +2,11 @@
 
 $default-layout-width: 1024px !default;
 
-$default-font-size: 100% !default;
-$default-line-space: 8px !default;
-$default-line-height: calc-stack.line-height($default-line-space, $default-font-size) !default;
-$default-stack: calc-stack.stack($default-line-height, $default-font-size) * 4 !default;
+$default-base-font-size: 18px !default;
+$default-font-size: 18px !default;
+$default-line-space: 6px !default;
+$default-line-height: calc-stack.line-height($default-line-space, $default-font-size, $default-base-font-size) !default;
+$default-stack: calc-stack.stack($default-line-height, $default-font-size, $default-base-font-size) !default;
 
 $default-layout-margin: 0 !default;
 $default-layout-padding: $default-stack !default;
diff --git a/src/scss/function/_calc-font-size.scss b/src/scss/function/_calc-font-size.scss
index 6be78b5..1e5e856 100644
--- a/src/scss/function/_calc-font-size.scss
+++ b/src/scss/function/_calc-font-size.scss
@@ -12,19 +12,17 @@
 
 @function px2em($px, $base: 16) {
 	@return math.div(strip-unit.strip-unit($px), strip-unit.strip-unit($base)) * 1em;
-
 }
 
 @function px2rem($px, $base: 16) {
 	@return math.div(strip-unit.strip-unit($px), strip-unit.strip-unit($base)) * 1rem;
 }
-
 // ===================================================================
 // percent to px
-// ===================================================================
+// ========================================================n===========
 
 @function percent2px($percent, $base: 16) {
-  @return strip-unit.strip-unit($base) * math.div(strip-unit.strip-unit($percent), 100) * 1px;
+	@return strip-unit.strip-unit($base) * math.div(strip-unit.strip-unit($percent), 100) * 1px;
 }
 
 // ===================================================================
@@ -32,11 +30,13 @@
 // ===================================================================
 
 @function percent2em($percent, $base: 16) {
-  @return math.div(strip-unit.strip-unit($base) * math.div(strip-unit.strip-unit($percent), 100), strip-unit.strip-unit($base)) * 1em;
+	$ratio: math.div((strip-unit.strip-unit($percent), 100));
+	@return math.div(strip-unit.strip-unit($base) * $ratio, strip-unit.strip-unit($base)) * 1em;
 }
 
 @function percent2rem($percent, $base: 16) {
-  @return math.div(strip-unit.strip-unit($base) * math.div(strip-unit.strip-unit($percent), 100), strip-unit.strip-unit($base)) * 1rem;
+	$ratio: math.div((strip-unit.strip-unit($percent), 100));
+	@return math.div((strip-unit.strip-unit($base) * $ratio), strip-unit.strip-unit($base)) * 1rem;
 }
 
 // ===================================================================
@@ -44,9 +44,9 @@
 // ===================================================================
 
 @function em2px($em, $base: 16) {
-  @return strip-unit.strip-unit($em) * strip-unit.strip-unit($base) * 1px;
+	@return strip-unit.strip-unit($em) * strip-unit.strip-unit($base) * 1px;
 }
 
 @function rem2px($rem, $base: 16) {
-  @return strip-unit.strip-unit($rem) * strip-unit.strip-unit($base) * 1px;
+	@return strip-unit.strip-unit($rem) * strip-unit.strip-unit($base) * 1px;
 }
diff --git a/src/scss/function/_calc-stack.scss b/src/scss/function/_calc-stack.scss
index 4ea3805..c9c7b05 100644
--- a/src/scss/function/_calc-stack.scss
+++ b/src/scss/function/_calc-stack.scss
@@ -7,22 +7,34 @@
 @use 'calc-font-size';
 @use 'strip-unit';
 
-@function stack($line-height: 1, $font-size: 16px, $base: 16px) {
-	$line-height: strip-unit.strip-unit($line-height) * strip-unit.strip-unit($base);
-	@return math.div($line-height, strip-unit.strip-unit($font-size)) * 1rem;
+@function stack($line-height: 1, $font-size: 16px, $base-size: 16px) {
+	@if math.unit($font-size) == '%' {
+		$font-size: calc-font-size.percent2px($font-size, $base-size);
+	} @else if math.unit($font-size) == 'em' {
+		$font-size: calc-font-size.em2px($font-size, $base-size);
+	} @else if math.unit($font-size) == 'rem' {
+		$font-size: calc-font-size.rem2px($font-size, $base-size);
+	}
+
+	$line-height-px-unit: strip-unit.strip-unit($line-height) * strip-unit.strip-unit($font-size);
+
+	$stack: calc-font-size.px2rem($line-height-px-unit, $base-size);
+
+	@return $stack;
 }
 
-@function line-height($line-space: 4px, $font-size: 16px, $base: 16px) {
+@function line-height($line-space: 4px, $font-size: 16px, $base-size: 16px) {
 	@if math.unit($font-size) == '%' {
-		$font-size: calc-font-size.percent2px($font-size, $base);
+		$font-size: calc-font-size.percent2px($font-size, $base-size);
 	} @else if math.unit($font-size) == 'em' {
-		$font-size: calc-font-size.em2px($font-size, $base);
-	} @else if math.unit($font-size,) == 'rem' {
-		$font-size: calc-font-size.rem2px($font-size, $base);
+		$font-size: calc-font-size.em2px($font-size, $base-size);
+	} @else if math.unit($font-size) == 'rem' {
+		$font-size: calc-font-size.rem2px($font-size, $base-size);
 	}
 
 	$font-size: strip-unit.strip-unit($font-size);
 	$line-space: strip-unit.strip-unit($line-space);
+	$line-height: math.div(($line-space * 2) + $font-size, $font-size);
 
-	@return math.div($line-space * 2 + $font-size, $font-size);
+	@return $line-height;
 }
diff --git a/src/scss/function/_contrast-color.scss b/src/scss/function/_contrast-color.scss
index 3867958..685d0d5 100644
--- a/src/scss/function/_contrast-color.scss
+++ b/src/scss/function/_contrast-color.scss
@@ -22,5 +22,5 @@
 }
 
 @function brightness($color: null) {
-	@return ((color.red($color) * 299) + (color.green($color) * 587) + (color.blue($color) * 114)) / 1000;
+	@return math.div((color.red($color) * 299) + (color.green($color) * 587) + (color.blue($color) * 114), 1000);
 }
diff --git a/src/scss/function/_index.scss b/src/scss/function/_index.scss
deleted file mode 100644
index 41e990a..0000000
--- a/src/scss/function/_index.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-@use 'calc-font-size';
-@use 'calc-stack';
-@use 'strip-unit';
-@use 'contrast-color';