@dixy-ui/themes 0.0.0-stage → 0.1.0-beta.1

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 (211) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +139 -2
  3. package/dist/ansi/ornament.d.ts +3 -0
  4. package/dist/ansi/ornament.js +8 -0
  5. package/dist/ansi-panes.css +929 -0
  6. package/dist/art-deco.css +850 -0
  7. package/dist/atelier/ornament.d.ts +4 -0
  8. package/dist/atelier/ornament.js +9 -0
  9. package/dist/atomic/ornament.d.ts +3 -0
  10. package/dist/atomic/ornament.js +8 -0
  11. package/dist/atomic-lounge.css +946 -0
  12. package/dist/authoring.d.ts +142 -0
  13. package/dist/authoring.js +83 -0
  14. package/dist/azulejo/ornament.d.ts +3 -0
  15. package/dist/azulejo/ornament.js +8 -0
  16. package/dist/azulejo-tile.css +962 -0
  17. package/dist/blueprint/ornament.d.ts +3 -0
  18. package/dist/blueprint/ornament.js +8 -0
  19. package/dist/blueprint.css +897 -0
  20. package/dist/brutalist/ornament.d.ts +3 -0
  21. package/dist/brutalist/ornament.js +8 -0
  22. package/dist/brutalist-concrete.css +936 -0
  23. package/dist/bytes.json +162 -0
  24. package/dist/candy-clay.css +778 -0
  25. package/dist/catalog.d.ts +1346 -0
  26. package/dist/catalog.js +1379 -0
  27. package/dist/character.d.ts +103 -0
  28. package/dist/character.js +477 -0
  29. package/dist/chrome.d.ts +114 -0
  30. package/dist/chrome.js +247 -0
  31. package/dist/clay/ornament.d.ts +3 -0
  32. package/dist/clay/ornament.js +8 -0
  33. package/dist/compile-css.d.ts +3 -0
  34. package/dist/compile-css.js +133 -0
  35. package/dist/deco/ornament.d.ts +3 -0
  36. package/dist/deco/ornament.js +8 -0
  37. package/dist/diwali/ornament.d.ts +3 -0
  38. package/dist/diwali/ornament.js +8 -0
  39. package/dist/diwali-lights.css +894 -0
  40. package/dist/documents.d.ts +104 -0
  41. package/dist/documents.js +1411 -0
  42. package/dist/forest/ornament.d.ts +3 -0
  43. package/dist/forest/ornament.js +12 -0
  44. package/dist/foundations.d.ts +105 -0
  45. package/dist/foundations.js +140 -0
  46. package/dist/frame-corners.d.ts +5 -0
  47. package/dist/frame-corners.js +5 -0
  48. package/dist/frame-styles.d.ts +36 -0
  49. package/dist/frame-styles.js +146 -0
  50. package/dist/freeze.d.ts +2 -0
  51. package/dist/freeze.js +9 -0
  52. package/dist/freighter/ornament.d.ts +3 -0
  53. package/dist/freighter/ornament.js +8 -0
  54. package/dist/freighter.css +942 -0
  55. package/dist/glass/ornament.d.ts +3 -0
  56. package/dist/glass/ornament.js +8 -0
  57. package/dist/glass-ui.css +923 -0
  58. package/dist/hardware/ornament.d.ts +4 -0
  59. package/dist/hardware/ornament.js +10 -0
  60. package/dist/holi/ornament.d.ts +3 -0
  61. package/dist/holi/ornament.js +8 -0
  62. package/dist/holi-colours.css +887 -0
  63. package/dist/hud/ornament.d.ts +3 -0
  64. package/dist/hud/ornament.js +8 -0
  65. package/dist/light/ornament.d.ts +3 -0
  66. package/dist/light/ornament.js +10 -0
  67. package/dist/living-forest.css +917 -0
  68. package/dist/lunar/ornament.d.ts +3 -0
  69. package/dist/lunar/ornament.js +8 -0
  70. package/dist/lunar-new-year.css +811 -0
  71. package/dist/manifests.d.ts +2485 -0
  72. package/dist/manifests.js +264 -0
  73. package/dist/material-light.css +880 -0
  74. package/dist/neon/ornament.d.ts +3 -0
  75. package/dist/neon/ornament.js +8 -0
  76. package/dist/neon-night-market.css +944 -0
  77. package/dist/ocean/ornament.d.ts +3 -0
  78. package/dist/ocean/ornament.js +8 -0
  79. package/dist/ocean-depths.css +825 -0
  80. package/dist/orbital-hud.css +973 -0
  81. package/dist/organic-css.d.ts +3 -0
  82. package/dist/organic-css.js +23 -0
  83. package/dist/organic-geometry.d.ts +20 -0
  84. package/dist/organic-geometry.js +74 -0
  85. package/dist/organic-ornament.d.ts +9 -0
  86. package/dist/organic-ornament.js +28 -0
  87. package/dist/organic-paint-launch.d.ts +43 -0
  88. package/dist/organic-paint-launch.js +1156 -0
  89. package/dist/organic-paint-world.d.ts +24 -0
  90. package/dist/organic-paint-world.js +676 -0
  91. package/dist/organic-paint.d.ts +50 -0
  92. package/dist/organic-paint.js +695 -0
  93. package/dist/organic-runtime.d.ts +4 -0
  94. package/dist/organic-runtime.js +231 -0
  95. package/dist/organic-settings.d.ts +680 -0
  96. package/dist/organic-settings.js +433 -0
  97. package/dist/ornament-parts.d.ts +20 -0
  98. package/dist/ornament-parts.js +15 -0
  99. package/dist/papel-picado.css +904 -0
  100. package/dist/phosphor/ornament.d.ts +3 -0
  101. package/dist/phosphor/ornament.js +8 -0
  102. package/dist/phosphor-terminal.css +1011 -0
  103. package/dist/picado/ornament.d.ts +3 -0
  104. package/dist/picado/ornament.js +8 -0
  105. package/dist/prism/ornament.d.ts +4 -0
  106. package/dist/prism/ornament.js +9 -0
  107. package/dist/prism-glass.css +970 -0
  108. package/dist/recipes.d.ts +938 -0
  109. package/dist/recipes.js +939 -0
  110. package/dist/resolve.d.ts +40 -0
  111. package/dist/resolve.js +24 -0
  112. package/dist/retro/ornament.d.ts +5 -0
  113. package/dist/retro/ornament.js +10 -0
  114. package/dist/retro-os.css +867 -0
  115. package/dist/riso/ornament.d.ts +3 -0
  116. package/dist/riso/ornament.js +8 -0
  117. package/dist/riso-zine.css +786 -0
  118. package/dist/sail/ornament.d.ts +3 -0
  119. package/dist/sail/ornament.js +8 -0
  120. package/dist/scrapbook.css +685 -0
  121. package/dist/signal/ornament.d.ts +4 -0
  122. package/dist/signal/ornament.js +11 -0
  123. package/dist/skins/ansi-panes.d.ts +68 -0
  124. package/dist/skins/ansi-panes.js +68 -0
  125. package/dist/skins/art-deco.d.ts +68 -0
  126. package/dist/skins/art-deco.js +68 -0
  127. package/dist/skins/atomic-lounge.d.ts +68 -0
  128. package/dist/skins/atomic-lounge.js +68 -0
  129. package/dist/skins/azulejo-tile.d.ts +68 -0
  130. package/dist/skins/azulejo-tile.js +68 -0
  131. package/dist/skins/blueprint.d.ts +68 -0
  132. package/dist/skins/blueprint.js +68 -0
  133. package/dist/skins/brutalist-concrete.d.ts +68 -0
  134. package/dist/skins/brutalist-concrete.js +68 -0
  135. package/dist/skins/candy-clay.d.ts +57 -0
  136. package/dist/skins/candy-clay.js +57 -0
  137. package/dist/skins/diwali-lights.d.ts +68 -0
  138. package/dist/skins/diwali-lights.js +68 -0
  139. package/dist/skins/freighter.d.ts +68 -0
  140. package/dist/skins/freighter.js +68 -0
  141. package/dist/skins/glass-ui.d.ts +68 -0
  142. package/dist/skins/glass-ui.js +68 -0
  143. package/dist/skins/holi-colours.d.ts +68 -0
  144. package/dist/skins/holi-colours.js +68 -0
  145. package/dist/skins/living-forest.d.ts +68 -0
  146. package/dist/skins/living-forest.js +68 -0
  147. package/dist/skins/lunar-new-year.d.ts +68 -0
  148. package/dist/skins/lunar-new-year.js +68 -0
  149. package/dist/skins/material-light.d.ts +57 -0
  150. package/dist/skins/material-light.js +57 -0
  151. package/dist/skins/neon-night-market.d.ts +68 -0
  152. package/dist/skins/neon-night-market.js +68 -0
  153. package/dist/skins/ocean-depths.d.ts +57 -0
  154. package/dist/skins/ocean-depths.js +57 -0
  155. package/dist/skins/orbital-hud.d.ts +68 -0
  156. package/dist/skins/orbital-hud.js +68 -0
  157. package/dist/skins/papel-picado.d.ts +68 -0
  158. package/dist/skins/papel-picado.js +68 -0
  159. package/dist/skins/phosphor-terminal.d.ts +68 -0
  160. package/dist/skins/phosphor-terminal.js +68 -0
  161. package/dist/skins/prism-glass.d.ts +57 -0
  162. package/dist/skins/prism-glass.js +57 -0
  163. package/dist/skins/retro-os.d.ts +57 -0
  164. package/dist/skins/retro-os.js +57 -0
  165. package/dist/skins/riso-zine.d.ts +68 -0
  166. package/dist/skins/riso-zine.js +68 -0
  167. package/dist/skins/scrapbook.d.ts +57 -0
  168. package/dist/skins/scrapbook.js +57 -0
  169. package/dist/skins/solar-sail.d.ts +68 -0
  170. package/dist/skins/solar-sail.js +68 -0
  171. package/dist/skins/studio-hardware.d.ts +57 -0
  172. package/dist/skins/studio-hardware.js +57 -0
  173. package/dist/skins/sumi-ink.d.ts +68 -0
  174. package/dist/skins/sumi-ink.js +68 -0
  175. package/dist/skins/swiss-poster.d.ts +68 -0
  176. package/dist/skins/swiss-poster.js +68 -0
  177. package/dist/skins/tactile-atelier.d.ts +57 -0
  178. package/dist/skins/tactile-atelier.js +57 -0
  179. package/dist/skins/tokyo-transit.d.ts +68 -0
  180. package/dist/skins/tokyo-transit.js +68 -0
  181. package/dist/skins/winamp-signal.d.ts +57 -0
  182. package/dist/skins/winamp-signal.js +57 -0
  183. package/dist/skins/y2k-titanium.d.ts +57 -0
  184. package/dist/skins/y2k-titanium.js +57 -0
  185. package/dist/skins/yule-knit.d.ts +68 -0
  186. package/dist/skins/yule-knit.js +68 -0
  187. package/dist/solar-sail.css +901 -0
  188. package/dist/starters-launch.d.ts +361 -0
  189. package/dist/starters-launch.js +808 -0
  190. package/dist/studio-hardware.css +867 -0
  191. package/dist/sumi/ornament.d.ts +3 -0
  192. package/dist/sumi/ornament.js +8 -0
  193. package/dist/sumi-ink.css +733 -0
  194. package/dist/swiss/ornament.d.ts +3 -0
  195. package/dist/swiss/ornament.js +8 -0
  196. package/dist/swiss-poster.css +727 -0
  197. package/dist/tactile-atelier.css +922 -0
  198. package/dist/theme-document.schema.json +790 -0
  199. package/dist/theme-schema.d.ts +453 -0
  200. package/dist/theme-schema.js +416 -0
  201. package/dist/titanium/ornament.d.ts +3 -0
  202. package/dist/titanium/ornament.js +11 -0
  203. package/dist/tokyo-transit.css +756 -0
  204. package/dist/transit/ornament.d.ts +3 -0
  205. package/dist/transit/ornament.js +8 -0
  206. package/dist/winamp-signal.css +1048 -0
  207. package/dist/y2k-titanium.css +979 -0
  208. package/dist/yule/ornament.d.ts +3 -0
  209. package/dist/yule/ornament.js +8 -0
  210. package/dist/yule-knit.css +850 -0
  211. package/package.json +351 -3
