@casoon/atlas-styles 0.0.8 → 0.0.9

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Jörn Seidel (CASOON)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components.css

@@ -497,7 +497,8 @@
 .atlas-button {
   position: relative;
   overflow: hidden;
-  transition: transform var(--atlas-duration-fast) var(--atlas-ease-bounce),
+  transition:
+    transform var(--atlas-duration-fast) var(--atlas-ease-bounce),
     filter var(--atlas-duration-fast) var(--atlas-ease-standard),
     box-shadow var(--atlas-duration-fast) var(--atlas-ease-standard);
   transform-origin: center center;
@@ -520,8 +521,7 @@
   opacity: 0.2;
   transform: scale(0);
   pointer-events: none;
-  animation: atlas-ripple var(--atlas-duration-normal)
-    var(--atlas-ease-decelerate) forwards;
+  animation: atlas-ripple var(--atlas-duration-normal) var(--atlas-ease-decelerate) forwards;
 }
 
 .atlas-button-spinner {
@@ -536,7 +536,8 @@
 
 /* Card */
 .atlas-card {
-  transition: transform var(--atlas-duration-normal) var(--atlas-ease-spring),
+  transition:
+    transform var(--atlas-duration-normal) var(--atlas-ease-spring),
     box-shadow var(--atlas-duration-normal) var(--atlas-ease-standard);
   transform-style: preserve-3d;
 }
@@ -576,13 +577,11 @@
 }
 
 .atlas-modal {
-  animation: atlas-modal-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-modal-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-modal-closing {
-  animation: atlas-modal-out var(--atlas-duration-fast)
-    var(--atlas-ease-accelerate) forwards;
+  animation: atlas-modal-out var(--atlas-duration-fast) var(--atlas-ease-accelerate) forwards;
 }
 
 /* Drawer */
@@ -593,35 +592,29 @@
   backdrop-filter: blur(4px);
 }
 
