zeus-css 1.0.10 → 1.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +10 -0
  2. package/dist/zeus.css +1 -1
  3. package/package.json +5 -3
  4. package/scss/cheatsheet.md +249 -249
  5. package/scss/llms.txt +247 -247
  6. package/scss/zeus.config.scss +1 -1
  7. package/scss/zeus.tokens.json +687 -687
  8. package/scss/CHANGELOG.md +0 -287
package/README.md CHANGED
@@ -36,6 +36,16 @@ Always import it from a single **shared/root** entry point, never from an indivi
36
36
 
37
37
  **TypeScript:** `import 'zeus-css/dist/zeus.css'` needs *some* ambient `declare module '*.css'` to type-check. Next.js, Vite and Nuxt scaffolds already include this by default — nothing to do. If you're on a bare TypeScript setup and see `Cannot find module 'zeus-css/dist/zeus.css'`, running `npx zeus-css init` (step 2) creates `zeus-css-env.d.ts` for you automatically.
38
38
 
39
+ > ⚠️ **Step 1 and Step 2 are mutually exclusive.** Use the default import
40
+ > (`zeus-css/dist/zeus.css`) if you don't need custom theming. If you run
41
+ > `npx zeus-css init` and customize your theme, **replace** the default
42
+ > import with `import './zeus.theme.css'` — never use both together.
43
+ >
44
+ > ```text
45
+ > No customization? → import 'zeus-css/dist/zeus.css'
46
+ > Custom theme? → npx zeus-css init, compile, import './zeus.theme.css' (replaces the Step 1 import)
47
+ > ```
48
+
39
49
  ### 2. Customize it
40
50
  Run the init command in the folder you want the config files in (you'll see a reminder for this after `npm install` too):
41
51
 
package/dist/zeus.css CHANGED
@@ -8453,4 +8453,4 @@
8453
8453
  }
8454
8454
  }
8455
8455
  }
8456
- /* Zeus CSS v1.0.0 */
8456
+ /* Zeus CSS v1.0.12 */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zeus-css",
3
- "version": "1.0.10",
3
+ "version": "1.0.12",
4
4
  "description": "⚡ A Premium, Zero-Emission, Fluid-Scaling CSS Framework based on Sass SCSS Engine",
5
5
  "author": "Stavros Lazaris",
6
6
  "license": "MIT",
@@ -15,7 +15,7 @@
15
15
  "main": "./dist/zeus.css",
16
16
  "style": "./dist/zeus.css",
17
17
  "bin": {
18
- "zeus-css": "./bin/init.js"
18
+ "zeus-css": "bin/init.js"
19
19
  },
20
20
  "scripts": {
21
21
  "postinstall": "node ./bin/postinstall.js"
@@ -30,6 +30,8 @@
30
30
  "./zeus": "./scss/zeus.scss",
31
31
  "./config": "./scss/zeus.config.scss",
32
32
  "./customize": "./scss/zeus.customize.scss",
33
+ "./css": "./dist/zeus.css",
34
+ "./min": "./dist/zeus.min.css",
33
35
  "./dist/*": "./dist/*",
34
36
  "./scss/*": "./scss/*",
35
37
  "./bin/*": "./bin/*"
@@ -52,4 +54,4 @@
52
54
  "design-tokens",
53
55
  "type-safe"
54
56
  ]