@@ -0,0 +1,727 @@
1
+ /* Generated by scripts/generate-skins.mjs. Do not edit. */
2
+
3
+ @layer dixy.tokens, dixy.components;
4
+ @layer dixy.tokens {
5
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] {
6
+ font-family: "Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif;
7
+ --dixy-font-sans:
8
+ "Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif;
9
+ --dixy-font-display:
10
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
11
+ --dixy-skin-cushion-elevation: 0 0 0 transparent;
12
+ --dixy-card-shadow: var(--dixy-shadow-none);
13
+ --dixy-skin-depth-shadow: 0 0 0 transparent;
14
+ --dixy-stroke-width: 2px;
15
+ --dixy-card-border-width: 2px;
16
+ --dixy-button-border-width: 2px;
17
+ --dixy-input-border-width: 2px;
18
+ --dixy-dialog-border-width: 2px;
19
+ --dixy-font-heading-lg-family:
20
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
21
+ --dixy-font-heading-md-family:
22
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
23
+ --dixy-font-heading-sm-family:
24
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
25
+ --dixy-font-title-lg-family:
26
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
27
+ --dixy-font-title-md-family:
28
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
29
+ --dixy-font-title-sm-family:
30
+ "Archivo Black", "Arial Black", ui-sans-serif, sans-serif;
31
+ --dixy-skin-edge: #0d0d0d;
32
+ --dixy-organic-density: 50;
33
+ --dixy-organic-cornerDensity: 80;
34
+ --dixy-organic-canopyDepth: 40;
35
+ --dixy-organic-variation: 20;
36
+ --dixy-organic-scale: 20;
37
+ --dixy-organic-stemWeight: 40;
38
+ --dixy-organic-motion: 0;
39
+ --dixy-organic-seed: 26;
40
+ --dixy-organic-style: 0;
41
+ --dixy-organic-canopy: 0;
42
+ --dixy-organic-stem: 0;
43
+ --dixy-organic-a: #e30613;
44
+ --dixy-organic-b: #0d0d0d;
45
+ --dixy-organic-c: #9a9a9a;
46
+ --dixy-organic-d: #0d0d0d;
47
+
48
+ --dixy-skin-surface: color-mix(
49
+ in srgb,
50
+ var(--dixy-color-background-surface-raised) 10%,
51
+ #ffffff
52
+ );
53
+ --dixy-skin-ground: color-mix(
54
+ in srgb,
55
+ var(--dixy-color-background-canvas) 65%,
56
+ #f2f2f0
57
+ );
58
+ --dixy-skin-card-inset: 34px 28px 28px;
59
+ --dixy-skin-pad-top: 34px;
60
+ --dixy-skin-pad-inline: 28px;
61
+ --dixy-skin-frame-inset: 8px;
62
+ --dixy-skin-frame-width: 2px;
63
+ --dixy-skin-finish:
64
+ linear-gradient(180deg, rgb(255 255 255 / 0), transparent 42%),
65
+ linear-gradient(transparent, transparent);
66
+ --dixy-skin-grain: radial-gradient(
67
+ circle at 1px 1px,
68
+ #00000006 0.5px,
69
+ transparent 1px
70
+ );
71
+ --dixy-skin-grain-size: 4px;
72
+ --dixy-skin-paint: var(--dixy-skin-grain), var(--dixy-skin-finish);
73
+ --dixy-skin-canvas: linear-gradient(
74
+ 90deg,
75
+ transparent calc(33.33% - 0.5px),
76
+ #0000000d 0 calc(33.33% + 0.5px),
77
+ transparent 0 calc(66.66% - 0.5px),
78
+ #0000000d 0 calc(66.66% + 0.5px),
79
+ transparent 0
80
+ );
81
+ --dixy-skin-authored-shadow: none;
82
+ --dixy-skin-shadow: var(
83
+ --dixy-skin-depth-shadow,
84
+ var(--dixy-skin-authored-shadow)
85
+ );
86
+ --dixy-skin-inset: inset 0 -2px 0 currentColor;
87
+ --dixy-skin-control-edge:
88
+ inset 0 1px 0 rgb(255 255 255 / 0.1), inset 0 -1px 0 #0002;
89
+ --dixy-skin-cushion:
90
+ inset 0 0px 0px #ffffff66,
91
+ inset 0 -0px 0px color-mix(in srgb, var(--dixy-skin-edge) 0%, transparent),
92
+ var(--dixy-skin-cushion-elevation);
93
+ --dixy-skin-cushion-cast: 0 0px 0px
94
+ color-mix(in srgb, var(--dixy-skin-edge) 0%, transparent);
95
+ --dixy-skin-panel-relief: var(--dixy-skin-shadow);
96
+ --dixy-skin-control-relief:
97
+ var(--dixy-skin-control-edge), var(--dixy-skin-shadow);
98
+ --dixy-skin-thumb: linear-gradient(135deg, #e30613 0 40%, #ffffff 40%);
99
+ --dixy-skin-mark-opacity: 1;
100
+ --dixy-font-display-lg-weight: 400;
101
+ --dixy-font-display-lg-letter-spacing: -0.03em;
102
+ --dixy-font-display-md-weight: 400;
103
+ --dixy-font-display-md-letter-spacing: -0.03em;
104
+ --dixy-font-display-sm-weight: 400;
105
+ --dixy-font-display-sm-letter-spacing: -0.03em;
106
+ --dixy-font-heading-lg-weight: 400;
107
+ --dixy-font-heading-lg-letter-spacing: -0.03em;
108
+ --dixy-font-heading-md-weight: 400;
109
+ --dixy-font-heading-md-letter-spacing: -0.03em;
110
+ --dixy-font-heading-sm-weight: 400;
111
+ --dixy-font-heading-sm-letter-spacing: -0.03em;
112
+ --dixy-font-title-lg-weight: 400;
113
+ --dixy-font-title-lg-letter-spacing: -0.03em;
114
+ --dixy-font-title-md-weight: 400;
115
+ --dixy-font-title-md-letter-spacing: -0.03em;
116
+ --dixy-font-title-sm-weight: 400;
117
+ --dixy-font-title-sm-letter-spacing: -0.03em;
118
+ }
119
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-appearance="dark"] {
120
+ --dixy-organic-a: #ff2a2a;
121
+ --dixy-organic-b: #f4f4f4;
122
+ --dixy-organic-c: #6a6a6a;
123
+ --dixy-organic-d: #f4f4f4;
124
+ --dixy-skin-selected: var(--dixy-skin-finish);
125
+ --dixy-skin-edge: #f4f4f4;
126
+ --dixy-skin-surface: color-mix(
127
+ in srgb,
128
+ var(--dixy-color-background-surface-raised) 10%,
129
+ #111111
130
+ );
131
+ --dixy-skin-ground: color-mix(
132
+ in srgb,
133
+ var(--dixy-color-background-canvas) 65%,
134
+ #111111
135
+ );
136
+ }
137
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-relief="2"] {
138
+ --dixy-skin-shadow:
139
+ var(--dixy-skin-depth-shadow, var(--dixy-skin-authored-shadow)),
140
+ 0 10px 18px #0002;
141
+ }
142
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-relief="0"],
143
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-effects="reduced"] {
144
+ --dixy-skin-shadow: none;
145
+ --dixy-skin-inset: none;
146
+ --dixy-skin-control-edge: none;
147
+ --dixy-skin-panel-relief: none;
148
+ --dixy-skin-control-relief: none;
149
+ }
150
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-effects="reduced"] {
151
+ --dixy-skin-paint: none;
152
+ --dixy-skin-finish: none;
153
+ --dixy-skin-canvas: none;
154
+ --dixy-skin-thumb: none;
155
+ --dixy-skin-mark-opacity: 0;
156
+ }
157
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-ornament="quiet"] {
158
+ --dixy-skin-mark-opacity: 0;
159
+ }
160
+ }
161
+ @layer dixy.components {
162
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] {
163
+ position: relative;
164
+ isolation: isolate;
165
+ }
166
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]:not(.dixy-portal-scope) {
167
+ background-color: var(--dixy-skin-ground);
168
+ background-image: var(--dixy-skin-canvas);
169
+ }
170
+ :is(
171
+ .dixy-card,
172
+ .dixy-box,
173
+ .dixy-dialog-popup,
174
+ .dixy-alert-dialog-popup,
175
+ .dixy-drawer-popup,
176
+ .dixy-popover-popup,
177
+ .dixy-preview-card-popup,
178
+ .dixy-tooltip-popup,
179
+ .dixy-select-popup,
180
+ .dixy-combobox-popup,
181
+ .dixy-autocomplete-popup,
182
+ .dixy-menu-popup,
183
+ .dixy-context-menu-popup,
184
+ .dixy-navigation-menu-popup,
185
+ .dixy-toast-root,
186
+ .dixy-alert,
187
+ .dixy-list-box,
188
+ .dixy-calendar,
189
+ .dixy-range-calendar
190
+ )[data-dixy-skin="dixy/swiss-poster"] {
191
+ position: relative;
192
+ border-radius: calc(var(--dixy-radius-card) * 1);
193
+ }
194
+ :is(
195
+ .dixy-dialog-popup,
196
+ .dixy-alert-dialog-popup,
197
+ .dixy-drawer-popup,
198
+ .dixy-popover-popup,
199
+ .dixy-preview-card-popup,
200
+ .dixy-tooltip-popup,
201
+ .dixy-select-popup,
202
+ .dixy-combobox-popup,
203
+ .dixy-autocomplete-popup,
204
+ .dixy-menu-popup,
205
+ .dixy-context-menu-popup,
206
+ .dixy-navigation-menu-popup
207
+ )[data-dixy-skin="dixy/swiss-poster"] {
208
+ border-radius: calc(var(--dixy-radius-overlay) * 1);
209
+ }
210
+ :is(.dixy-card, .dixy-dialog-popup)[data-dixy-skin="dixy/swiss-poster"] {
211
+ padding: var(--dixy-skin-card-inset);
212
+ border: 2px solid var(--dixy-skin-edge);
213
+ }
214
+ :is(
215
+ .dixy-card,
216
+ .dixy-box,
217
+ .dixy-dialog-popup,
218
+ .dixy-alert-dialog-popup,
219
+ .dixy-drawer-popup,
220
+ .dixy-popover-popup,
221
+ .dixy-preview-card-popup,
222
+ .dixy-tooltip-popup,
223
+ .dixy-select-popup,
224
+ .dixy-combobox-popup,
225
+ .dixy-autocomplete-popup,
226
+ .dixy-menu-popup,
227
+ .dixy-context-menu-popup,
228
+ .dixy-navigation-menu-popup,
229
+ .dixy-toast-root,
230
+ .dixy-alert,
231
+ .dixy-list-box,
232
+ .dixy-calendar,
233
+ .dixy-range-calendar
234
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
235
+ [data-dixy-material-override]
236
+ ):not(:where([data-dixy-material-override]) *) {
237
+ background-image: var(--dixy-skin-paint);
238
+ background-size:
239
+ var(--dixy-skin-grain-size) var(--dixy-skin-grain-size),
240
+ 100% 100%,
241
+ 100% 100%,
242
+ 100% 100%;
243
+ box-shadow: var(--dixy-skin-panel-relief);
244
+ }
245
+ :is(
246
+ .dixy-card,
247
+ .dixy-box,
248
+ .dixy-dialog-popup,
249
+ .dixy-alert-dialog-popup,
250
+ .dixy-drawer-popup,
251
+ .dixy-popover-popup,
252
+ .dixy-preview-card-popup,
253
+ .dixy-tooltip-popup,
254
+ .dixy-select-popup,
255
+ .dixy-combobox-popup,
256
+ .dixy-autocomplete-popup,
257
+ .dixy-menu-popup,
258
+ .dixy-context-menu-popup,
259
+ .dixy-navigation-menu-popup,
260
+ .dixy-toast-root,
261
+ .dixy-alert,
262
+ .dixy-list-box,
263
+ .dixy-calendar,
264
+ .dixy-range-calendar
265
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
266
+ [data-dixy-material-override]
267
+ ):not(:where([data-dixy-material-override]) *):not(
268
+ [data-variant="solid"]
269
+ ):not([data-variant="soft"]) {
270
+ background-color: var(--dixy-skin-surface);
271
+ }
272
+ :is(
273
+ .dixy-input,
274
+ .dixy-textarea,
275
+ .dixy-native-select,
276
+ .dixy-select-trigger,
277
+ .dixy-input-group,
278
+ .dixy-combobox-input-group,
279
+ .dixy-autocomplete-input-group,
280
+ .dixy-number-field-group,
281
+ .dixy-otp-field-input
282
+ )[data-dixy-skin="dixy/swiss-poster"] {
283
+ border-radius: calc(var(--dixy-radius-control) * 1);
284
+ }
285
+ :is(
286
+ .dixy-input,
287
+ .dixy-textarea,
288
+ .dixy-native-select,
289
+ .dixy-select-trigger,
290
+ .dixy-input-group,
291
+ .dixy-combobox-input-group,
292
+ .dixy-autocomplete-input-group,
293
+ .dixy-number-field-group,
294
+ .dixy-otp-field-input
295
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
296
+ [data-dixy-material-override]
297
+ ):not(:where([data-dixy-material-override]) *) {
298
+ border-width: var(--dixy-input-border-width);
299
+ border-color: var(--dixy-skin-edge);
300
+ background-image: var(--dixy-skin-paint);
301
+ background-color: var(--dixy-color-background-canvas);
302
+ background-size:
303
+ var(--dixy-skin-grain-size) var(--dixy-skin-grain-size),
304
+ 100% 100%,
305
+ 100% 100%,
306
+ 100% 100%;
307
+ box-shadow: var(--dixy-skin-inset);
308
+ }
309
+ :is(.dixy-button)[data-dixy-skin="dixy/swiss-poster"]:not(
310
+ [data-dixy-material-override]
311
+ ):not(:where([data-dixy-material-override]) *):is(
312
+ [data-variant="solid"],
313
+ [data-variant="soft"],
314
+ [data-variant="outline"]
315
+ ):not([data-disabled]) {
316
+ border-width: var(--dixy-button-border-width);
317
+ border-color: var(--dixy-skin-edge);
318
+ border-radius: calc(var(--dixy-shape-control) * 1);
319
+ background-image: var(--dixy-skin-finish);
320
+ box-shadow: var(--dixy-skin-control-relief);
321
+ }
322
+
323
+ :is(.dixy-button)[data-dixy-skin="dixy/swiss-poster"]:not(
324
+ [data-dixy-material-override]
325
+ ):not(:where([data-dixy-material-override]) *):is(
326
+ [data-variant="solid"],
327
+ [data-variant="soft"],
328
+ [data-variant="outline"]
329
+ ):not([data-disabled]):active {
330
+ box-shadow: var(--dixy-skin-inset);
331
+ }
332
+ :is(.dixy-tabs-list)[data-dixy-skin="dixy/swiss-poster"]:not(
333
+ [data-dixy-material-override]
334
+ ):not(:where([data-dixy-material-override]) *) {
335
+ background-color: var(--dixy-color-background-canvas);
336
+ border: 1px solid var(--dixy-skin-edge);
337
+ box-shadow: var(--dixy-skin-inset);
338
+ }
339
+ :is(.dixy-tabs-indicator)[data-dixy-skin="dixy/swiss-poster"]:not(
340
+ [data-dixy-material-override]
341
+ ):not(:where([data-dixy-material-override]) *) {
342
+ background-image: var(--dixy-skin-finish);
343
+ box-shadow: var(--dixy-skin-control-relief);
344
+ border: 1px solid var(--dixy-skin-edge);
345
+ }
346
+ /* Toggle groups read like tabs: a sunken track, the selected toggle a raised thumb (slider-knob paint in light, the raised finish in dark so its label stays readable). */
347
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
348
+ .dixy-toggle-group:is([data-attached], [data-segmented]):not(
349
+ [data-dixy-material-override]
350
+ ):not(:where([data-dixy-material-override]) *) {
351
+ background-color: var(--dixy-color-background-canvas);
352
+ border: 1px solid var(--dixy-skin-edge);
353
+ box-shadow: var(--dixy-skin-inset);
354
+ }
355
+ :is(.dixy-toggle)[data-dixy-skin="dixy/swiss-poster"]:not(
356
+ [data-dixy-material-override]
357
+ ):not(:where([data-dixy-material-override]) *):not(
358
+ [data-variant="solid"]
359
+ )[data-pressed]:not([data-disabled]) {
360
+ background-color: var(--dixy-color-background-surface-raised);
361
+ background-image: var(--dixy-skin-selected, var(--dixy-skin-thumb));
362
+ box-shadow: var(--dixy-skin-control-relief);
363
+ border-color: var(--dixy-skin-edge);
364
+ color: var(--dixy-color-text-primary);
365
+ }
366
+ :is(
367
+ .dixy-slider-track,
368
+ .dixy-progress-track,
369
+ .dixy-meter-track
370
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
371
+ [data-dixy-material-override]
372
+ ):not(:where([data-dixy-material-override]) *) {
373
+ border: 1px solid var(--dixy-skin-edge);
374
+ background-color: var(--dixy-color-background-surface);
375
+ box-shadow: var(--dixy-skin-inset);
376
+ }
377
+ :is(
378
+ .dixy-slider-indicator,
379
+ .dixy-progress-indicator,
380
+ .dixy-meter-indicator
381
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
382
+ [data-dixy-material-override]
383
+ ):not(:where([data-dixy-material-override]) *) {
384
+ background-image: var(--dixy-skin-finish);
385
+ }
386
+ :is(
387
+ .dixy-switch-root,
388
+ .dixy-checkbox-root,
389
+ .dixy-radio-root
390
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
391
+ [data-dixy-material-override]
392
+ ):not(:where([data-dixy-material-override]) *)::before {
393
+ box-shadow: var(--dixy-skin-inset);
394
+ }
395
+ :is(
396
+ .dixy-checkbox-root,
397
+ .dixy-radio-root
398
+ )[data-dixy-skin="dixy/swiss-poster"]:not(
399
+ [data-dixy-material-override]
400
+ ):not(:where([data-dixy-material-override]) *)[data-checked]::before {
401
+ background-image: var(--dixy-skin-finish);
402
+ }
403
+ :is(.dixy-switch-thumb)[data-dixy-skin="dixy/swiss-poster"]:not(
404
+ [data-dixy-material-override]
405
+ ):not(:where([data-dixy-material-override]) *) {
406
+ background-image: var(--dixy-skin-thumb);
407
+ box-shadow: var(--dixy-skin-control-relief);
408
+ border: 1px solid var(--dixy-skin-edge);
409
+ }
410
+ :is(.dixy-slider-thumb)[data-dixy-skin="dixy/swiss-poster"]:not(
411
+ [data-dixy-material-override]
412
+ ):not(:where([data-dixy-material-override]) *)::before {
413
+ background-image: var(--dixy-skin-thumb);
414
+ box-shadow: var(--dixy-skin-control-relief);
415
+ border: 1px solid var(--dixy-skin-edge);
416
+ }
417
+
418
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] .dixy-swiss-ornament {
419
+ position: absolute;
420
+ inset: 0;
421
+ display: block;
422
+ pointer-events: none;
423
+ user-select: none;
424
+ border-radius: inherit;
425
+ z-index: 1;
426
+ color: var(--dixy-skin-edge);
427
+ }
428
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
429
+ .dixy-swiss-ornament:is(
430
+ .dixy-skin-ornament-card,
431
+ .dixy-skin-ornament-dialog
432
+ ) {
433
+ clip-path: polygon(
434
+ evenodd,
435
+ 0 0,
436
+ 100% 0,
437
+ 100% 100%,
438
+ 0 100%,
439
+ 0 0,
440
+ var(--dixy-skin-frame-safe-inline, 20px)
441
+ var(--dixy-skin-frame-safe-top, 26px),
442
+ var(--dixy-skin-frame-safe-inline, 20px)
443
+ calc(100% - var(--dixy-skin-frame-safe-bottom, 20px)),
444
+ calc(100% - var(--dixy-skin-frame-safe-inline, 20px))
445
+ calc(100% - var(--dixy-skin-frame-safe-bottom, 20px)),
446
+ calc(100% - var(--dixy-skin-frame-safe-inline, 20px))
447
+ var(--dixy-skin-frame-safe-top, 26px),
448
+ var(--dixy-skin-frame-safe-inline, 20px)
449
+ var(--dixy-skin-frame-safe-top, 26px)
450
+ );
451
+ }
452
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
453
+ .dixy-swiss-ornament.dixy-skin-ornament-theme {
454
+ z-index: -1;
455
+ overflow: hidden;
456
+ }
457
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
458
+ .dixy-swiss-ornament
459
+ .dixy-skin-definitions {
460
+ position: absolute;
461
+ overflow: hidden;
462
+ }
463
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
464
+ .dixy-swiss-ornament
465
+ .dixy-skin-control-art {
466
+ width: 100%;
467
+ height: 100%;
468
+ }
469
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
470
+ .dixy-swiss-ornament.dixy-skin-ornament-switch-thumb {
471
+ display: grid;
472
+ place-items: center;
473
+ inset: 2px;
474
+ }
475
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
476
+ .dixy-switch-thumb:not([data-checked])
477
+ > .dixy-swiss-ornament {
478
+ display: none;
479
+ }
480
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
481
+ .dixy-swiss-ornament
482
+ .dixy-skin-fastener {
483
+ position: absolute;
484
+ width: 11px;
485
+ height: 11px;
486
+ }
487
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
488
+ .dixy-swiss-ornament
489
+ .dixy-skin-fastener-tl {
490
+ top: 5px;
491
+ left: 5px;
492
+ }
493
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
494
+ .dixy-swiss-ornament
495
+ .dixy-skin-fastener-tr {
496
+ top: 5px;
497
+ right: 5px;
498
+ }
499
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
500
+ .dixy-swiss-ornament
501
+ .dixy-skin-fastener-bl {
502
+ bottom: 5px;
503
+ left: 5px;
504
+ }
505
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
506
+ .dixy-swiss-ornament
507
+ .dixy-skin-fastener-br {
508
+ bottom: 5px;
509
+ right: 5px;
510
+ }
511
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
512
+ .dixy-swiss-ornament[data-animated]
513
+ .dixy-skin-motion {
514
+ animation: dixy-swiss-detail 4s ease-in-out infinite alternate;
515
+ }
516
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
517
+ .dixy-swiss-ornament[data-motion="reduced"]
518
+ .dixy-skin-motion {
519
+ animation: none;
520
+ }
521
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
522
+ .dixy-swiss-ornament
523
+ .dixy-frame-corner {
524
+ position: absolute;
525
+ width: min(64px, 50%);
526
+ height: min(64px, 50%);
527
+ overflow: visible;
528
+ }
529
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
530
+ .dixy-swiss-ornament
531
+ .dixy-frame-corner-tl {
532
+ left: 0;
533
+ top: 0;
534
+ }
535
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
536
+ .dixy-swiss-ornament
537
+ .dixy-frame-corner-tr {
538
+ right: 0;
539
+ top: 0;
540
+ transform: scaleX(-1);
541
+ }
542
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
543
+ .dixy-swiss-ornament
544
+ .dixy-frame-corner-bl {
545
+ left: 0;
546
+ bottom: 0;
547
+ transform: scaleY(-1);
548
+ }
549
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
550
+ .dixy-swiss-ornament
551
+ .dixy-frame-corner-br {
552
+ right: 0;
553
+ bottom: 0;
554
+ transform: scale(-1);
555
+ }
556
+ @media (prefers-reduced-motion: reduce) {
557
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
558
+ .dixy-swiss-ornament[data-animated]
559
+ .dixy-skin-motion {
560
+ animation: none;
561
+ }
562
+ }
563
+ @media (prefers-reduced-transparency: reduce),
564
+ (prefers-contrast: more),
565
+ (forced-colors: active) {
566
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] .dixy-swiss-ornament {
567
+ display: none;
568
+ }
569
+ }
570
+ @keyframes dixy-swiss-detail {
571
+ from {
572
+ opacity: 0.5;
573
+ }
574
+ to {
575
+ opacity: 1;
576
+ }
577
+ }
578
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
579
+ :is(.dixy-forest-paper, .dixy-atelier-paper, .dixy-atelier-linen) {
580
+ display: none;
581
+ }
582
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
583
+ .dixy-swiss-ornament.dixy-organic-ornament {
584
+ clip-path: none;
585
+ overflow: visible;
586
+ border-radius: inherit;
587
+ }
588
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
589
+ .dixy-swiss-ornament
590
+ .dixy-organic-canvas {
591
+ display: block;
592
+ position: absolute;
593
+ left: -32px;
594
+ top: -32px;
595
+ width: calc(100% + 64px);
596
+ height: calc(100% + 64px);
597
+ pointer-events: none;
598
+ }
599
+
600
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] {
601
+ --dixy-motion-easing-standard: cubic-bezier(0.5, 0, 0.1, 1);
602
+ --dixy-motion-easing-enter: cubic-bezier(0.5, 0, 0.1, 1);
603
+ --dixy-personality-press-distance: 0.5px;
604
+ }
605
+ @media (prefers-reduced-motion: no-preference) {
606
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]:not(
607
+ [data-motion="reduced"]
608
+ ) {
609
+ --dixy-motion-duration-fast: 156ms;
610
+ --dixy-motion-duration-normal: 260ms;
611
+ --dixy-motion-duration-deliberate: 364ms;
612
+ --dixy-motion-duration-slow: 520ms;
613
+ }
614
+ }
615
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
616
+ :is(h1, h2, h3, .dixy-heading) {
617
+ letter-spacing: -0.03em;
618
+ }
619
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
620
+ :is(h1, h2, h3, .dixy-heading) {
621
+ font-weight: 400;
622
+ }
623
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
624
+ [data-dixy-skin]:focus-visible,
625
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
626
+ [data-dixy-skin]
627
+ :focus-visible {
628
+ outline-width: 2px;
629
+ outline-offset: 5px;
630
+ }
631
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
632
+ svg[stroke="currentColor"]:not(.dixy-skin-ornament svg) {
633
+ stroke-width: 2.25;
634
+ }
635
+
636
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]:not(
637
+ .dixy-portal-scope
638
+ )::before {
639
+ content: "";
640
+ position: absolute;
641
+ inset: 0;
642
+ z-index: -1;
643
+ pointer-events: none;
644
+ border-radius: inherit;
645
+ opacity: 0.15;
646
+ --dixy-skin-pattern-ink: color-mix(
647
+ in srgb,
648
+ var(--dixy-skin-edge) 40%,
649
+ transparent
650
+ );
651
+ background-image:
652
+ linear-gradient(var(--dixy-skin-pattern-ink) 1px, transparent 1px),
653
+ linear-gradient(90deg, var(--dixy-skin-pattern-ink) 1px, transparent 1px);
654
+ background-size: 56px 56px;
655
+ }
656
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-effects="reduced"]::before {
657
+ display: none;
658
+ }
659
+ @media (prefers-reduced-transparency: reduce),
660
+ (prefers-contrast: more),
661
+ (forced-colors: active) {
662
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]::before {
663
+ display: none;
664
+ }
665
+ }
666
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"]
667
+ :is(.dixy-card, .dixy-dialog-popup)[data-dixy-skin="dixy/swiss-poster"] {
668
+ border-radius: 0;
669
+ --dixy-chrome-bar-radius: 0px;
670
+ clip-path: polygon(
671
+ 10px 0,
672
+ calc(100% - 10px) 0,
673
+ 100% 10px,
674
+ 100% calc(100% - 10px),
675
+ calc(100% - 10px) 100%,
676
+ 10px 100%,
677
+ 0 calc(100% - 10px),
678
+ 0 10px
679
+ );
680
+ }
681
+
682
+ @supports (backdrop-filter: blur(8px)) {
683
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"][data-effects="backdrop"]
684
+ > .dixy-skin-backdrop {
685
+ backdrop-filter: blur(8px);
686
+ }
687
+ }
688
+ @media (prefers-reduced-transparency: reduce),
689
+ (prefers-contrast: more),
690
+ (forced-colors: active) {
691
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] {
692
+ --dixy-skin-paint: none;
693
+ --dixy-skin-finish: none;
694
+ --dixy-skin-canvas: none;
695
+ --dixy-skin-thumb: none;
696
+ --dixy-skin-shadow: none;
697
+ --dixy-skin-inset: none;
698
+ --dixy-skin-panel-relief: none;
699
+ --dixy-skin-control-relief: none;
700
+ }
701
+ .dixy-theme[data-dixy-skin="dixy/swiss-poster"] > .dixy-skin-backdrop,
702
+ :is(
703
+ .dixy-card,
704
+ .dixy-box,
705
+ .dixy-dialog-popup,
706
+ .dixy-alert-dialog-popup,
707
+ .dixy-drawer-popup,
708
+ .dixy-popover-popup,
709
+ .dixy-preview-card-popup,
710
+ .dixy-tooltip-popup,
711
+ .dixy-select-popup,
712
+ .dixy-combobox-popup,
713
+ .dixy-autocomplete-popup,
714
+ .dixy-menu-popup,
715
+ .dixy-context-menu-popup,
716
+ .dixy-navigation-menu-popup,
717
+ .dixy-toast-root,
718
+ .dixy-alert,
719
+ .dixy-list-box,
720
+ .dixy-calendar,
721
+ .dixy-range-calendar
722
+ )[data-dixy-skin="dixy/swiss-poster"] {
723
+ backdrop-filter: none !important;
724
+ -webkit-backdrop-filter: none !important;
725
+ }
726
+ }
727
+ }