unit.gl 0.0.40 → 0.1.2

package/scss/mixins/_helper.scss

@@ -3,71 +3,68 @@
 // ============================================================================
 
 ////
-/// 
+///
 /// Helper Mixins Module
 /// ===========================================================================
-/// 
+///
 /// This module provides a collection of utility mixins for common CSS
 /// properties like width, height, font size, padding, margin, and border
 /// properties. These mixins leverage a `q()` function (presumably defined
 /// elsewhere) to standardize the application of units across the project,
 /// promoting consistency and scalability.
-/// 
+///
 /// @group Helper
 /// @author Scape Agency
 /// @link https://unit.gl
 /// @since 0.1.0 initial release
 /// @todo None
 /// @access public
-/// 
+///
 ////
 
-
 // ============================================================================
 // Use
 // ============================================================================
 
+@use "../functions" as *;
 @use "../variables" as *;
-
+@use "../maps" as *;
 
 // ============================================================================
 // Mixins
 // ============================================================================
 
-
 // Dimensions
 // ============================================================================
 
-
-/// 
+///
 /// Sets the width of an element using the provided value.
-/// 
+///
 /// @name set_width
 /// @group Dimensions
 /// @param {Length} $value - The width value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_width(100px);
 ///   }
-/// 
+///
 @mixin set_width($value) {
     @include q($value, width);
 }
 
-
-/// 
+///
 /// Sets the height of an element using the provided value.
-/// 
+///
 /// @name set_height
 /// @group Dimensions
 /// @param {Length} $value - The height value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_height(200px);
 ///   }
-/// 
+///
 @mixin set_height($value) {
     @include q($value, height);
 }
@@ -75,53 +72,50 @@
 // TYPOGRAPHY
 // ----------------------------------------------------------------------------
 
-
-/// 
+///
 /// Sets the font size of an element using the provided value.
-/// 
+///
 /// @name set_font-size
 /// @group Typography
 /// @param {Length} $value - The font size value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .text {
 ///     @include set_font-size(16px);
 ///   }
-/// 
+///
 @mixin set_font-size($value) {
     @include q($value, font-size);
 }
 
-
-/// 
+///
 /// Sets the line height of an element using the provided value.
-/// 
+///
 /// @name set_line_height
 /// @group Typography
 /// @param {Length} $value - The line height value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .text {
 ///     @include set_line_height(1.5);
 ///   }
-/// 
+///
 @mixin set_line_height($value) {
     @include q($value, line_height);
 }
 
-
-/// 
+///
 /// Sets the letter spacing of an element using the provided value.
 /// @name set_letter-spacing
-/// 
+///
 /// @group Typography
 /// @param {Length} $value - The letter spacing value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .text {
 ///     @include set_letter-spacing(0.1em);
 ///   }
-/// 
+///
 @mixin set_letter-spacing($value) {
     @include q($value, letter-spacing);
 }
@@ -129,36 +123,34 @@
 // BORDERS
 // ----------------------------------------------------------------------------
 
-
-/// 
+///
 /// Sets the border width of an element using the provided value.
-/// 
+///
 /// @name set_border_width
 /// @group Borders
 /// @param {Length} $value - The border width value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_border_width(2px);
 ///   }
-/// 
+///
 @mixin set_border_width($value) {
     @include q($value, border_width);
 }
 
-
-/// 
+///
 /// Sets the border radius of an element using the provided value.
-/// 
+///
 /// @name set_border_radius
 /// @group Borders
 /// @param {Length} $value - The border radius value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_border_radius(8px);
 ///   }
-/// 
+///
 @mixin set_border_radius($value) {
     @include q($value, border_radius);
 }
@@ -166,87 +158,82 @@
 // PADDING
 // ----------------------------------------------------------------------------
 
-
-/// 
+///
 /// Sets the padding of an element using the provided value.
-/// 
+///
 /// @name set_padding
 /// @group Spacing
 /// @param {Length} $value - The padding value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_padding(10px);
 ///   }
-/// 
+///
 @mixin set_padding($value) {
     @include q($value, padding);
 }
 
-
-/// 
+///
 /// Sets the top padding of an element using the provided value.
-/// 
+///
 /// @name set_padding_top
 /// @group Spacing
 /// @param {Length} $value - The padding_top value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_padding_top(10px);
 ///   }
-/// 
+///
 @mixin set_padding_top($value) {
     @include q($value, padding_top);
 }
 
-
-/// 
+///
 /// Sets the right padding of an element using the provided value.
-/// 
+///
 /// @name set_padding_right
 /// @group Spacing
 /// @param {Length} $value - The padding_right value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_padding_right(10px);
 ///   }
-/// 
+///
 @mixin set_padding_right($value) {
     @include q($value, padding_right);
 }
 
-
-/// 
+///
 /// Sets the bottom padding of an element using the provided value.
-/// 
+///
 /// @name set_padding_bottom
 /// @group Spacing
 /// @param {Length} $value - The padding_bottom value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_padding_bottom(10px);
 ///   }
-/// 
+///
 @mixin set_padding_bottom($value) {
     @include q($value, padding_bottom);
 }
 
-
-/// 
+///
 /// Sets the left padding of an element using the provided value.
-/// 
+///
 /// @name set_padding_left
 /// @group Spacing
 /// @param {Length} $value - The padding_left value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_padding_left(10px);
 ///   }
-/// 
+///
 @mixin set_padding_left($value) {
     @include q($value, padding_left);
 }
