@shohojdhara/atomix 0.3.3 → 0.3.5

package/src/themes/mashroom/01-settings/_index.scss

@@ -1,69 +0,0 @@
-/*!
- * Shaj Default Theme Settings Index
- * Modern design system settings for clean, aesthetic UI
- */
-
-// Base colors and variables that everything depends on
-@forward './settings.colors';
-@forward './settings.config';
-
-// Core settings that depend on colors
-@forward './settings.border';
-@forward './settings.border-radius';
-@forward './settings.box-shadow';
-@forward './settings.spacing';
-@forward './settings.breakpoints';
-@forward './settings.fonts';
-@forward './settings.typography';
-
-// Component settings - alphabetically ordered
-@forward './settings.accordion';
-@forward './settings.animations';
-@forward './settings.avatar-group';
-@forward './settings.avatar';
-@forward './settings.badge';
-@forward './settings.btn-group';
-@forward './settings.button';
-@forward './settings.callout';
-@forward './settings.card';
-@forward './settings.checkbox-group';
-@forward './settings.checkbox';
-@forward './settings.color-mode';
-@forward './settings.countdown';
-@forward './settings.data-table';
-@forward './settings.datepicker';
-@forward './settings.dropdown';
-@forward './settings.edge-panel';
-@forward './settings.form';
-@forward './settings.form-group';
-@forward './settings.grid';
-@forward './settings.hero';
-@forward './settings.input';
-@forward './settings.link';
-@forward './settings.list-group';
-@forward './settings.list';
-@forward './settings.design-tokens';
-@forward './settings.menu';
-@forward './settings.messages';
-@forward './settings.modal';
-@forward './settings.nav';
-@forward './settings.navbar';
-@forward './settings.pagination';
-@forward './settings.popover';
-@forward './settings.photoviewer';
-@forward './settings.position';
-@forward './settings.progress';
-@forward './settings.rating';
-@forward './settings.river';
-@forward './settings.sectionintro';
-@forward './settings.select';
-@forward './settings.side-menu';
-@forward './settings.skeleton';
-@forward './settings.spinner';
-@forward './settings.steps';
-@forward './settings.tabs';
-@forward './settings.testimonials';
-@forward './settings.toggle';
-@forward './settings.tooltip';
-@forward './settings.upload';
-@forward './settings.z-layers';

package/src/themes/mashroom/01-settings/_settings.accordion.scss

@@ -1,32 +0,0 @@
-@use '../../../styles/01-settings/settings.accordion' with (
-  $accordion-width: 100%,
-  $accordion-padding-x: 24px,
-  // 24px - more spacious
-  $accordion-padding-y: 16px,
-
-  // 16px
-  $accordion-border-width: 1px,
-  $accordion-border-color: transparent,
-  $accordion-border-radius: 15px,
-
-  // 8px - softer
-  $accordion-body-padding-x: 24px,
-  // 24px
-  $accordion-body-padding-y: 12px,
-  // 12px
-  $accordion-body-color: var(--atomix-body-color),
-  $accordion-body-bg: var(--atomix-secondary-bg-subtle),
-  $accordion-header-padding-x: 24px,
-  // 24px
-  $accordion-header-padding-y: 16px,
-  // 16px
-  $accordion-header-color: var(--atomix-body-color),
-  $accordion-header-bg: var(--atomix-secondary-bg-subtle),
-  $accordion-header-bg-hover: var(--atomix-tertiary-bg-subtle),
-  $accordion-icon-size: 20px,
-  // 20px - larger icons
-  $accordion-icon-color: var(--atomix-body-color),
-  $accordion-icon-transform: 180deg,
-
-  $accordion-disable-color: var(--atomix-tertiary-text-emphasis)
-);

package/src/themes/mashroom/01-settings/_settings.animations.scss

@@ -1,26 +0,0 @@
-// Animation durations
-$transition-duration-fast: 150ms !default;
-$transition-duration: 250ms !default; // base
-$transition-duration-slow: 350ms !default;
-
-// Easing functions
-$easing-linear: linear !default;
-$easing: ease !default; // base
-$easing-in: ease-in !default;
-$easing-out: ease-out !default;
-$easing-in-out: ease-in-out !default;
-$easing-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55) !default;
-
-// Transition presets
-$transition-base: all $transition-duration $easing !default;
-$transition-fast: all $transition-duration-fast $easing-in-out !default;
-$transition-slow: all $transition-duration-slow $easing !default;
-
-// Component-specific transitions
-$transition-colors:
-  color $transition-duration-fast $easing-in-out,
-  background-color $transition-duration-fast $easing-in-out,
-  border-color $transition-duration-fast $easing-in-out !default;
-
-$transition-shadow: box-shadow $transition-duration $easing !default;
-$transition-transform: transform $transition-duration $easing !default;

