@magmonium/one 0.0.5 → 0.0.7

package/sass/_m-components.sass

@@ -1,110 +0,0 @@
-// Global display: block for m- components to ensure they occupy space correctly
-// Component-specific styles relocated from libs/sass
-
-m-frame, m-carousel, m-one-carousel
-  display: block
-
-// Scoped wizard stepper overrides to avoid app-specific lint restrictions
-.wizard__stepper
-  .stepper
-    display: flex
-    flex-direction: row
-    gap: 0.5rem
-    
-    @media (min-width: 992px) // desktop breakpoint
-      flex-direction: column
-      gap: 1.5rem
-
-  .stepper__step
-    display: flex
-    align-items: center
-    gap: 0.75rem
-    cursor: pointer
-    transition: all 0.3s ease
-    opacity: 0.5
-
-    &--selected
-      opacity: 1
-      
-      .stepper__step-icon
-        background: linear-gradient(135deg, #a855f7, #14b8a6) !important
-        border-color: transparent !important
-        box-shadow: 0 0 15px rgba(168, 85, 247, 0.5) !important
-        color: #ffffff !important
-
-      .stepper__step-label
-        color: #ffffff !important
-        font-weight: 600 !important
-
-    &--completed
-      opacity: 0.8
-      
-      .stepper__step-icon
-        background: rgba(20, 184, 166, 0.2) !important
-        border-color: #14b8a6 !important
-        color: #14b8a6 !important
-
-  .stepper__step-icon
-    width: 2.25rem !important
-    height: 2.25rem !important
-    border-radius: 50% !important
-    border: 2px solid rgba(255, 255, 255, 0.15) !important
-    background: rgba(15, 23, 42, 0.6) !important
-    color: #94a3b8 !important
-    display: flex !important
-    align-items: center !important
-    justify-content: center !important
-    font-weight: 700 !important
-    font-size: 0.875rem !important
-    transition: all 0.3s ease !important
-
-  .stepper__step-label
-    font-size: 0.875rem !important
-    color: #94a3b8 !important
-    font-weight: 500 !important
-    transition: all 0.3s ease !important
-    text-transform: capitalize !important
-
-// Scoped wizard footer button group overrides
-.wizard__footer
-  .m-button-group
-    display: flex
-    justify-content: space-between
-    gap: 1rem
-
-    button
-      font-weight: 600 !important
-      font-size: 0.9375rem !important
-      padding: 0.75rem 1.75rem !important
-      border-radius: 0.75rem !important
-      transition: all 0.3s ease !important
-      cursor: pointer
-
-    // Next / Submit Button
-    [name="next_step"] button, button:not([disabled]):not(.prev_step)
-      background: linear-gradient(135deg, #a855f7, #7c3aed) !important
-      color: #ffffff !important
-      border: none !important
-      box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3) !important
-
-      &:hover:not([disabled])
-        background: linear-gradient(135deg, #c084fc, #8b5cf6) !important
-        box-shadow: 0 6px 20px rgba(124, 58, 237, 0.5) !important
-        transform: translateY(-2px)
-
-    // Prev Button
-    [name="prev_step"] button
-      background: rgba(255, 255, 255, 0.05) !important
-      color: #e2e8f0 !important
-      border: 1px solid rgba(255, 255, 255, 0.08) !important
-
-      &:hover:not([disabled])
-        background: rgba(255, 255, 255, 0.1) !important
-        transform: translateY(-2px)
-
-    button[disabled]
-      background: rgba(255, 255, 255, 0.03) !important
-      color: rgba(255, 255, 255, 0.15) !important
-      border: 1px solid rgba(255, 255, 255, 0.03) !important
-      box-shadow: none !important
-      cursor: not-allowed

package/sass/_menu.sass

@@ -1,132 +0,0 @@
-@use 'variables/number' as n
-@use 'variables/colors' as c
-
-.m-selector-box
-  position: fixed
-  z-index: n.$base-z-index * 10000
-
-  .m-context-menu
-    position: fixed
-
-  .m-dropdown-input
-    position: fixed
-
-  .m-color-picker
-    position: fixed
-
-    .color-picker-box
-      background: c.$background-color
-      border: var(--m-input-border-width, 2px) solid var(--m-text-input-border, var(--m-input-color, var(--m-mm, #4169e1)))
-      border-radius: var(--m-input-radius, 4px)
-      box-shadow: none
-
-  .m-date-input
-    position: fixed
-
-    .date-picker
-      background: c.$background-color
-      border: var(--m-input-border-width, 2px) solid var(--m-text-input-border, var(--m-input-color, var(--m-mm, #4169e1)))
-      border-radius: var(--m-input-radius, 8px)
-      box-shadow: none
-      padding: 0.75rem
-      animation: date-picker-in 200ms ease-out
-      // Small, borderless buttons throughout the picker
-      --m-button-size: 0.75rem
-
-      // Day buttons are formatted as circular, compact buttons
-      .date-view__calendar__week__day
-        m-button
-          width: 28px
-          height: 28px
-          display: inline-flex
-          align-items: center
-          justify-content: center
-
-          button
-            padding: 0 !important
-            width: 100% !important
-            height: 100% !important
-            border-radius: 50% !important
-            display: flex
-            align-items: center
-            justify-content: center
-
-      // Month & Year grid buttons are compact rounded rectangles
-      .date-picker-month-view__grid, .date-picker-year-view__grid
-        m-button
-          width: 100%
-          button
-            padding: 0 4px !important
-            width: 100% !important
-
-      // All non-primary buttons in the picker are borderless
-      m-button button:not(.primary)
-        border-color: transparent !important
-
-      m-date-picker-month-view, m-date-picker-year-view, m-date-picker-date-view
-        display: flex
-        width: 100%
-        justify-content: center
-
-    .date-picker-header
-      display: flex
-      align-items: center
-      justify-content: center
-      padding: 0 0 0.5rem 0
-
-      m-one-button-group, m-button-group, .button-group
-        display: flex
-        width: 100%
-        justify-content: space-between
-        align-items: center
-
-        m-button:nth-child(2)
-          margin-left: auto
-          margin-right: auto
-
-    .date-view
-      &__weekdays
-        display: grid
-        grid-template-columns: repeat(7, 1fr)
-        text-align: center
-        font-size: 0.65rem
-        font-weight: 800
-        text-transform: uppercase
-        color: c.$text-tertiary
-        padding: 0.25rem 0
-        gap: 0.25rem
-
-        &__day
-          padding: 0.125rem
-          opacity: 0.6
-
-      &__calendar
-        &__week
-          display: grid
-          grid-template-columns: repeat(7, 1fr)
-          text-align: center
-          gap: 0.25rem
-          padding: 0.125rem 0
-
-          &__day
-            display: flex
-            align-items: center
-            justify-content: center
-            padding: 0.125rem 0
-
-    .date-picker-month-view,
-    .date-picker-year-view
-      &__grid
-        display: grid
-        grid-template-columns: repeat(3, 1fr)
-        place-items: center
-        gap: 0.125rem
-        padding: 0.125rem 0
-
-@keyframes date-picker-in
-  from
-    opacity: 0
-    transform: scale(0.95) translateY(-4px)
-  to
-    opacity: 1
-    transform: scale(1) translateY(0)

package/sass/utilities/_backdrops.sass

@@ -1,228 +0,0 @@
-// Backdrop utility classes derived from mixins
-@use '../mixins/backdrops' as backdrop
-
-// Standard backdrop effects
-.standard-backdrop
-  @include backdrop.standard-backdrop
-
-.glass-backdrop
-  @include backdrop.glass-backdrop
-
-.frosted-backdrop
-  @include backdrop.frosted-backdrop
-
-.theme-backdrop
-  @include backdrop.theme-backdrop
-
-.tinted-backdrop
-  @include backdrop.tinted-backdrop
-
-// Blur variations
-.backdrop-blur-none
-  @include backdrop.backdrop-blur-none
-
-.backdrop-blur-sm
-  @include backdrop.backdrop-blur-sm
-
-.backdrop-blur
-  @include backdrop.backdrop-blur
-
-.backdrop-blur-md
-  @include backdrop.backdrop-blur-md
-
-.backdrop-blur-lg
-  @include backdrop.backdrop-blur-lg
-
-.backdrop-blur-xl
-  @include backdrop.backdrop-blur-xl
-
-.backdrop-blur-2xl
-  @include backdrop.backdrop-blur-2xl
-
-.backdrop-blur-3xl
-  @include backdrop.backdrop-blur-3xl
-
-// Brightness variations
-.backdrop-brightness-50
-  @include backdrop.backdrop-brightness-50
-
-.backdrop-brightness-75
-  @include backdrop.backdrop-brightness-75
-
-.backdrop-brightness-125
-  @include backdrop.backdrop-brightness-125
-
-.backdrop-brightness-150
-  @include backdrop.backdrop-brightness-150
-
-// Contrast variations
-.backdrop-contrast-50
-  @include backdrop.backdrop-contrast-50
-
-.backdrop-contrast-75
-  @include backdrop.backdrop-contrast-75
-
-.backdrop-contrast-125
-  @include backdrop.backdrop-contrast-125
-
-.backdrop-contrast-150
-  @include backdrop.backdrop-contrast-150
-
-// Saturation variations
-.backdrop-saturate-50
-  @include backdrop.backdrop-saturate-50
-
-.backdrop-saturate-150
-  @include backdrop.backdrop-saturate-150
-
-.backdrop-saturate-200
-  @include backdrop.backdrop-saturate-200
-
-// Combined glass effects
-.backdrop-glass-enhanced
-  @include backdrop.backdrop-glass-enhanced
-
-.backdrop-frosted-glass
-  @include backdrop.backdrop-frosted-glass
-
-// Modal and overlay backdrops
-.modal-backdrop
-  @include backdrop.modal-backdrop
-
-.overlay-backdrop
-  @include backdrop.overlay-backdrop
-
-.popup-backdrop
-  @include backdrop.popup-backdrop
-
-// Navigation backdrops
-.nav-backdrop
-  @include backdrop.nav-backdrop
-
-.sidebar-backdrop
-  @include backdrop.sidebar-backdrop
-
-// Card and surface backdrops
-.card-backdrop
-  @include backdrop.card-backdrop
-
-.surface-backdrop
-  @include backdrop.surface-backdrop
-
-// Themed backdrops
-.backdrop-adaptive
-  @include backdrop.backdrop-theme-adaptive
-
-.backdrop-adaptive-light
-  @include backdrop.backdrop-theme-adaptive(rgba(255, 255, 255, 0.3))
-
-.backdrop-adaptive-heavy
-  @include backdrop.backdrop-theme-adaptive(rgba(255, 255, 255, 0.5))
-
-// Disable backdrop
-.backdrop-none
-  @include backdrop.backdrop-none
-
-// Fallback for unsupported browsers
-.backdrop-fallback
-  @include backdrop.backdrop-fallback
-
-.backdrop-fallback-light
-  @include backdrop.backdrop-fallback(rgba(255, 255, 255, 0.95))
-
-.backdrop-fallback-dark
-  @include backdrop.backdrop-fallback(rgba(0, 0, 0, 0.85))
-
-// Print safe backdrops
-.backdrop-print-safe
-  @include backdrop.backdrop-print-safe
-
-// Reduced motion backdrops
-.backdrop-reduced-motion
-  @include backdrop.backdrop-reduced-motion
-
-// Component-specific backdrops
-.menu-backdrop
-  @include backdrop.sidebar-backdrop
-
-.dropdown-backdrop
-  @include backdrop.popup-backdrop
-
-.dialog-backdrop
-  @include backdrop.modal-backdrop
-
-.toast-backdrop
-  @include backdrop.glass-backdrop
-
-.tooltip-backdrop
-  @include backdrop.surface-backdrop
-
-// Intensity variations
-.backdrop-subtle
-  @include backdrop.backdrop(5px, 0.9, rgba(255, 255, 255, 0.05))
-
-.backdrop-medium
-  @include backdrop.backdrop(12px, 0.8, rgba(255, 255, 255, 0.15))
-
-.backdrop-strong
-  @include backdrop.backdrop(25px, 0.7, rgba(255, 255, 255, 0.25))
-
-// Color-themed backdrops
-.backdrop-blue
-  @include backdrop.tinted-backdrop(rgba(0, 123, 255, 0.1))
-
-.backdrop-green
-  @include backdrop.tinted-backdrop(rgba(40, 167, 69, 0.1))
-
-.backdrop-red
-  @include backdrop.tinted-backdrop(rgba(220, 53, 69, 0.1))
-
-.backdrop-yellow
-  @include backdrop.tinted-backdrop(rgba(255, 193, 7, 0.1))
-
-.backdrop-purple
-  @include backdrop.tinted-backdrop(rgba(102, 16, 242, 0.1))
-
-// Interactive states
-.backdrop-hover
-  transition: all 0.3s ease-in-out
-
-  &:hover
-    @include backdrop.glass-backdrop
-
-.backdrop-focus
-  &:focus
-    @include backdrop.frosted-backdrop
-
-// Responsive backdrops
-@media (max-width: 768px)
-  .backdrop-mobile-only
-    @include backdrop.standard-backdrop
-
-  .backdrop-mobile-light
-    @include backdrop.backdrop(8px, 0.9, rgba(255, 255, 255, 0.1))
-
-@media (min-width: 769px)
-  .backdrop-desktop-only
-    @include backdrop.glass-backdrop
-
-  .backdrop-desktop-strong
-    @include backdrop.frosted-backdrop
-
-// Animation classes (for JavaScript control)
-.backdrop-animate-in
-  opacity: 0
-  backdrop-filter: blur(0px)
-  transition: all 0.3s ease-out
-
-  &.active
-    opacity: 1
-    @include backdrop.standard-backdrop
-
-.backdrop-animate-out
-  @include backdrop.standard-backdrop
-  transition: all 0.3s ease-in
-
-  &.hiding
-    opacity: 0
-    backdrop-filter: blur(0px)