@@ -254,87 +241,82 @@
 // MARGIN
 // ----------------------------------------------------------------------------
 
-
-/// 
+///
 /// Sets the margin of an element using the provided value.
-/// 
+///
 /// @name set_margin
 /// @group Spacing
 /// @param {Length} $value - The margin value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_margin(10px);
 ///   }
-/// 
+///
 @mixin set_margin($value) {
     @include q($value, margin);
 }
 
-
-/// 
+///
 /// Sets the top margin of an element using the provided value.
-/// 
+///
 /// @name set_margin_top
 /// @group Spacing
 /// @param {Length} $value - The margin_top value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_margin_top(10px);
 ///   }
-/// 
+///
 @mixin set_margin_top($value) {
     @include q($value, margin_top);
 }
 
-
-/// 
+///
 /// Sets the right margin of an element using the provided value.
-/// 
+///
 /// @name set_margin_right
 /// @group Spacing
 /// @param {Length} $value - The margin_right value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_margin_right(10px);
 ///   }
-/// 
+///
 @mixin set_margin_right($value) {
     @include q($value, margin_right);
 }
 
-
-/// 
+///
 /// Sets the bottom margin of an element using the provided value.
-/// 
+///
 /// @name set_margin_bottom
 /// @group Spacing
 /// @param {Length} $value - The margin_bottom value to apply.
-/// 
+///
 /// @example scss - Usage
 ///   .box {
 ///     @include set_margin_bottom(10px);
 ///   }
-/// 
+///
 @mixin set_margin_bottom($value) {
     @include q($value, margin_bottom);
 }
 
-
-/// 
+///
 /// Sets the left margin of an element using the provided value.
-/// 
+///
 /// @name set_margin_left
 /// @group Spacing
 /// @param {Length} $value - The margin_left value to apply.
-/// 
+///
 /// @example scss - Usage
 ///     .box {
 ///         @include set_margin_left(10px);
 ///     }
-/// 
+///
 @mixin set_margin_left($value) {
     @include q($value, margin_left);
 }

package/scss/mixins/_index.scss

@@ -3,17 +3,17 @@
 // ============================================================================
 
 ////
-/// 
+///
 /// Mixins Module
 /// ===========================================================================
-/// 
+///
 /// This file centralizes the forwarding of various SCSS partials/modules used
 /// across the project. By aggregating these forwards, it simplifies imports
 /// in other parts of the codebase, promoting better modularity and
 /// organization.
-/// 
+///
 /// This module forwards several other modules to streamline imports
-/// and maintain a clean, modular structure. Each forwarded module contains 
+/// and maintain a clean, modular structure. Each forwarded module contains
 /// specific functionalities, from managing viewports to handling aspect
 /// ratios.
 ///
@@ -25,32 +25,30 @@
 /// - display: Display-related settings and utilities, including typography.
 /// - guide: Utilities for creating visual guides and overlays.
 /// - helper: General helper functions and mixins for common tasks.
-/// 
+///
 /// @group Mixins
 /// @author Scape Agency
 /// @link https://unit.gl
 /// @since 0.1.0 initial release
 /// @todo None
 /// @access public
-/// 
+///
 ////
 
-
 // ============================================================================
 // Use
 // ============================================================================
 
-
 // ============================================================================
 // Forward
 // ============================================================================
 
 /// Forwarding modules for global access
 @forward "unit";
-@forward "paper";   // Handles paper sizes and related utilities
-@forward "view";    // Manages viewport and breakpoint variables
-@forward "ratio";   // Provides aspect ratio utilities
-@forward "device";  // Device-specific responsive configurations
+@forward "paper"; // Handles paper sizes and related utilities
+@forward "view"; // Manages viewport and breakpoint variables
+@forward "ratio"; // Provides aspect ratio utilities
+@forward "device"; // Device-specific responsive configurations
 @forward "display"; // Typography and display settings
-@forward "guide";   // Visual guide and overlay utilities
-@forward "helper";  // General-purpose helper functions and mixins
+@forward "guide"; // Visual guide and overlay utilities
+@forward "helper"; // General-purpose helper functions and mixins

package/scss/mixins/_paper.scss

@@ -3,48 +3,47 @@
 // ============================================================================
 
 ////
-/// 
+///
 /// Paper Mixins Module
 /// ===========================================================================
-/// 
+///
 /// This module provides utilities for applying standard paper sizes to
 /// elements. The sizes are defined in the $paper-sizes map and can be applied
 /// using the `set-paper-size` mixin.
-/// 
+///
 /// @group Paper
 /// @author Scape Agency
 /// @link https://unit.gl
 /// @since 0.1.0 initial release
 /// @todo None
 /// @access public
-/// 
+///
 ////
 
-
 // ============================================================================
 // Use
 // ============================================================================
 
+@use "../functions" as *;
 @use "../variables" as *;
-
+@use "../maps" as *;
 
 // ============================================================================
 // Mixins
 // ============================================================================
 
-
-/// 
+///
 /// Applies the width and height of the specified paper size to the
 /// element. The paper sizes must be predefined in the $paper-sizes map.
-/// 
+///
 /// @name set_paper_size
 /// @param {String} $size - The key representing the paper size in the $paper-sizes map.
-/// 
+///
 /// @example scss - Usage
 ///   .document {
 ///     @include set-paper-size('A4');
 ///   }
-/// 
+///
 @mixin set_paper_size($size) {
     @if map-has-key($paper-sizes, $size) {
         $size-map: map-get($paper-sizes, $size);