package/src/themes/mashroom/01-settings/_settings.avatar-group.scss

@@ -1,22 +0,0 @@
-@use '../../../styles/01-settings/settings.avatar-group' with (
-  // Avatar group spacing
-  $avatar-group-gap: 12px,
-  // 12px - more generous spacing
-  $avatar-group-stacked-overlap: 40%,
-  // 40% - less overlap for clarity
-  $avatar-group-stacked-hover-gap: 12px,
-
-  // 12px
-  // Avatar group "more" indicator
-  $avatar-group-more-color: var(--atomix-tertiary-text-emphasis),
-  $avatar-group-more-bg: var(--atomix-body-bg),
-  $avatar-group-more-font-size: 14px,
-  // 14px
-  $avatar-group-more-font-weight: 500,
-  $avatar-group-more-border-width: 1px,
-  $avatar-group-more-border-color: var(--atomix-primary-border-subtle),
-  // Avatar group transitions
-  $avatar-group-transition-duration: 0.3s,
-  // smoother transition
-  $avatar-group-transition-timing: ease-in-out
-);

package/src/themes/mashroom/01-settings/_settings.avatar.scss

@@ -1,57 +0,0 @@
-@use '../../../styles/01-settings/settings.avatar' with (
-  // Avatar sizes - slightly larger for modern feel
-  $avatar-size: (
-      xs: 28px,
-      // 28px
-      sm: 36px,
-      // 36px
-      md: 44px,
-      // 44px
-      lg: 52px,
-      // 52px
-      xl: 64px,
-      // 64px
-    ),
-
-  // Avatar border radius - softer corners
-  $avatar-border-radius: (
-      xs: 6px,
-      // 6px
-      sm: 6px,
-      // 6px
-      md: 8px,
-      // 8px
-      lg: 8px,
-      // 8px
-      xl: 10px,
-      // 10px
-      circle: 50%
-    ),
-
-  // Avatar colors
-  $avatar-color: var(--atomix-primary-text-emphasis),
-  $avatar-bg: var(--atomix-secondary-bg-subtle),
-  $avatar-border-width: 1px,
-  $avatar-border-color: var(--atomix-primary-border-subtle),
-  // Avatar content
-  $avatar-fit: cover,
-  $avatar-initials-font-weight: 500,
-  $avatar-initials-font-size: (
-    xs: 12px,
-    // 12px
-    sm: 14px,
-    // 14px
-    md: 16px,
-    // 16px
-    lg: 18px,
-    // 18px
-    xl: 20px,
-    // 20px
-  ),
-
-  // Interactive states
-  $avatar-hover-opacity: 0.9,
-  $avatar-focus-ring-width: 2px,
-  $avatar-focus-ring-color: var(--atomix-primary-border-subtle),
-  $avatar-disabled-opacity: 0.6
-);

package/src/themes/mashroom/01-settings/_settings.badge.scss

@@ -1,19 +0,0 @@
-@use '../../../styles/01-settings/settings.badge' with (
-  $badge-font-size: 12px,
-  // 12px
-  $badge-font-weight: 500,
-  // medium weight
-  $badge-padding-x: 12px,
-  // 12px - more padding
-  $badge-padding-y: 6px,
-  // 6px
-  $badge-padding-y-sm: 4px,
-  // 4px
-  $badge-padding-y-lg: 8px,
-  // 8px
-  $badge-border-radius: 800px,
-  // pill shape
-  $badge-icon-size: 14px,
-  // 14px - smaller icons
-  $badge-inner-items-gap: 6px // 6px
-);

package/src/themes/mashroom/01-settings/_settings.border-radius.scss

