@nuvoui/core 1.3.0 → 1.3.2

package/src/styles/themes/_theme.scss

@@ -5,8 +5,9 @@
 @use "sass:list";
 @use "../utilities/colors" as COL;
 @use "../abstracts/config" as VAR;
+@use "../abstracts/functions" as FN;
 
-@if VAR.$generate-utility-classes {
+@if FN.feature-enabled("theme") {
   :root,
   #{VAR.$parent-selector} [data-theme="light"] {
     // Theme color CSS variables
@@ -79,19 +80,18 @@
   @each $color-name, $scale in COL.$colors {
     @each $shade, $value in $scale {
       // Automatic text contrast for backgrounds
-      // todo: documentaton may add karo issay
       #{VAR.$parent-selector} .text-on-#{$color-name}-#{$shade} {
         color: COL.find-text-color($value);
       }
 
       #{VAR.$parent-selector} .text-#{$color-name}-#{$shade},
-      #{VAR.$parent-selector} .hover\:text-#{$color-name}-#{$shade}:hover, // todo: improve these loops to save time
+      #{VAR.$parent-selector} .hover\:text-#{$color-name}-#{$shade}:hover,
       #{VAR.$parent-selector} .group:hover .group-hover\:text-#{$color-name}-#{$shade} {
         color: var(--#{$color-name}-#{$shade});
       }
 
       #{VAR.$parent-selector} .bg-#{$color-name}-#{$shade},
-      #{VAR.$parent-selector} .hover\:bg-#{$color-name}-#{$shade}:hover, // todo: improve these loops to save time
+      #{VAR.$parent-selector} .hover\:bg-#{$color-name}-#{$shade}:hover,
       #{VAR.$parent-selector} .group:hover .group-hover\:bg-#{$color-name}-#{$shade} {
         background-color: var(--#{$color-name}-#{$shade});
       }
@@ -105,13 +105,13 @@
 
     // Base color classes
     #{VAR.$parent-selector} .text-#{$color-name},
-    #{VAR.$parent-selector} .hover\:text-#{$color-name}:hover, // todo: improve these loops to save time
+    #{VAR.$parent-selector} .hover\:text-#{$color-name}:hover,
     #{VAR.$parent-selector} .group:hover .group-hover\:text-#{$color-name} {
       color: var(--#{$color-name});
     }
 
     #{VAR.$parent-selector} .bg-#{$color-name},
-    #{VAR.$parent-selector} .hover\:bg-#{$color-name}:hover, // todo: improve these loops to save time
+    #{VAR.$parent-selector} .hover\:bg-#{$color-name}:hover,
     #{VAR.$parent-selector} .group:hover .group-hover\:bg-#{$color-name} {
       background-color: var(--#{$color-name});
     }
@@ -132,13 +132,13 @@
       }
 
       #{VAR.$parent-selector} .text-#{$color-name}-#{$shade},
-      #{VAR.$parent-selector} .hover\:text-#{$color-name}-#{$shade}:hover, // todo: improve these loops to save time
+      #{VAR.$parent-selector} .hover\:text-#{$color-name}-#{$shade}:hover,
       #{VAR.$parent-selector} .group:hover .group-hover\:text-#{$color-name}-#{$shade} {
         color: var(--#{$color-name}-#{$shade});
       }
 
       #{VAR.$parent-selector} .bg-#{$color-name}-#{$shade},
-      #{VAR.$parent-selector} .hover\:bg-#{$color-name}-#{$shade}:hover, // todo: improve these loops to save time
+      #{VAR.$parent-selector} .hover\:bg-#{$color-name}-#{$shade}:hover,
       #{VAR.$parent-selector} .group:hover .group-hover\:bg-#{$color-name}-#{$shade} {
         background-color: var(--#{$color-name}-#{$shade});
       }
@@ -152,13 +152,13 @@
 
     // Base color classes
     #{VAR.$parent-selector} .text-#{$color-name},
-    #{VAR.$parent-selector} .hover\:text-#{$color-name}:hover, // todo: improve these loops to save time
+    #{VAR.$parent-selector} .hover\:text-#{$color-name}:hover,
     #{VAR.$parent-selector} .group:hover .group-hover\:text-#{$color-name} {
       color: var(--#{$color-name});
     }
 
     #{VAR.$parent-selector} .bg-#{$color-name},
-    #{VAR.$parent-selector} .hover\:bg-#{$color-name}:hover, // todo: improve these loops to save time
+    #{VAR.$parent-selector} .hover\:bg-#{$color-name}:hover,
     #{VAR.$parent-selector} .group:hover .group-hover\:bg-#{$color-name} {
       background-color: var(--#{$color-name});
     }

package/src/styles/themes/refactored_borders.ipynb

@@ -0,0 +1,37 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "initial_id",
+   "metadata": {
+    "collapsed": true
+   },
+   "outputs": [],
+   "source": [
+    ""
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 2
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython2",
+   "version": "2.7.6"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}

package/src/styles/utilities/_alignment.scss

@@ -1,4 +1,5 @@
 @use "../abstracts/config" as VAR;
+@use "../abstracts/functions" as FN;
 
 @mixin align-baseline {
   vertical-align: baseline;
@@ -13,7 +14,7 @@
   vertical-align: bottom;
 }
 
-@if VAR.$generate-utility-classes {
+@if FN.feature-enabled("alignments") {
   #{VAR.$parent-selector} .align-baseline {
     @include align-baseline;
   }

package/src/styles/utilities/_animations.scss

@@ -2,7 +2,7 @@
 @use "sass:math";
 @use "sass:map";
 
-@use "../abstracts/functions" as *;
+@use "../abstracts/functions" as FN;
 @use "../abstracts/config" as VAR;
 
 $generated-keyframes: ();
@@ -17,11 +17,9 @@ $generated-keyframes: ();
   }
 }
 
-/**
- * @mixin animate-bounce
- * @description Creates a bouncing animation
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-bounce
+// @description Creates a bouncing animation
+// @param {Map} $props - Animation properties
 @mixin animate-bounce($props: ()) {
   $defaults: (
     vertical: 0.5rem,
@@ -73,11 +71,9 @@ $generated-keyframes: ();
   transition-timing-function: ease-in-out;
 }
 
-/**
- * @mixin animate-pulse
- * @description Creates a pulsing opacity animation
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-pulse
+// @description Creates a pulsing opacity animation
+// @param {Map} $props - Animation properties
 @mixin animate-pulse($props: ()) {
   $defaults: (
     min-opacity: 0.5,
@@ -111,11 +107,9 @@ $generated-keyframes: ();
   }
 }
 
-/**
- * @mixin animate-spin
- * @description Creates a spinning animation
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-spin
+// @description Creates a spinning animation
+// @param {Map} $props - Animation properties
 @mixin animate-spin($props: ()) {
   $defaults: (
     direction: normal,
@@ -150,11 +144,9 @@ $generated-keyframes: ();
   }
 }
 
-/**
- * @mixin animate-ping
- * @description Creates a ping animation (scale + fade)
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-ping
+// @description Creates a ping animation (scale + fade)
+// @param {Map} $props - Animation properties
 @mixin animate-ping($props: ()) {
   $defaults: (
     scale: 2,
@@ -183,11 +175,9 @@ $generated-keyframes: ();
   }
 }
 
-/**
- * @mixin animate-fade
- * @description Creates fade in/out animation
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-fade
+// @description Creates fade in/out animation
+// @param {Map} $props - Animation properties
 @mixin animate-fade($props: ()) {
   $defaults: (
     type: in,
@@ -248,11 +238,9 @@ $generated-keyframes: ();
   }
 }
 
-/**
- * @mixin animate-shake
- * @description Creates a shake animation
- * @param {Map} $props - Animation properties
- */
+// @mixin animate-shake
+// @description Creates a shake animation
+// @param {Map} $props - Animation properties
 @mixin animate-shake($props: ()) {
   $defaults: (
     intensity: 5px,
@@ -296,7 +284,7 @@ $generated-keyframes: ();
   }
 }
 
-@if VAR.$generate-utility-classes {
+@if FN.feature-enabled("animations") {
   // Add to your existing animation utilities
 
   #{VAR.$parent-selector} .animate-pulse {

package/src/styles/utilities/_backdrop-filters.scss

@@ -3,16 +3,12 @@
 @use "../abstracts/config" as VAR;
 @use "../abstracts/functions" as FN;
 
-/**
- * Backdrop Filter Utilities
- *
- * Provides utility classes and mixins for backdrop-filter effects.
- * All utilities come with responsive variants.
- *
- * Usage:
- * <div class="backdrop-blur-md">Blurred backdrop</div>
- * <div class="backdrop-blur-lg@md">Blurred backdrop on medium screens and up</div>
- */
+// Backdrop Filter Utilities
+// Provides utility classes and mixins for backdrop-filter effects.
+// All utilities come with responsive variants.
+// Usage:
+// <div class="backdrop-blur-md">Blurred backdrop</div>
+// <div class="backdrop-blur-lg@md">Blurred backdrop on medium screens and up</div>
 
 // Blur values
 $backdrop-blur-values: (
@@ -305,7 +301,7 @@ $backdrop-filter-presets: (
   }
 }
 
-@if VAR.$generate-utility-classes {
+@if FN.feature-enabled("backdrops") {
   // Generate base utilities
   @include generate-backdrop-filter-utilities;