-.atlas-drawer[data-side="left"] {
-  animation: atlas-drawer-left-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='left'] {
+  animation: atlas-drawer-left-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="right"] {
-  animation: atlas-drawer-right-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='right'] {
+  animation: atlas-drawer-right-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="top"] {
-  animation: atlas-drawer-top-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='top'] {
+  animation: atlas-drawer-top-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="bottom"] {
-  animation: atlas-drawer-bottom-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='bottom'] {
+  animation: atlas-drawer-bottom-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 /* Dropdown */
 .atlas-dropdown-menu {
-  animation: atlas-dropdown-in var(--atlas-duration-fast)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-dropdown-in var(--atlas-duration-fast) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-dropdown-item {
-  transition: background-color var(--atlas-duration-fast)
-    var(--atlas-ease-standard);
+  transition: background-color var(--atlas-duration-fast) var(--atlas-ease-standard);
 }
 
 .atlas-dropdown-item:hover,
@@ -644,11 +637,10 @@
 
 .atlas-toast {
   pointer-events: auto;
-  animation: atlas-toast-in-bottom var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-toast-in-bottom var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-toast-container[data-position^="top"] .atlas-toast {
+.atlas-toast-container[data-position^='top'] .atlas-toast {
   animation-name: atlas-toast-in-top;
 }
 
@@ -659,8 +651,7 @@
 .atlas-toast-checkmark {
   stroke-dasharray: 20;
   stroke-dashoffset: 20;
-  animation: atlas-checkmark-draw 300ms var(--atlas-ease-decelerate) 100ms
-    forwards;
+  animation: atlas-checkmark-draw 300ms var(--atlas-ease-decelerate) 100ms forwards;
 }
 
 .atlas-toast-progress {
@@ -726,22 +717,17 @@
   inset: 0;
 }
 
-.atlas-skeleton[data-animation="shimmer"] .atlas-skeleton-animation {
-  background: linear-gradient(
-    90deg,
-    transparent,
-    rgba(255, 255, 255, 0.5),
-    transparent
-  );
+.atlas-skeleton[data-animation='shimmer'] .atlas-skeleton-animation {
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
   animation: atlas-skeleton-shimmer 1.5s var(--atlas-ease-standard) infinite;
 }
 
-.atlas-skeleton[data-animation="pulse"] .atlas-skeleton-animation {
+.atlas-skeleton[data-animation='pulse'] .atlas-skeleton-animation {
   animation: atlas-skeleton-pulse 1.5s var(--atlas-ease-standard) infinite;
   background-color: rgba(255, 255, 255, 0.3);
 }
 
-.atlas-skeleton[data-animation="wave"] {
+.atlas-skeleton[data-animation='wave'] {
   background: linear-gradient(
     90deg,
     var(--atlas-gray-200) 25%,
@@ -759,7 +745,8 @@
 @media (hover: hover) {
   /* Gentle lift on hover */
   .atlas-hover-lift {
-    transition: transform var(--atlas-duration-fast) var(--atlas-ease-standard),
+    transition:
+      transform var(--atlas-duration-fast) var(--atlas-ease-standard),
       box-shadow var(--atlas-duration-fast) var(--atlas-ease-standard);
   }
 
@@ -770,8 +757,8 @@
 
   /* Subtle glow on hover */
   .atlas-hover-glow {
-    transition: box-shadow var(--atlas-duration-normal)
-        var(--atlas-ease-standard),
+    transition:
+      box-shadow var(--atlas-duration-normal) var(--atlas-ease-standard),
       filter var(--atlas-duration-normal) var(--atlas-ease-standard);
   }
 
@@ -819,38 +806,31 @@
 }
 
 .atlas-stagger-fade-up {
-  animation: atlas-slide-up var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-up var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-down {
-  animation: atlas-slide-down var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-down var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-left {
-  animation: atlas-slide-left var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-left var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-right {
-  animation: atlas-slide-right var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-right var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-scale {
-  animation: atlas-scale-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-scale-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-flip {
-  animation: atlas-flip-in var(--atlas-duration-normal) var(--atlas-ease-spring)
-    forwards;
+  animation: atlas-flip-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-zoom {
-  animation: atlas-zoom-in var(--atlas-duration-normal) var(--atlas-ease-bounce)
-    forwards;
+  animation: atlas-zoom-in var(--atlas-duration-normal) var(--atlas-ease-bounce) forwards;
 }
 
 /* ==========================================================================

package/dist/index.css

@@ -2548,7 +2548,8 @@
 .atlas-button {
   position: relative;
   overflow: hidden;
-  transition: transform var(--atlas-duration-fast) var(--atlas-ease-bounce),
+  transition:
+    transform var(--atlas-duration-fast) var(--atlas-ease-bounce),
     filter var(--atlas-duration-fast) var(--atlas-ease-standard),
     box-shadow var(--atlas-duration-fast) var(--atlas-ease-standard);
   transform-origin: center center;
@@ -2571,8 +2572,7 @@
   opacity: 0.2;
   transform: scale(0);
   pointer-events: none;
-  animation: atlas-ripple var(--atlas-duration-normal)
-    var(--atlas-ease-decelerate) forwards;
+  animation: atlas-ripple var(--atlas-duration-normal) var(--atlas-ease-decelerate) forwards;
 }
 
 .atlas-button-spinner {
@@ -2587,7 +2587,8 @@
 
 /* Card */
 .atlas-card {
-  transition: transform var(--atlas-duration-normal) var(--atlas-ease-spring),
+  transition:
+    transform var(--atlas-duration-normal) var(--atlas-ease-spring),
     box-shadow var(--atlas-duration-normal) var(--atlas-ease-standard);
   transform-style: preserve-3d;
 }
@@ -2627,13 +2628,11 @@
 }
 
 .atlas-modal {
-  animation: atlas-modal-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-modal-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-modal-closing {
-  animation: atlas-modal-out var(--atlas-duration-fast)
-    var(--atlas-ease-accelerate) forwards;
+  animation: atlas-modal-out var(--atlas-duration-fast) var(--atlas-ease-accelerate) forwards;
 }
 
 /* Drawer */
@@ -2644,35 +2643,29 @@
   backdrop-filter: blur(4px);
 }
 
-.atlas-drawer[data-side="left"] {
-  animation: atlas-drawer-left-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='left'] {
+  animation: atlas-drawer-left-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="right"] {
-  animation: atlas-drawer-right-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='right'] {
+  animation: atlas-drawer-right-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="top"] {
-  animation: atlas-drawer-top-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='top'] {
+  animation: atlas-drawer-top-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-drawer[data-side="bottom"] {
-  animation: atlas-drawer-bottom-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+.atlas-drawer[data-side='bottom'] {
+  animation: atlas-drawer-bottom-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 /* Dropdown */
 .atlas-dropdown-menu {
-  animation: atlas-dropdown-in var(--atlas-duration-fast)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-dropdown-in var(--atlas-duration-fast) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-dropdown-item {
-  transition: background-color var(--atlas-duration-fast)
-    var(--atlas-ease-standard);
+  transition: background-color var(--atlas-duration-fast) var(--atlas-ease-standard);
 }
 
 .atlas-dropdown-item:hover,
@@ -2695,11 +2688,10 @@
 
 .atlas-toast {
   pointer-events: auto;
-  animation: atlas-toast-in-bottom var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-toast-in-bottom var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
-.atlas-toast-container[data-position^="top"] .atlas-toast {
+.atlas-toast-container[data-position^='top'] .atlas-toast {
   animation-name: atlas-toast-in-top;
 }
 
@@ -2710,8 +2702,7 @@
 .atlas-toast-checkmark {
   stroke-dasharray: 20;
   stroke-dashoffset: 20;
-  animation: atlas-checkmark-draw 300ms var(--atlas-ease-decelerate) 100ms
-    forwards;
+  animation: atlas-checkmark-draw 300ms var(--atlas-ease-decelerate) 100ms forwards;
 }
 
 .atlas-toast-progress {
@@ -2777,22 +2768,17 @@
   inset: 0;
 }
 
-.atlas-skeleton[data-animation="shimmer"] .atlas-skeleton-animation {
-  background: linear-gradient(
-    90deg,
-    transparent,
-    rgba(255, 255, 255, 0.5),
-    transparent
-  );
+.atlas-skeleton[data-animation='shimmer'] .atlas-skeleton-animation {
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
   animation: atlas-skeleton-shimmer 1.5s var(--atlas-ease-standard) infinite;
 }
 
-.atlas-skeleton[data-animation="pulse"] .atlas-skeleton-animation {
+.atlas-skeleton[data-animation='pulse'] .atlas-skeleton-animation {
   animation: atlas-skeleton-pulse 1.5s var(--atlas-ease-standard) infinite;
   background-color: rgba(255, 255, 255, 0.3);
 }
 
-.atlas-skeleton[data-animation="wave"] {
+.atlas-skeleton[data-animation='wave'] {
   background: linear-gradient(
     90deg,
     var(--atlas-gray-200) 25%,
@@ -2810,7 +2796,8 @@
 @media (hover: hover) {
   /* Gentle lift on hover */
   .atlas-hover-lift {
-    transition: transform var(--atlas-duration-fast) var(--atlas-ease-standard),
+    transition:
+      transform var(--atlas-duration-fast) var(--atlas-ease-standard),
       box-shadow var(--atlas-duration-fast) var(--atlas-ease-standard);
   }
 
@@ -2821,8 +2808,8 @@
 
   /* Subtle glow on hover */
   .atlas-hover-glow {
-    transition: box-shadow var(--atlas-duration-normal)
-        var(--atlas-ease-standard),
+    transition:
+      box-shadow var(--atlas-duration-normal) var(--atlas-ease-standard),
       filter var(--atlas-duration-normal) var(--atlas-ease-standard);
   }
 
@@ -2870,38 +2857,31 @@
 }
 
 .atlas-stagger-fade-up {
-  animation: atlas-slide-up var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-up var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-down {
-  animation: atlas-slide-down var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-down var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-left {
-  animation: atlas-slide-left var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-left var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-fade-right {
-  animation: atlas-slide-right var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-slide-right var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-scale {
-  animation: atlas-scale-in var(--atlas-duration-normal)
-    var(--atlas-ease-spring) forwards;
+  animation: atlas-scale-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-flip {
-  animation: atlas-flip-in var(--atlas-duration-normal) var(--atlas-ease-spring)
-    forwards;
+  animation: atlas-flip-in var(--atlas-duration-normal) var(--atlas-ease-spring) forwards;
 }
 
 .atlas-stagger-zoom {
-  animation: atlas-zoom-in var(--atlas-duration-normal) var(--atlas-ease-bounce)
-    forwards;
+  animation: atlas-zoom-in var(--atlas-duration-normal) var(--atlas-ease-bounce) forwards;
 }
 
 /* ==========================================================================

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@casoon/atlas-styles",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Pure CSS design system with glass effects, gradients, and utilities for Tailwind v4",
   "type": "module",
   "files": [
@@ -23,10 +23,6 @@
     "./animations.css": "./dist/animations.css",
     "./utilities.css": "./dist/utilities.css"
   },
-  "scripts": {
-    "build": "rimraf dist && node build.js",
-    "clean": "rimraf dist"
-  },
   "keywords": [
     "tailwind",
     "css",
@@ -56,5 +52,9 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "scripts": {
+    "build": "rimraf dist && node build.js",
+    "clean": "rimraf dist"
   }
-}
+}