@@ -1,24 +0,0 @@
-/*!
- * Shaj Default Theme Border Radius
- * Modern border radius values for clean UI components
- * Overrides Atomix default border radius settings
- */
-
-// Modern border radius scale
-$border-radius-none: 0 !default;
-$border-radius-sm: 2px !default; // 2px
-$border-radius: 4px !default; // 4px - base
-$border-radius-md: 6px !default; // 6px
-$border-radius-lg: 8px !default; // 8px
-$border-radius-xl: 12px !default; // 12px
-$border-radius-2xl: 16px !default; // 16px
-$border-radius-3xl: 24px !default; // 24px
-$border-radius-4xl: 32px !default; // 32px
-$border-radius-full: 9999px !default; // Full rounded
-$border-radius-pill: 800px !default; // Pill shape
-
-// Aliases for backward compatibility
-$border-radius-xxl: $border-radius-2xl !default;
-
-// Enable rounded corners
-$enable-rounded: true !default;

package/src/themes/mashroom/01-settings/_settings.border.scss

@@ -1,14 +0,0 @@
-@use '../../../styles/01-settings/settings.border' with (
-  $border-width: 1px,
-  $border-widths: (
-    1: 1px,
-    2: 2px,
-    3: 3px,
-    4: 4px,
-    5: 5px,
-  ),
-  $border-style: solid,
-  $border-color: var(--atomix-gray-3),
-  // softer default border
-  $border-color-dark: var(--atomix-gray-5) // darker border for dark mode
-);

package/src/themes/mashroom/01-settings/_settings.box-shadow.scss

@@ -1,40 +0,0 @@
-// Elegant shadows for light mode
-$box-shadow-none: none !default;
-$box-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !default;
-$box-shadow:
-  0 1px 3px 0 rgba(0, 0, 0, 0.1),
-  0 1px 2px 0 rgba(0, 0, 0, 0.06) !default;
-$box-shadow-md:
-  0 4px 6px -1px rgba(0, 0, 0, 0.1),
-  0 2px 4px -1px rgba(0, 0, 0, 0.06) !default;
-$box-shadow-lg:
-  0 10px 15px -3px rgba(0, 0, 0, 0.1),
-  0 4px 6px -2px rgba(0, 0, 0, 0.05) !default;
-$box-shadow-xl:
-  0 20px 25px -5px rgba(0, 0, 0, 0.1),
-  0 10px 10px -5px rgba(0, 0, 0, 0.04) !default;
-$box-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !default;
-$box-shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06) !default;
-
-// Alias for backward compatibility
-$box-shadow-xs: $box-shadow-sm !default;
-
-// Dark mode shadows
-$box-shadow-dark:
-  0 1px 3px 0 rgba(0, 0, 0, 0.3),
-  0 1px 2px 0 rgba(0, 0, 0, 0.2) !default;
-$box-shadow-sm-dark: 0 1px 2px 0 rgba(0, 0, 0, 0.2) !default;
-$box-shadow-md-dark:
-  0 4px 6px -1px rgba(0, 0, 0, 0.3),
-  0 2px 4px -1px rgba(0, 0, 0, 0.2) !default;
-$box-shadow-lg-dark:
-  0 10px 15px -3px rgba(0, 0, 0, 0.3),
-  0 4px 6px -2px rgba(0, 0, 0, 0.2) !default;
-$box-shadow-xl-dark:
-  0 20px 25px -5px rgba(0, 0, 0, 0.3),
-  0 10px 10px -5px rgba(0, 0, 0, 0.2) !default;
-$box-shadow-2xl-dark: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !default;
-$box-shadow-inner-dark: inset 0 2px 4px 0 rgba(0, 0, 0, 0.2) !default;
-
-// Alias for backward compatibility
-$box-shadow-xs-dark: $box-shadow-sm-dark !default;

package/src/themes/mashroom/01-settings/_settings.breakpoints.scss

@@ -1,17 +0,0 @@
-// Breakpoint definitions
-$breakpoints: (
-  xs: 0,
-  sm: 576px,
-  md: 768px,
-  lg: 992px,
-  xl: 1200px,
-  xxl: 1400px,
-) !default;
-
-// Individual breakpoint variables
-$breakpoint-xs: 0 !default;
-$breakpoint-sm: 576px !default;
-$breakpoint-md: 768px !default;
-$breakpoint-lg: 992px !default;
-$breakpoint-xl: 1200px !default;
-$breakpoint-xxl: 1400px !default;

package/src/themes/mashroom/01-settings/_settings.btn-group.scss

