useful-css-pkg 1.0.0

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 (2) hide show
  1. package/download-center.css +573 -0
  2. package/package.json +12 -0
@@ -0,0 +1,573 @@
1
+ /*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
2
+ @layer properties;
3
+ @layer theme, base, components, utilities;
4
+ @layer theme {
5
+ :root, :host {
6
+ --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
7
+ "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
8
+ --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
9
+ "Courier New", monospace;
10
+ --color-red-50: oklch(97.1% 0.013 17.38);
11
+ --color-red-100: oklch(93.6% 0.032 17.717);
12
+ --color-red-600: oklch(57.7% 0.245 27.325);
13
+ --color-blue-600: oklch(54.6% 0.245 262.881);
14
+ --color-blue-700: oklch(48.8% 0.243 264.376);
15
+ --color-purple-50: oklch(97.7% 0.014 308.299);
16
+ --color-purple-100: oklch(94.6% 0.033 307.174);
17
+ --color-purple-600: oklch(55.8% 0.288 302.321);
18
+ --color-slate-100: oklch(96.8% 0.007 247.896);
19
+ --color-slate-200: oklch(92.9% 0.013 255.508);
20
+ --color-slate-400: oklch(70.4% 0.04 256.788);
21
+ --color-slate-500: oklch(55.4% 0.046 257.417);
22
+ --color-slate-600: oklch(44.6% 0.043 257.281);
23
+ --color-slate-800: oklch(27.9% 0.041 260.031);
24
+ --color-slate-900: oklch(20.8% 0.042 265.755);
25
+ --color-white: #fff;
26
+ --spacing: 0.25rem;
27
+ --container-5xl: 64rem;
28
+ --text-xs: 0.75rem;
29
+ --text-xs--line-height: calc(1 / 0.75);
30
+ --text-sm: 0.875rem;
31
+ --text-sm--line-height: calc(1.25 / 0.875);
32
+ --text-lg: 1.125rem;
33
+ --text-lg--line-height: calc(1.75 / 1.125);
34
+ --text-4xl: 2.25rem;
35
+ --text-4xl--line-height: calc(2.5 / 2.25);
36
+ --font-weight-medium: 500;
37
+ --font-weight-semibold: 600;
38
+ --font-weight-bold: 700;
39
+ --font-weight-extrabold: 800;
40
+ --tracking-tight: -0.025em;
41
+ --radius-lg: 0.5rem;
42
+ --radius-xl: 0.75rem;
43
+ --default-transition-duration: 150ms;
44
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
45
+ --default-font-family: var(--font-sans);
46
+ --default-mono-font-family: var(--font-mono);
47
+ }
48
+ }
49
+ @layer base {
50
+ *, ::after, ::before, ::backdrop, ::file-selector-button {
51
+ box-sizing: border-box;
52
+ margin: 0;
53
+ padding: 0;
54
+ border: 0 solid;
55
+ }
56
+ html, :host {
57
+ line-height: 1.5;
58
+ -webkit-text-size-adjust: 100%;
59
+ tab-size: 4;
60
+ font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
61
+ font-feature-settings: var(--default-font-feature-settings, normal);
62
+ font-variation-settings: var(--default-font-variation-settings, normal);
63
+ -webkit-tap-highlight-color: transparent;
64
+ }
65
+ hr {
66
+ height: 0;
67
+ color: inherit;
68
+ border-top-width: 1px;
69
+ }
70
+ abbr:where([title]) {
71
+ -webkit-text-decoration: underline dotted;
72
+ text-decoration: underline dotted;
73
+ }
74
+ h1, h2, h3, h4, h5, h6 {
75
+ font-size: inherit;
76
+ font-weight: inherit;
77
+ }
78
+ a {
79
+ color: inherit;
80
+ -webkit-text-decoration: inherit;
81
+ text-decoration: inherit;
82
+ }
83
+ b, strong {
84
+ font-weight: bolder;
85
+ }
86
+ code, kbd, samp, pre {
87
+ font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
88
+ font-feature-settings: var(--default-mono-font-feature-settings, normal);
89
+ font-variation-settings: var(--default-mono-font-variation-settings, normal);
90
+ font-size: 1em;
91
+ }
92
+ small {
93
+ font-size: 80%;
94
+ }
95
+ sub, sup {
96
+ font-size: 75%;
97
+ line-height: 0;
98
+ position: relative;
99
+ vertical-align: baseline;
100
+ }
101
+ sub {
102
+ bottom: -0.25em;
103
+ }
104
+ sup {
105
+ top: -0.5em;
106
+ }
107
+ table {
108
+ text-indent: 0;
109
+ border-color: inherit;
110
+ border-collapse: collapse;
111
+ }
112
+ :-moz-focusring {
113
+ outline: auto;
114
+ }
115
+ progress {
116
+ vertical-align: baseline;
117
+ }
118
+ summary {
119
+ display: list-item;
120
+ }
121
+ ol, ul, menu {
122
+ list-style: none;
123
+ }
124
+ img, svg, video, canvas, audio, iframe, embed, object {
125
+ display: block;
126
+ vertical-align: middle;
127
+ }
128
+ img, video {
129
+ max-width: 100%;
130
+ height: auto;
131
+ }
132
+ button, input, select, optgroup, textarea, ::file-selector-button {
133
+ font: inherit;
134
+ font-feature-settings: inherit;
135
+ font-variation-settings: inherit;
136
+ letter-spacing: inherit;
137
+ color: inherit;
138
+ border-radius: 0;
139
+ background-color: transparent;
140
+ opacity: 1;
141
+ }
142
+ :where(select:is([multiple], [size])) optgroup {
143
+ font-weight: bolder;
144
+ }
145
+ :where(select:is([multiple], [size])) optgroup option {
146
+ padding-inline-start: 20px;
147
+ }
148
+ ::file-selector-button {
149
+ margin-inline-end: 4px;
150
+ }
151
+ ::placeholder {
152
+ opacity: 1;
153
+ }
154
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
155
+ ::placeholder {
156
+ color: currentcolor;
157
+ @supports (color: color-mix(in lab, red, red)) {
158
+ color: color-mix(in oklab, currentcolor 50%, transparent);
159
+ }
160
+ }
161
+ }
162
+ textarea {
163
+ resize: vertical;
164
+ }
165
+ ::-webkit-search-decoration {
166
+ -webkit-appearance: none;
167
+ }
168
+ ::-webkit-date-and-time-value {
169
+ min-height: 1lh;
170
+ text-align: inherit;
171
+ }
172
+ ::-webkit-datetime-edit {
173
+ display: inline-flex;
174
+ }
175
+ ::-webkit-datetime-edit-fields-wrapper {
176
+ padding: 0;
177
+ }
178
+ ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
179
+ padding-block: 0;
180
+ }
181
+ ::-webkit-calendar-picker-indicator {
182
+ line-height: 1;
183
+ }
184
+ :-moz-ui-invalid {
185
+ box-shadow: none;
186
+ }
187
+ button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
188
+ appearance: button;
189
+ }
190
+ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
191
+ height: auto;
192
+ }
193
+ [hidden]:where(:not([hidden="until-found"])) {
194
+ display: none !important;
195
+ }
196
+ }
197
+ @layer utilities {
198
+ .end {
199
+ inset-inline-end: var(--spacing);
200
+ }
201
+ .mx-auto {
202
+ margin-inline: auto;
203
+ }
204
+ .mt-3 {
205
+ margin-top: calc(var(--spacing) * 3);
206
+ }
207
+ .mt-6 {
208
+ margin-top: calc(var(--spacing) * 6);
209
+ }
210
+ .mr-2 {
211
+ margin-right: calc(var(--spacing) * 2);
212
+ }
213
+ .mb-4 {
214
+ margin-bottom: calc(var(--spacing) * 4);
215
+ }
216
+ .mb-8 {
217
+ margin-bottom: calc(var(--spacing) * 8);
218
+ }
219
+ .flex {
220
+ display: flex;
221
+ }
222
+ .h-4 {
223
+ height: calc(var(--spacing) * 4);
224
+ }
225
+ .h-6 {
226
+ height: calc(var(--spacing) * 6);
227
+ }
228
+ .w-4 {
229
+ width: calc(var(--spacing) * 4);
230
+ }
231
+ .w-6 {
232
+ width: calc(var(--spacing) * 6);
233
+ }
234
+ .max-w-5xl {
235
+ max-width: var(--container-5xl);
236
+ }
237
+ .flex-col {
238
+ flex-direction: column;
239
+ }
240
+ .items-center {
241
+ align-items: center;
242
+ }
243
+ .items-start {
244
+ align-items: flex-start;
245
+ }
246
+ .justify-between {
247
+ justify-content: space-between;
248
+ }
249
+ .space-y-1 {
250
+ :where(& > :not(:last-child)) {
251
+ --tw-space-y-reverse: 0;
252
+ margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
253
+ margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
254
+ }
255
+ }
256
+ .space-x-3 {
257
+ :where(& > :not(:last-child)) {
258
+ --tw-space-x-reverse: 0;
259
+ margin-inline-start: calc(calc(var(--spacing) * 3) * var(--tw-space-x-reverse));
260
+ margin-inline-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-x-reverse)));
261
+ }
262
+ }
263
+ .space-x-4 {
264
+ :where(& > :not(:last-child)) {
265
+ --tw-space-x-reverse: 0;
266
+ margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));
267
+ margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)));
268
+ }
269
+ }
270
+ .space-x-5 {
271
+ :where(& > :not(:last-child)) {
272
+ --tw-space-x-reverse: 0;
273
+ margin-inline-start: calc(calc(var(--spacing) * 5) * var(--tw-space-x-reverse));
274
+ margin-inline-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-x-reverse)));
275
+ }
276
+ }
277
+ .space-x-6 {
278
+ :where(& > :not(:last-child)) {
279
+ --tw-space-x-reverse: 0;
280
+ margin-inline-start: calc(calc(var(--spacing) * 6) * var(--tw-space-x-reverse));
281
+ margin-inline-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-x-reverse)));
282
+ }
283
+ }
284
+ .rounded-lg {
285
+ border-radius: var(--radius-lg);
286
+ }
287
+ .rounded-xl {
288
+ border-radius: var(--radius-xl);
289
+ }
290
+ .border {
291
+ border-style: var(--tw-border-style);
292
+ border-width: 1px;
293
+ }
294
+ .border-b {
295
+ border-bottom-style: var(--tw-border-style);
296
+ border-bottom-width: 1px;
297
+ }
298
+ .border-b-2 {
299
+ border-bottom-style: var(--tw-border-style);
300
+ border-bottom-width: 2px;
301
+ }
302
+ .border-slate-100 {
303
+ border-color: var(--color-slate-100);
304
+ }
305
+ .border-slate-200 {
306
+ border-color: var(--color-slate-200);
307
+ }
308
+ .border-transparent {
309
+ border-color: transparent;
310
+ }
311
+ .bg-\[\#fcfcfd\] {
312
+ background-color: #fcfcfd;
313
+ }
314
+ .bg-blue-600 {
315
+ background-color: var(--color-blue-600);
316
+ }
317
+ .bg-purple-50 {
318
+ background-color: var(--color-purple-50);
319
+ }
320
+ .bg-red-50 {
321
+ background-color: var(--color-red-50);
322
+ }
323
+ .bg-slate-100 {
324
+ background-color: var(--color-slate-100);
325
+ }
326
+ .bg-white {
327
+ background-color: var(--color-white);
328
+ }
329
+ .p-3 {
330
+ padding: calc(var(--spacing) * 3);
331
+ }
332
+ .p-6 {
333
+ padding: calc(var(--spacing) * 6);
334
+ }
335
+ .px-4 {
336
+ padding-inline: calc(var(--spacing) * 4);
337
+ }
338
+ .px-6 {
339
+ padding-inline: calc(var(--spacing) * 6);
340
+ }
341
+ .py-2 {
342
+ padding-block: calc(var(--spacing) * 2);
343
+ }
344
+ .py-12 {
345
+ padding-block: calc(var(--spacing) * 12);
346
+ }
347
+ .py-16 {
348
+ padding-block: calc(var(--spacing) * 16);
349
+ }
350
+ .pb-4 {
351
+ padding-bottom: calc(var(--spacing) * 4);
352
+ }
353
+ .text-4xl {
354
+ font-size: var(--text-4xl);
355
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
356
+ }
357
+ .text-lg {
358
+ font-size: var(--text-lg);
359
+ line-height: var(--tw-leading, var(--text-lg--line-height));
360
+ }
361
+ .text-sm {
362
+ font-size: var(--text-sm);
363
+ line-height: var(--tw-leading, var(--text-sm--line-height));
364
+ }
365
+ .text-xs {
366
+ font-size: var(--text-xs);
367
+ line-height: var(--tw-leading, var(--text-xs--line-height));
368
+ }
369
+ .font-bold {
370
+ --tw-font-weight: var(--font-weight-bold);
371
+ font-weight: var(--font-weight-bold);
372
+ }
373
+ .font-extrabold {
374
+ --tw-font-weight: var(--font-weight-extrabold);
375
+ font-weight: var(--font-weight-extrabold);
376
+ }
377
+ .font-medium {
378
+ --tw-font-weight: var(--font-weight-medium);
379
+ font-weight: var(--font-weight-medium);
380
+ }
381
+ .font-semibold {
382
+ --tw-font-weight: var(--font-weight-semibold);
383
+ font-weight: var(--font-weight-semibold);
384
+ }
385
+ .tracking-tight {
386
+ --tw-tracking: var(--tracking-tight);
387
+ letter-spacing: var(--tracking-tight);
388
+ }
389
+ .text-purple-600 {
390
+ color: var(--color-purple-600);
391
+ }
392
+ .text-red-600 {
393
+ color: var(--color-red-600);
394
+ }
395
+ .text-slate-400 {
396
+ color: var(--color-slate-400);
397
+ }
398
+ .text-slate-500 {
399
+ color: var(--color-slate-500);
400
+ }
401
+ .text-slate-600 {
402
+ color: var(--color-slate-600);
403
+ }
404
+ .text-slate-900 {
405
+ color: var(--color-slate-900);
406
+ }
407
+ .text-white {
408
+ color: var(--color-white);
409
+ }
410
+ .filter {
411
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
412
+ }
413
+ .transition {
414
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
415
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
416
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
417
+ }
418
+ .transition-all {
419
+ transition-property: all;
420
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
421
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
422
+ }
423
+ .group-hover\:bg-purple-100 {
424
+ &:is(:where(.group):hover *) {
425
+ @media (hover: hover) {
426
+ background-color: var(--color-purple-100);
427
+ }
428
+ }
429
+ }
430
+ .group-hover\:bg-red-100 {
431
+ &:is(:where(.group):hover *) {
432
+ @media (hover: hover) {
433
+ background-color: var(--color-red-100);
434
+ }
435
+ }
436
+ }
437
+ .group-hover\:bg-slate-200 {
438
+ &:is(:where(.group):hover *) {
439
+ @media (hover: hover) {
440
+ background-color: var(--color-slate-200);
441
+ }
442
+ }
443
+ }
444
+ .hover\:bg-blue-700 {
445
+ &:hover {
446
+ @media (hover: hover) {
447
+ background-color: var(--color-blue-700);
448
+ }
449
+ }
450
+ }
451
+ .hover\:text-slate-800 {
452
+ &:hover {
453
+ @media (hover: hover) {
454
+ color: var(--color-slate-800);
455
+ }
456
+ }
457
+ }
458
+ .md\:mt-0 {
459
+ @media (width >= 48rem) {
460
+ margin-top: calc(var(--spacing) * 0);
461
+ }
462
+ }
463
+ .md\:flex-row {
464
+ @media (width >= 48rem) {
465
+ flex-direction: row;
466
+ }
467
+ }
468
+ .md\:items-center {
469
+ @media (width >= 48rem) {
470
+ align-items: center;
471
+ }
472
+ }
473
+ }
474
+ @property --tw-space-y-reverse {
475
+ syntax: "*";
476
+ inherits: false;
477
+ initial-value: 0;
478
+ }
479
+ @property --tw-space-x-reverse {
480
+ syntax: "*";
481
+ inherits: false;
482
+ initial-value: 0;
483
+ }
484
+ @property --tw-border-style {
485
+ syntax: "*";
486
+ inherits: false;
487
+ initial-value: solid;
488
+ }
489
+ @property --tw-font-weight {
490
+ syntax: "*";
491
+ inherits: false;
492
+ }
493
+ @property --tw-tracking {
494
+ syntax: "*";
495
+ inherits: false;
496
+ }
497
+ @property --tw-blur {
498
+ syntax: "*";
499
+ inherits: false;
500
+ }
501
+ @property --tw-brightness {
502
+ syntax: "*";
503
+ inherits: false;
504
+ }
505
+ @property --tw-contrast {
506
+ syntax: "*";
507
+ inherits: false;
508
+ }
509
+ @property --tw-grayscale {
510
+ syntax: "*";
511
+ inherits: false;
512
+ }
513
+ @property --tw-hue-rotate {
514
+ syntax: "*";
515
+ inherits: false;
516
+ }
517
+ @property --tw-invert {
518
+ syntax: "*";
519
+ inherits: false;
520
+ }
521
+ @property --tw-opacity {
522
+ syntax: "*";
523
+ inherits: false;
524
+ }
525
+ @property --tw-saturate {
526
+ syntax: "*";
527
+ inherits: false;
528
+ }
529
+ @property --tw-sepia {
530
+ syntax: "*";
531
+ inherits: false;
532
+ }
533
+ @property --tw-drop-shadow {
534
+ syntax: "*";
535
+ inherits: false;
536
+ }
537
+ @property --tw-drop-shadow-color {
538
+ syntax: "*";
539
+ inherits: false;
540
+ }
541
+ @property --tw-drop-shadow-alpha {
542
+ syntax: "<percentage>";
543
+ inherits: false;
544
+ initial-value: 100%;
545
+ }
546
+ @property --tw-drop-shadow-size {
547
+ syntax: "*";
548
+ inherits: false;
549
+ }
550
+ @layer properties {
551
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
552
+ *, ::before, ::after, ::backdrop {
553
+ --tw-space-y-reverse: 0;
554
+ --tw-space-x-reverse: 0;
555
+ --tw-border-style: solid;
556
+ --tw-font-weight: initial;
557
+ --tw-tracking: initial;
558
+ --tw-blur: initial;
559
+ --tw-brightness: initial;
560
+ --tw-contrast: initial;
561
+ --tw-grayscale: initial;
562
+ --tw-hue-rotate: initial;
563
+ --tw-invert: initial;
564
+ --tw-opacity: initial;
565
+ --tw-saturate: initial;
566
+ --tw-sepia: initial;
567
+ --tw-drop-shadow: initial;
568
+ --tw-drop-shadow-color: initial;
569
+ --tw-drop-shadow-alpha: 100%;
570
+ --tw-drop-shadow-size: initial;
571
+ }
572
+ }
573
+ }
package/package.json ADDED
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "useful-css-pkg",
3
+ "version": "1.0.0",
4
+ "description": "",
5
+ "license": "ISC",
6
+ "author": "",
7
+ "type": "commonjs",
8
+ "main": "index.js",
9
+ "scripts": {
10
+ "test": "echo \"Error: no test specified\" && exit 1"
11
+ }
12
+ }