@nuvoui/core 1.1.6 → 1.1.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuvoui/core",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "description": "NuvoUI is a human-friendly SCSS framework designed for simplicity, and modern responsive designs.",
   "main": "dist/nuvoui.css",
   "module": "src/styles/index.scss",

package/src/styles/base/_base.scss

@@ -3,7 +3,7 @@
 /* Import variables */
 @use '../utilities/variables' as *;
 @use '../utilities/media-queries' as media;
-
+  
 :root {
   --font-family-base: system-ui, -apple-system, "BlinkMacSystemFont", 'Segoe UI', "Roboto", "Oxygen", "Ubuntu", "Cantarell", sans-serif;
 }
@@ -69,14 +69,14 @@ button {
   padding: 0.5rem 1rem;
   border: 0;
   border-radius: 0.25rem;
-  background-color: var(--button-bg-color, #007bff); // Default button color
-  color: var(--button-text-color, #ffffff);
+  background-color: var(--button-bg-color, #007BFF); // Default button color
+  color: var(--button-text-color, #FFF);
   font-family: var(--font-family-base);
   cursor: pointer;
   transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
   &:hover {
-    background-color: var(--button-bg-color-hover, #0056b3); // Hover button color
+    background-color: var(--button-bg-color-hover, #0056B3); // Hover button color
   }
   
   &:focus {
@@ -84,8 +84,8 @@ button {
   }
 
   &:disabled {
-    background-color: #e0e0e0; // Disabled button color
-    color: #a0a0a0; // Disabled text color
+    background-color: #E0E0E0; // Disabled button color
+    color: #A0A0A0; // Disabled text color
     cursor: not-allowed;
   }
 }
@@ -103,6 +103,7 @@ textarea {
   width: 100%; // Full width
   font-family: var(--font-family-base);
   transition: border 0.2s ease-in-out;
+
   &:focus {
     border-color: var(--link-color);
     outline: none;
@@ -123,6 +124,7 @@ select {
   width: 100%; // Full width
   font-family: var(--font-family-base);
   transition: border 0.2s ease-in-out;
+
   &:focus {
     border-color: var(--link-color);
     outline: none;

package/src/styles/layouts/_flex.scss

@@ -319,7 +319,7 @@
   $bp-val: FN.get-breakpoint-value($breakpoint);
   
   @media (min-width: #{$bp-val}) {
-    .flex\@#{$breakpoint} {
+    .flex {
       display: flex;
 
       // Direction

package/src/styles/layouts/_grid.scss

@@ -19,9 +19,10 @@
 @mixin cols($count) {grid-template-columns: repeat($count, minmax(0, 1fr));}
 @mixin rows($count) {grid-template-rows: repeat($count, minmax(0, 1fr));}
 
-@mixin grid-cols-custom($template) {
+@mixin cols-custom($template) {
   // Convert underscores to spaces so "1fr_auto" becomes "1fr auto"
   $converted: FN.str-replace($template, "_", " ");
+
   grid-template-columns: $converted;
 }
 
@@ -77,7 +78,7 @@
 /// EXAMPLE USAGE
 .custom-grid {
   display: grid;
-  @include grid-cols-custom("1fr_auto_1fr");
+  @include cols-custom("1fr_auto_1fr");
 }
 
 // Classes

package/src/styles/mixins-map.scss

@@ -284,11 +284,11 @@
           $end: str.length($mixin-str) - 1;
           $value: str.slice($mixin-str, $start, $end);
           @include rows(str.unquote($value));
-        } @else if str.index($mixin-str, 'grid-cols-custom(') == 1 {
+        } @else if str.index($mixin-str, 'cols-custom(') == 1 {
           $start: str.index($mixin-str, '(') + 1;
           $end: str.length($mixin-str) - 1;
           $value: str.slice($mixin-str, $start, $end);
-          @include grid-cols-custom(str.unquote($value));
+          @include cols-custom(str.unquote($value));
         } @else if str.index($mixin-str, 'auto-fit(') == 1 {
           $start: str.index($mixin-str, '(') + 1;
           $end: str.length($mixin-str) - 1;
@@ -888,11 +888,11 @@
           $end: str.length($mixin-str) - 1;
           $value: str.slice($mixin-str, $start, $end);
           @include rows(str.unquote($value));
-        } @else if str.index($mixin-str, 'grid-cols-custom(') == 1 {
+        } @else if str.index($mixin-str, 'cols-custom(') == 1 {
           $start: str.index($mixin-str, '(') + 1;
           $end: str.length($mixin-str) - 1;
           $value: str.slice($mixin-str, $start, $end);
-          @include grid-cols-custom(str.unquote($value));
+          @include cols-custom(str.unquote($value));
         } @else if str.index($mixin-str, 'auto-fit(') == 1 {
           $start: str.index($mixin-str, '(') + 1;
           $end: str.length($mixin-str) - 1;

package/src/styles/utilities/_media-queries.scss

@@ -33,7 +33,7 @@
 }
 
 // Only at specific breakpoint
-@mixin media-only($breakpoint) {
+@mixin media-only($breakpoint) { // BUG BUG BUG BUG BUG
   $min: FN.get-breakpoint-value($breakpoint);
   $next-breakpoint: null;
   

package/src/styles/utilities/_sizing.scss

@@ -1,15 +1,15 @@
 // _spacing.scss
-
+  
 @use 'sass:math';
 @use './variables' as *;
 @use './container-queries' as Q;
 
-@mixin width($value) { width: if($value == 0, $value, $value + px); }
-@mixin height($value) { height: if($value == 0, $value, $value + px); }
-@mixin min-width($value) { min-width: if($value == 0, $value, $value + px); }
-@mixin min-height($value) { min-height: if($value == 0, $value, $value + px); }
-@mixin max-width($value) { max-width: if($value == 0, $value, $value + px); }
-@mixin max-height($value) { max-height: if($value == 0, $value, $value + px); }
+@mixin width($value) { width: $value; }
+@mixin height($value) { height: $value; }
+@mixin min-width($value) { min-width: $value; }
+@mixin min-height($value) { min-height: $value; }
+@mixin max-width($value) { max-width: $value; }
+@mixin max-height($value) { max-height: $value; }
 
 @mixin width-percent($i) { width: #{$i + '%'}; }
 @mixin height-percent($i) { height: #{$i + '%'};  }