@@ -1,5 +0,0 @@
-// Forward the btn-group settings as-is since the original doesn't use !default
-@forward '../../../styles/01-settings/settings.btn-group';
-
-// Override the gap value directly
-$btn-group-gap: 8px; // 8px - tighter grouping for cohesion

package/src/themes/mashroom/01-settings/_settings.button.scss

@@ -1,50 +0,0 @@
-@use '../../../styles/01-settings/settings.button' with (
-  $btn-padding-y: 12px,
-  // 12px - increased for more spacious feel
-  $btn-padding-x: 24px,
-  // 24px - wider buttons for modern look
-  $btn-font-size: 16px,
-  // 16px - larger text for better readability
-  $btn-line-height: 1.5,
-  $btn-font-weight: 500,
-
-  // Small button sizing
-  $btn-padding-y-sm: 8px,
-  // 8px
-  $btn-padding-x-sm: 16px,
-  // 16px
-  $btn-font-size-sm: 14px,
-  // 14px
-  // Large button sizing
-  $btn-padding-y-lg: 16px,
-  // 16px
-  $btn-padding-x-lg: 32px,
-  // 32px
-  $btn-font-size-lg: 18px,
-  // 18px
-  // Button border and radius
-  $btn-border-width: 1px,
-  $btn-border-radius: 8px,
-  // 8px - softer corners
-  $btn-border-radius-sm: 6px,
-  // 6px
-  $btn-border-radius-lg: 10px,
-  // 10px
-  // Button transitions
-  $btn-transition: all 200ms ease-in-out,
-
-  // smoother transition
-  // Button focus and states
-  $btn-focus-width: 2px,
-  $btn-focus-box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.3),
-  // slightly larger focus ring
-  $btn-disabled-opacity: 0.6,
-
-  // Button icon spacing
-  $btn-inner-gap: 8px,
-  // 8px
-  // Button hover effects
-  $btn-hover-transform: translateY(-2px),
-  // more pronounced lift
-  $btn-active-transform: translateY(0)
-);

package/src/themes/mashroom/01-settings/_settings.callout.scss

@@ -1,81 +0,0 @@
-@use '../../../styles/01-settings/settings.callout' with (
-  // Callout
-  $callout-width: 100%,
-  $callout-padding-x: 20px,
-  // 20px - more generous padding
-  $callout-padding-y: 16px,
-  // 16px
-  $callout-tost-padding-x: 20px,
-  // 20px
-  $callout-tost-padding-y: 16px,
-  // 16px
-  $callout-bg: #ffffff,
-  $callout-border-radius: 8px,
-  // 8px - softer corners
-  $callout-border-color: var(--atomix-gray-3),
-  $callout-border-width: 1px,
-  $callout-title-font-size: 16px,
-  // 16px
-  $callout-title-font-weight: 600,
-  $callout-title-color: var(--atomix-gray-9),
-  $callout-text-font-size: 14px,
-  // 14px
-  $callout-text-font-weight: 400,
-  $callout-text-color: var(--atomix-gray-7),
-  $callout-message-spacer: 12px,
-  // 12px
-  $callout-icon-size: 20px,
-  // 20px
-  $callout-icon-color: var(--atomix-primary),
-  $callout-close-btn-size: 20px,
-  // 20px
-  $callout-actions-spacer: 12px,
-  // 12px
-  $callout-actions-spacer-y: 16px,
-  // 16px
-  $callout-toast-bg: #ffffff,
-  $callout-box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.12),
-  // enhanced shadow
-  // Toast positions
-  $callout-toast-positions: (
-      'top-right': (
-        top: 24px,
-        // 24px
-        right: 24px,
-        // 24px
-      ),
-      'top-left': (
-        top: 24px,
-        // 24px
-        left: 24px,
-        // 24px
-      ),
-      'top-center': (
-        top: 24px,
-        // 24px
-        left: 50%,
-        transform: translateX(-50%),
-      ),
-      'bottom-right': (
-        bottom: 24px,
-        // 24px
-        right: 24px,
-        // 24px
-      ),
-      'bottom-left': (
-        bottom: 24px,
-        // 24px
-        left: 24px,
-        // 24px
-      ),
-      'bottom-center': (
-        bottom: 24px,
-        // 24px
-        left: 50%,
-        transform: translateX(-50%),
-      )
-    ),
-
-  // Z-index for toast containers
-  $callout-toast-z-index: 1000
-);