55
- }
57
+ }
package/scss/cheatsheet.md CHANGED
@@ -1,249 +1,249 @@
1
- # Zeus CSS Cheatsheet
2
-
3
- > Auto-generated from source — do not hand-edit. Regenerate with `npm run gen:cheatsheet`.
4
-
5
- ## Mixins & Functions
6
-
7
- | Kind | Signature | Description | File |
8
- |---|---|---|---|
9
- | mixin | `fade-in($duration: 0.3s, $delay: 0s, $timing: ease-in-out)` | Usage: @include fade-in(0.5s, 0.2s); | `foundation/core/engine/animations.scss` |
10
- | mixin | `slide-in($direction: bottom, $duration: 0.3s, $delay: 0s, $timing: ease-out)` | Usage: @include slide-in(left, 0.4s); | `foundation/core/engine/animations.scss` |
11
- | mixin | `scale($scale: 1.05, $duration: 0.3s, $timing: ease-in-out)` | Usage: @include scale(1.1, 0.3s); | `foundation/core/engine/animations.scss` |
12
- | mixin | `bounce($duration: 0.8s, $iteration: 1, $delay: 0s)` | Usage: @include bounce(0.6s, infinite); | `foundation/core/engine/animations.scss` |
13
- | mixin | `pulse($duration: 1s, $iteration: infinite)` | Usage: @include pulse(1.5s, infinite); | `foundation/core/engine/animations.scss` |
14
- | mixin | `rotate($degrees: 360deg, $duration: 1s, $timing: linear, $iteration: 1)` | Usage: @include rotate(360deg, 2s, linear, infinite); | `foundation/core/engine/animations.scss` |
15
- | mixin | `button-base-reset()` | | `foundation/core/engine/buttons.scss` |
16
- | mixin | `button-structure()` | | `foundation/core/engine/buttons.scss` |
17
- | mixin | `button-apply-variant($variant: "primary")` | Uses direct map access instead of a getter function | `foundation/core/engine/buttons.scss` |
18
- | mixin | `btn-primary()` | | `foundation/core/engine/buttons.scss` |
19
- | mixin | `btn-secondary()` | | `foundation/core/engine/buttons.scss` |
20
- | mixin | `btn-tertiary()` | | `foundation/core/engine/buttons.scss` |
21
- | mixin | `btn-icon-only()` | | `foundation/core/engine/buttons.scss` |
22
- | mixin | `btn-variant($variant: "primary")` | | `foundation/core/engine/buttons.scss` |
23
- | mixin | `btn-size($size: "md")` | | `foundation/core/engine/buttons.scss` |
24
- | function | `color($name, $alpha: 1)` | Retrieve any color from the design palette with optional alpha | `foundation/core/engine/color-api.scss` |
25
- | function | `map-get-safe($map, $key)` | Extracts values from the provided map structure with type validation and unquoted key normalization | `foundation/core/engine/helpers.scss` |
26
- | mixin | `border-radius($type)` | Applies dynamically-scaled responsive rounded corners based on predefined maps | `foundation/core/engine/layout.scss` |
27
- | mixin | `border-line($type)` | Configures responsive border thickness and strokes across viewport ranges | `foundation/core/engine/layout.scss` |
28
- | mixin | `box-size($type)` | Mixin for icon sizes through devices — always clamp() | `foundation/core/engine/layout.scss` |
29
- | mixin | `padding($size, $direction: null)` | Mixin for padding with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
30
- | mixin | `margin($size, $direction: null)` | Mixin for margin with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
31
- | mixin | `gap($size, $direction: null)` | Mixin for gap with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
32
- | mixin | `not-first-child()` | | `foundation/core/engine/layout.scss` |
33
- | mixin | `not-last-child()` | | `foundation/core/engine/layout.scss` |
34
- | mixin | `horizontal-scroll()` | | `foundation/core/engine/layout.scss` |
35
- | mixin | `no-horizontal-scroll()` | | `foundation/core/engine/layout.scss` |
36
- | function | `bp($key)` | | `foundation/core/engine/responsive.scss` |
37
- | mixin | `screen-above($breakpoint)` | | `foundation/core/engine/responsive.scss` |
38
- | mixin | `screen-below($breakpoint)` | | `foundation/core/engine/responsive.scss` |
39
- | mixin | `screen-between($lower, $upper)` | | `foundation/core/engine/responsive.scss` |
40
- | mixin | `suppress-on($scope)` | Scopes: 'handheld', 'mobile', 'tablet', 'desktop' (all singular). | `foundation/core/engine/responsive.scss` |
41
- | mixin | `apply-shadow($size: "md")` | Usage: @include apply-shadow("md"); | `foundation/core/engine/shadows.scss` |
42
- | mixin | `elevation($level: 1)` | Usage: @include elevation(2); // Applies shadow-md | `foundation/core/engine/shadows.scss` |
43
- | mixin | `hover-shadow($default: "md", $hover: "lg")` | Usage: @include hover-shadow("sm", "lg"); | `foundation/core/engine/shadows.scss` |
44
- | mixin | `focus-shadow($shadow: "outline")` | Usage: @include focus-shadow("outline"); | `foundation/core/engine/shadows.scss` |
45
- | mixin | `interactive-shadow($default: "md", $hover: "lg", $focus: "outline")` | Usage: @include interactive-shadow("md", "lg", "outline"); | `foundation/core/engine/shadows.scss` |
46
- | mixin | `card-shadow()` | Usage: @include card-shadow(); | `foundation/core/engine/shadows.scss` |
47
- | mixin | `semantic-shadow($type: "primary")` | Usage: @include semantic-shadow("primary"); | `foundation/core/engine/shadows.scss` |
48
- | mixin | `glow-effect($color: rgba(59, 130, 246, 0.5), $blur: 20px)` | Usage: @include glow-effect("primary", 0.5); | `foundation/core/engine/shadows.scss` |
49
- | mixin | `inner-shadow($size: "inner")` | Usage: @include inner-shadow(); | `foundation/core/engine/shadows.scss` |
50
- | mixin | `layered-shadow($shadow1, $shadow2)` | Usage: @include layered-shadow("md", "primary"); | `foundation/core/engine/shadows.scss` |
51
- | mixin | `conditional-shadow($state: "hover", $shadow: "md")` | Usage: @include conditional-shadow("hover", "lg"); | `foundation/core/engine/shadows.scss` |
52
- | mixin | `no-shadow()` | Usage: @include no-shadow(); | `foundation/core/engine/shadows.scss` |
53
- | mixin | `p($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
54
- | mixin | `m($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
55
- | mixin | `g($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
56
- | mixin | `r($type)` | | `foundation/core/engine/shortcuts.scss` |
57
- | mixin | `t($type)` | | `foundation/core/engine/shortcuts.scss` |
58
- | mixin | `sz($type)` | | `foundation/core/engine/shortcuts.scss` |
59
- | function | `useclamp-sizing($min, $max, $c-floor: map.get($container-bounds, "floor"), $c-ceil: map.get($container-bounds, "ceil"), $precision: 3)` | | `foundation/core/engine/sizing.scss` |
60
- | mixin | `zeus-theme($name, $config)` | | `foundation/core/engine/theme-builder.scss` |
61
- | mixin | `text($type)` | The var is already generated by root-generator.scss. | `foundation/core/engine/typographics.scss` |
62
- | function | `useclamp-typography($typeface, $precision: 3)` | | `foundation/core/engine/typography-calc.scss` |
63
-
64
- ## Utility Class Families
65
-
66
- | Class pattern | Generator mixin | File |
67
- |---|---|---|
68
- | `.flex` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
69
- | `.flex-row` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
70
- | `.flex-wrap` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
71
- | `.flex-column` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
72
- | `.flex-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
73
- | `.flex-space-between` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
74
- | `.d-none` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
75
- | `.d-block` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
76
- | `.d-inline-block` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
77
- | `.align-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
78
- | `.align-start` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
79
- | `.align-end` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
80
- | `.justify-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
81
- | `.justify-start` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
82
- | `.justify-end` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
83
- | `.justify-between` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
84
- | `.justify-around` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
85
- | `.d-grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
86
- | `.d-inline-grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
87
- | `.grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
88
- | `.col-span-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
89
- | `.col-span-full` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
90
- | `.col-start-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
91
- | `.col-end-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
92
- | `.grid-cards` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
93
- | `.grid-sidebar` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
94
- | `.grid-split` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
95
- | `.grid-thirds` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
96
- | `.animate-fade-in` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
97
- | `.animate-fade-in-slow` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
98
- | `.animate-fade-in-fast` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
99
- | `.animate-slide-up` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
100
- | `.animate-slide-down` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
101
- | `.animate-slide-left` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
102
- | `.animate-slide-right` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
103
- | `.animate-bounce` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
104
- | `.animate-pulse` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
105
- | `.animate-rotate` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
106
- | `.delay-100` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
107
- | `.delay-200` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
108
- | `.delay-300` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
109
- | `.delay-500` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
110
- | `.delay-700` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
111
- | `.delay-1000` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
112
- | `.duration-150` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
113
- | `.duration-300` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
114
- | `.duration-500` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
115
- | `.duration-700` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
116
- | `.duration-1000` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
117
- | `.aspect-auto` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
118
- | `.aspect-1-1` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
119
- | `.aspect-4-3` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
120
- | `.aspect-3-2` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
121
- | `.aspect-16-9` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
122
- | `.aspect-21-9` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
123
- | `.aspect-3-4` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
124
- | `.aspect-9-16` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
125
- | `.border-radius-{n}` | `load-borders()` | `foundation/views/render/classes/_borders.scss` |
126
- | `.border-line-{n}` | `load-borders()` | `foundation/views/render/classes/_borders.scss` |
127
- | `.btn-{n}` | `load-buttons()` | `foundation/views/render/classes/_buttons.scss` |
128
- | `.bg-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
129
- | `.color-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
130
- | `.border-color-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
131
- | `.bg-transparent` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
132
- | `.color-inherit` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
133
- | `.color-current` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
134
- | `.border-color-transparent` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
135
- | `.border-color-currentColor` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
136
- | `.surface` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
137
- | `.surface-flat` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
138
- | `.section-wrap` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
139
- | `.section-wrap-narrow` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
140
- | `.glass` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
141
- | `.divider` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
142
- | `.sr-only` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
143
- | `.truncate` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
144
- | `.line-clamp-2` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
145
- | `.line-clamp-3` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
146
- | `.container` | `load-containers()` | `foundation/views/render/classes/_containers.scss` |
147
- | `.opacity-{n}` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
148
- | `.overflow-auto` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
149
- | `.overflow-hidden` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
150
- | `.overflow-scroll` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
151
- | `.overflow-visible` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
152
- | `.overflow-y-auto` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
153
- | `.overflow-y-hidden` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
154
- | `.overflow-y-scroll` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
155
- | `.object-cover` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
156
- | `.object-contain` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
157
- | `.object-fill` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
158
- | `.object-center` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
159
- | `.flex-grow-0` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
160
- | `.flex-grow-1` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
161
- | `.flex-shrink-0` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
162
- | `.flex-shrink-1` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
163
- | `.order-first` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
164
- | `.order-last` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
165
- | `.order-none` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
166
- | `.order-{n}` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
167
- | `.static` | `load-position()` | `foundation/views/render/classes/_position.scss` |
168
- | `.relative` | `load-position()` | `foundation/views/render/classes/_position.scss` |
169
- | `.absolute` | `load-position()` | `foundation/views/render/classes/_position.scss` |
170
- | `.fixed` | `load-position()` | `foundation/views/render/classes/_position.scss` |
171
- | `.sticky` | `load-position()` | `foundation/views/render/classes/_position.scss` |
172
- | `.inset-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
173
- | `.inset-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
174
- | `.top-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
175
- | `.bottom-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
176
- | `.inset-inline-start-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
177
- | `.inset-inline-end-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
178
- | `.top-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
179
- | `.bottom-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
180
- | `.inset-inline-start-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
181
- | `.inset-inline-end-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
182
- | `.section-{n}` | `load-sections()` | `foundation/views/render/classes/_sections.scss` |
183
- | `.section-full` | `load-sections()` | `foundation/views/render/classes/_sections.scss` |
184
- | `.shadow-none` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
185
- | `.shadow-xs` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
186
- | `.shadow-sm` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
187
- | `.shadow-md` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
188
- | `.shadow-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
189
- | `.shadow-xl` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
190
- | `.shadow-2xl` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
191
- | `.shadow-primary` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
192
- | `.shadow-secondary` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
193
- | `.shadow-success` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
194
- | `.shadow-warning` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
195
- | `.shadow-danger` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
196
- | `.shadow-info` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
197
- | `.shadow-inner` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
198
- | `.shadow-inner-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
199
- | `.shadow-glow` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
200
- | `.shadow-glow-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
201
- | `.shadow-outline` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
202
- | `.shadow-card` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
203
- | `.shadow-card-hover` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
204
- | `.shadow-dropdown` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
205
- | `.shadow-modal` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
206
- | `.shadow-transition` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
207
- | `.shadow-transition-fast` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
208
- | `.shadow-transition-slow` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
209
- | `.box-{n}` | `load-sizes()` | `foundation/views/render/classes/_sizes.scss` |
210
- | `.icon-{n}` | `load-sizes()` | `foundation/views/render/classes/_sizes.scss` |
211
- | `.w-auto` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
212
- | `.w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
213
- | `.w-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
214
- | `.w-fit` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
215
- | `.w-min` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
216
- | `.w-max` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
217
- | `.w-1\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
218
- | `.w-2\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
219
- | `.w-3\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
220
- | `.min-w-0` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
221
- | `.min-w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
222
- | `.max-w-none` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
223
- | `.max-w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
224
- | `.h-auto` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
225
- | `.h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
226
- | `.h-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
227
- | `.h-fit` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
228
- | `.h-min` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
229
- | `.h-max` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
230
- | `.min-h-0` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
231
- | `.min-h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
232
- | `.min-h-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
233
- | `.max-h-none` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
234
- | `.max-h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
235
- | `.gap-{n}` | `load-spacing()` | `foundation/views/render/classes/_spacing.scss` |
236
- | `.text-{n}` | `load-typography()` | `foundation/views/render/classes/_typography.scss` |
237
- | `.w-unset` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
238
- | `.h-unset` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
239
- | `.no-overflow-x` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
240
- | `.highlight` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
241
- | `.article` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
242
- | `.hidden-desktops` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
243
- | `.hidden-tablets` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
244
- | `.hidden-tablets-desktops` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
245
- | `.hidden-mobiles` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
246
- | `.hidden-devices` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
247
- | `.hidden-upto-ml` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
248
- | `.hidden-from-ml` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
249
- | `.layer-{n}` | `load-z-index()` | `foundation/views/render/classes/_z-index.scss` |
1
+ # Zeus CSS Cheatsheet
2
+
3
+ > Auto-generated from source — do not hand-edit. Regenerate with `npm run gen:cheatsheet`.
4
+
5
+ ## Mixins & Functions
6
+
7
+ | Kind | Signature | Description | File |
8
+ |---|---|---|---|
9
+ | mixin | `fade-in($duration: 0.3s, $delay: 0s, $timing: ease-in-out)` | Usage: @include fade-in(0.5s, 0.2s); | `foundation/core/engine/animations.scss` |
10
+ | mixin | `slide-in($direction: bottom, $duration: 0.3s, $delay: 0s, $timing: ease-out)` | Usage: @include slide-in(left, 0.4s); | `foundation/core/engine/animations.scss` |
11
+ | mixin | `scale($scale: 1.05, $duration: 0.3s, $timing: ease-in-out)` | Usage: @include scale(1.1, 0.3s); | `foundation/core/engine/animations.scss` |
12
+ | mixin | `bounce($duration: 0.8s, $iteration: 1, $delay: 0s)` | Usage: @include bounce(0.6s, infinite); | `foundation/core/engine/animations.scss` |
13
+ | mixin | `pulse($duration: 1s, $iteration: infinite)` | Usage: @include pulse(1.5s, infinite); | `foundation/core/engine/animations.scss` |
14
+ | mixin | `rotate($degrees: 360deg, $duration: 1s, $timing: linear, $iteration: 1)` | Usage: @include rotate(360deg, 2s, linear, infinite); | `foundation/core/engine/animations.scss` |
15
+ | mixin | `button-base-reset()` | | `foundation/core/engine/buttons.scss` |
16
+ | mixin | `button-structure()` | | `foundation/core/engine/buttons.scss` |
17
+ | mixin | `button-apply-variant($variant: "primary")` | Uses direct map access instead of a getter function | `foundation/core/engine/buttons.scss` |
18
+ | mixin | `btn-primary()` | | `foundation/core/engine/buttons.scss` |
19
+ | mixin | `btn-secondary()` | | `foundation/core/engine/buttons.scss` |
20
+ | mixin | `btn-tertiary()` | | `foundation/core/engine/buttons.scss` |
21
+ | mixin | `btn-icon-only()` | | `foundation/core/engine/buttons.scss` |
22
+ | mixin | `btn-variant($variant: "primary")` | | `foundation/core/engine/buttons.scss` |
23
+ | mixin | `btn-size($size: "md")` | | `foundation/core/engine/buttons.scss` |
24
+ | function | `color($name, $alpha: 1)` | Retrieve any color from the design palette with optional alpha | `foundation/core/engine/color-api.scss` |
25
+ | function | `map-get-safe($map, $key)` | Extracts values from the provided map structure with type validation and unquoted key normalization | `foundation/core/engine/helpers.scss` |
26
+ | mixin | `border-radius($type)` | Applies dynamically-scaled responsive rounded corners based on predefined maps | `foundation/core/engine/layout.scss` |
27
+ | mixin | `border-line($type)` | Configures responsive border thickness and strokes across viewport ranges | `foundation/core/engine/layout.scss` |
28
+ | mixin | `box-size($type)` | Mixin for icon sizes through devices — always clamp() | `foundation/core/engine/layout.scss` |
29
+ | mixin | `padding($size, $direction: null)` | Mixin for padding with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
30
+ | mixin | `margin($size, $direction: null)` | Mixin for margin with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
31
+ | mixin | `gap($size, $direction: null)` | Mixin for gap with optional direction — references --space-* :root token | `foundation/core/engine/layout.scss` |
32
+ | mixin | `not-first-child()` | | `foundation/core/engine/layout.scss` |
33
+ | mixin | `not-last-child()` | | `foundation/core/engine/layout.scss` |
34
+ | mixin | `horizontal-scroll()` | | `foundation/core/engine/layout.scss` |
35
+ | mixin | `no-horizontal-scroll()` | | `foundation/core/engine/layout.scss` |
36
+ | function | `bp($key)` | | `foundation/core/engine/responsive.scss` |
37
+ | mixin | `screen-above($breakpoint)` | | `foundation/core/engine/responsive.scss` |
38
+ | mixin | `screen-below($breakpoint)` | | `foundation/core/engine/responsive.scss` |
39
+ | mixin | `screen-between($lower, $upper)` | | `foundation/core/engine/responsive.scss` |
40
+ | mixin | `suppress-on($scope)` | Scopes: 'handheld', 'mobile', 'tablet', 'desktop' (all singular). | `foundation/core/engine/responsive.scss` |
41
+ | mixin | `apply-shadow($size: "md")` | Usage: @include apply-shadow("md"); | `foundation/core/engine/shadows.scss` |
42
+ | mixin | `elevation($level: 1)` | Usage: @include elevation(2); // Applies shadow-md | `foundation/core/engine/shadows.scss` |
43
+ | mixin | `hover-shadow($default: "md", $hover: "lg")` | Usage: @include hover-shadow("sm", "lg"); | `foundation/core/engine/shadows.scss` |
44
+ | mixin | `focus-shadow($shadow: "outline")` | Usage: @include focus-shadow("outline"); | `foundation/core/engine/shadows.scss` |
45
+ | mixin | `interactive-shadow($default: "md", $hover: "lg", $focus: "outline")` | Usage: @include interactive-shadow("md", "lg", "outline"); | `foundation/core/engine/shadows.scss` |
46
+ | mixin | `card-shadow()` | Usage: @include card-shadow(); | `foundation/core/engine/shadows.scss` |
47
+ | mixin | `semantic-shadow($type: "primary")` | Usage: @include semantic-shadow("primary"); | `foundation/core/engine/shadows.scss` |
48
+ | mixin | `glow-effect($color: rgba(59, 130, 246, 0.5), $blur: 20px)` | Usage: @include glow-effect("primary", 0.5); | `foundation/core/engine/shadows.scss` |
49
+ | mixin | `inner-shadow($size: "inner")` | Usage: @include inner-shadow(); | `foundation/core/engine/shadows.scss` |
50
+ | mixin | `layered-shadow($shadow1, $shadow2)` | Usage: @include layered-shadow("md", "primary"); | `foundation/core/engine/shadows.scss` |
51
+ | mixin | `conditional-shadow($state: "hover", $shadow: "md")` | Usage: @include conditional-shadow("hover", "lg"); | `foundation/core/engine/shadows.scss` |
52
+ | mixin | `no-shadow()` | Usage: @include no-shadow(); | `foundation/core/engine/shadows.scss` |
53
+ | mixin | `p($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
54
+ | mixin | `m($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
55
+ | mixin | `g($size, $dir: null)` | | `foundation/core/engine/shortcuts.scss` |
56
+ | mixin | `r($type)` | | `foundation/core/engine/shortcuts.scss` |
57
+ | mixin | `t($type)` | | `foundation/core/engine/shortcuts.scss` |
58
+ | mixin | `sz($type)` | | `foundation/core/engine/shortcuts.scss` |
59
+ | function | `useclamp-sizing($min, $max, $c-floor: map.get($container-bounds, "floor"), $c-ceil: map.get($container-bounds, "ceil"), $precision: 1)` | | `foundation/core/engine/sizing.scss` |
60
+ | mixin | `zeus-theme($name, $config)` | | `foundation/core/engine/theme-builder.scss` |
61
+ | mixin | `text($type)` | The var is already generated by root-generator.scss. | `foundation/core/engine/typographics.scss` |
62
+ | function | `useclamp-typography($typeface, $precision: 1)` | | `foundation/core/engine/typography-calc.scss` |
63
+
64
+ ## Utility Class Families
65
+
66
+ | Class pattern | Generator mixin | File |
67
+ |---|---|---|
68
+ | `.flex` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
69
+ | `.flex-row` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
70
+ | `.flex-wrap` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
71
+ | `.flex-column` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
72
+ | `.flex-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
73
+ | `.flex-space-between` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
74
+ | `.d-none` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
75
+ | `.d-block` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
76
+ | `.d-inline-block` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
77
+ | `.align-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
78
+ | `.align-start` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
79
+ | `.align-end` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
80
+ | `.justify-center` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
81
+ | `.justify-start` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
82
+ | `.justify-end` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
83
+ | `.justify-between` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
84
+ | `.justify-around` | `load-flexbox()` | `foundation/views/render/classes/flexbox.scss` |
85
+ | `.d-grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
86
+ | `.d-inline-grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
87
+ | `.grid` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
88
+ | `.col-span-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
89
+ | `.col-span-full` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
90
+ | `.col-start-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
91
+ | `.col-end-{n}` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
92
+ | `.grid-cards` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
93
+ | `.grid-sidebar` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
94
+ | `.grid-split` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
95
+ | `.grid-thirds` | `load-grid()` | `foundation/views/render/classes/grid.scss` |
96
+ | `.animate-fade-in` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
97
+ | `.animate-fade-in-slow` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
98
+ | `.animate-fade-in-fast` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
99
+ | `.animate-slide-up` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
100
+ | `.animate-slide-down` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
101
+ | `.animate-slide-left` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
102
+ | `.animate-slide-right` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
103
+ | `.animate-bounce` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
104
+ | `.animate-pulse` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
105
+ | `.animate-rotate` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
106
+ | `.delay-100` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
107
+ | `.delay-200` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
108
+ | `.delay-300` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
109
+ | `.delay-500` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
110
+ | `.delay-700` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
111
+ | `.delay-1000` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
112
+ | `.duration-150` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
113
+ | `.duration-300` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
114
+ | `.duration-500` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
115
+ | `.duration-700` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
116
+ | `.duration-1000` | `load-animations()` | `foundation/views/render/classes/_animations.scss` |
117
+ | `.aspect-auto` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
118
+ | `.aspect-1-1` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
119
+ | `.aspect-4-3` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
120
+ | `.aspect-3-2` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
121
+ | `.aspect-16-9` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
122
+ | `.aspect-21-9` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
123
+ | `.aspect-3-4` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
124
+ | `.aspect-9-16` | `load-aspect-ratio()` | `foundation/views/render/classes/_aspect-ratio.scss` |
125
+ | `.border-radius-{n}` | `load-borders()` | `foundation/views/render/classes/_borders.scss` |
126
+ | `.border-line-{n}` | `load-borders()` | `foundation/views/render/classes/_borders.scss` |
127
+ | `.btn-{n}` | `load-buttons()` | `foundation/views/render/classes/_buttons.scss` |
128
+ | `.bg-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
129
+ | `.color-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
130
+ | `.border-color-{n}` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
131
+ | `.bg-transparent` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
132
+ | `.color-inherit` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
133
+ | `.color-current` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
134
+ | `.border-color-transparent` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
135
+ | `.border-color-currentColor` | `load-colors()` | `foundation/views/render/classes/_colors.scss` |
136
+ | `.surface` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
137
+ | `.surface-flat` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
138
+ | `.section-wrap` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
139
+ | `.section-wrap-narrow` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
140
+ | `.glass` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
141
+ | `.divider` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
142
+ | `.sr-only` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
143
+ | `.truncate` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
144
+ | `.line-clamp-2` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
145
+ | `.line-clamp-3` | `load-compounds()` | `foundation/views/render/classes/_compounds.scss` |
146
+ | `.container` | `load-containers()` | `foundation/views/render/classes/_containers.scss` |
147
+ | `.opacity-{n}` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
148
+ | `.overflow-auto` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
149
+ | `.overflow-hidden` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
150
+ | `.overflow-scroll` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
151
+ | `.overflow-visible` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
152
+ | `.overflow-y-auto` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
153
+ | `.overflow-y-hidden` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
154
+ | `.overflow-y-scroll` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
155
+ | `.object-cover` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
156
+ | `.object-contain` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
157
+ | `.object-fill` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
158
+ | `.object-center` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
159
+ | `.flex-grow-0` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
160
+ | `.flex-grow-1` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
161
+ | `.flex-shrink-0` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
162
+ | `.flex-shrink-1` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
163
+ | `.order-first` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
164
+ | `.order-last` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
165
+ | `.order-none` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
166
+ | `.order-{n}` | `load-misc-utils()` | `foundation/views/render/classes/_misc-utils.scss` |
167
+ | `.static` | `load-position()` | `foundation/views/render/classes/_position.scss` |
168
+ | `.relative` | `load-position()` | `foundation/views/render/classes/_position.scss` |
169
+ | `.absolute` | `load-position()` | `foundation/views/render/classes/_position.scss` |
170
+ | `.fixed` | `load-position()` | `foundation/views/render/classes/_position.scss` |
171
+ | `.sticky` | `load-position()` | `foundation/views/render/classes/_position.scss` |
172
+ | `.inset-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
173
+ | `.inset-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
174
+ | `.top-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
175
+ | `.bottom-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
176
+ | `.inset-inline-start-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
177
+ | `.inset-inline-end-{n}` | `load-position()` | `foundation/views/render/classes/_position.scss` |
178
+ | `.top-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
179
+ | `.bottom-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
180
+ | `.inset-inline-start-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
181
+ | `.inset-inline-end-auto` | `load-position()` | `foundation/views/render/classes/_position.scss` |
182
+ | `.section-{n}` | `load-sections()` | `foundation/views/render/classes/_sections.scss` |
183
+ | `.section-full` | `load-sections()` | `foundation/views/render/classes/_sections.scss` |
184
+ | `.shadow-none` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
185
+ | `.shadow-xs` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
186
+ | `.shadow-sm` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
187
+ | `.shadow-md` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
188
+ | `.shadow-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
189
+ | `.shadow-xl` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
190
+ | `.shadow-2xl` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
191
+ | `.shadow-primary` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
192
+ | `.shadow-secondary` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
193
+ | `.shadow-success` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
194
+ | `.shadow-warning` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
195
+ | `.shadow-danger` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
196
+ | `.shadow-info` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
197
+ | `.shadow-inner` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
198
+ | `.shadow-inner-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
199
+ | `.shadow-glow` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
200
+ | `.shadow-glow-lg` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
201
+ | `.shadow-outline` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
202
+ | `.shadow-card` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
203
+ | `.shadow-card-hover` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
204
+ | `.shadow-dropdown` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
205
+ | `.shadow-modal` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
206
+ | `.shadow-transition` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
207
+ | `.shadow-transition-fast` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
208
+ | `.shadow-transition-slow` | `load-shadows()` | `foundation/views/render/classes/_shadows.scss` |
209
+ | `.box-{n}` | `load-sizes()` | `foundation/views/render/classes/_sizes.scss` |
210
+ | `.icon-{n}` | `load-sizes()` | `foundation/views/render/classes/_sizes.scss` |
211
+ | `.w-auto` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
212
+ | `.w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
213
+ | `.w-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
214
+ | `.w-fit` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
215
+ | `.w-min` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
216
+ | `.w-max` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
217
+ | `.w-1\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
218
+ | `.w-2\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
219
+ | `.w-3\` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
220
+ | `.min-w-0` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
221
+ | `.min-w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
222
+ | `.max-w-none` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
223
+ | `.max-w-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
224
+ | `.h-auto` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
225
+ | `.h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
226
+ | `.h-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
227
+ | `.h-fit` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
228
+ | `.h-min` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
229
+ | `.h-max` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
230
+ | `.min-h-0` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
231
+ | `.min-h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
232
+ | `.min-h-screen` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
233
+ | `.max-h-none` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
234
+ | `.max-h-full` | `load-sizing-utils()` | `foundation/views/render/classes/_sizing-utils.scss` |
235
+ | `.gap-{n}` | `load-spacing()` | `foundation/views/render/classes/_spacing.scss` |
236
+ | `.text-{n}` | `load-typography()` | `foundation/views/render/classes/_typography.scss` |
237
+ | `.w-unset` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
238
+ | `.h-unset` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
239
+ | `.no-overflow-x` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
240
+ | `.highlight` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
241
+ | `.article` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
242
+ | `.hidden-desktops` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
243
+ | `.hidden-tablets` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
244
+ | `.hidden-tablets-desktops` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
245
+ | `.hidden-mobiles` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
246
+ | `.hidden-devices` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
247
+ | `.hidden-upto-ml` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
248
+ | `.hidden-from-ml` | `load-utilities()` | `foundation/views/render/classes/_utilities.scss` |
249
+ | `.layer-{n}` | `load-z-index()` | `foundation/views/render/classes/_z-index.scss` |