package/src/themes/mashroom/01-settings/_settings.card.scss

@@ -1,52 +0,0 @@
-/*!
- * Shaj Default Theme Card Settings
- * Modern card styling with clean aesthetics
- * Overrides Atomix default card settings
- */
-
-@use '../../../styles/01-settings/settings.card' with (
-  $card-spacer-y: 20px,
-  // 20px - more generous spacing
-  $card-spacer-x: 20px,
-  // 20px
-  $card-row-spacer-y: 16px,
-  // 16px
-  $card-row-spacer-x: 16px,
-  // 16px
-  $card-title-spacer-y: 6px,
-  // 6px
-  $card-action-spacer-y: 16px,
-  // 16px
-  $card-header-spacer-y: 16px,
-
-  // 16px
-  $card-title-color: var(--atomix-body-color),
-  $card-title-font-size: 18px,
-  // 18px - larger titles
-  $card-text-color: var(--atomix-secondary-text-emphasis),
-  $card-text-font-size: 16px,
-
-  // 16px - better readability
-  $card-border-width: 1px,
-  $card-border-color: var(--atomix-primary-border-subtle),
-  $card-border-radius: var(--atomix-border-radius-xl),
-  // 12px
-  $card-image-border-radius: var(--atomix-border-radius-xl),
-  $card-boxshadow: 0 2px 8px rgba(0, 0, 0, 0.06),
-  // subtle shadow
-  $card-hover-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12),
-  // elevated on hover
-  $card-height: null,
-
-  $card-bg: var(--atomix-primary-bg-subtle),
-  $card-bg-hover: var(--atomix-secondary-bg-subtle),
-  $card-icon-size: 24px,
-  // 24px - larger icons
-  $card-icon-padding: 12px,
-  // 12px
-  $card-icon-bg: var(--atomix-brand-bg-subtle),
-  $card-icon-color: var(--atomix-brand-text-emphasis),
-  $card-width: 100%,
-
-  $card-hover: true // enable hover effects
-);

package/src/themes/mashroom/01-settings/_settings.checkbox-group.scss

@@ -1,5 +0,0 @@
-@use '../../../styles/01-settings/settings.checkbox-group' with (
-  $checkbox-group-items-spacer-y: 12px,
-  // 12px - better vertical spacing
-  $checkbox-group-items-spacer-x: 20px // 20px - more horizontal spacing
-);

package/src/themes/mashroom/01-settings/_settings.checkbox.scss

@@ -1,23 +0,0 @@
-@use '../../../styles/01-settings/settings.checkbox' with (
-  $checkbox-width: 20px,
-  // 20px
-  $checkbox-height: 20px,
-  // 20px
-  $checkbox-spacer: 12px,
-  // 12px - more space between checkbox and label
-  $checkbox-font-size: 16px,
-  // 16px
-  $checkbox-text-color: var(--atomix-body-color),
-  $checkbox-checked-text-color: var(--atomix-body-color),
-  $checkbox-text-color-disabled: var(--atomix-tertiary-text-emphasis),
-  $checkbox-checked-text-color-disabled: var(--atomix-disabled-text-emphasis),
-  $checkbox-bg: var(--atomix-body-bg),
-  $checkbox-checked-bg: var(--atomix-invert-bg-subtle),
-  $checkbox-checked-bg-hover: var(--atomix-tertiary-text-emphasis),
-  $checkbox-checked-bg-disabled: var(--atomix-disabled-text-emphasis),
-  $checkbox-border-width: 1px,
-  $checkbox-border-color: var(--atomix-tertiary-text-emphasis),
-  $checkbox-border-color-hover: var(--atomix-primary-text-emphasis),
-  $checkbox-border-color-disabled: var(--atomix-disabled-text-emphasis),
-  $checkbox-border-color-error: var(--atomix-error-border-subtle)
-);

package/src/themes/mashroom/01-settings/_settings.color-mode.scss

@@ -1,7 +0,0 @@
-@use '../../../styles/01-settings/settings.color-mode' with (
-  // Enable dark mode support
-  $enable-dark-mode: true,
-
-  // Color mode configuration - use data attribute for better control
-  $color-mode-type: 'data-attribute' // Options: "media-query" or "data-attribute"
-);