@lindaui/tokens 0.2.0 → 0.2.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 (2) hide show
  1. package/dist/index.css +164 -74
  2. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -220,6 +220,9 @@
220
220
  }
221
221
  }
222
222
  @layer utilities {
223
+ .pointer-events-auto {
224
+ pointer-events: auto;
225
+ }
223
226
  .pointer-events-none {
224
227
  pointer-events: none;
225
228
  }
@@ -229,12 +232,21 @@
229
232
  .absolute {
230
233
  position: absolute;
231
234
  }
235
+ .fixed {
236
+ position: fixed;
237
+ }
232
238
  .relative {
233
239
  position: relative;
234
240
  }
235
241
  .inset-0 {
236
242
  inset: 0;
237
243
  }
244
+ .inset-x-0 {
245
+ inset-inline: 0;
246
+ }
247
+ .top-0 {
248
+ top: 0;
249
+ }
238
250
  .top-3 {
239
251
  top: calc(var(--spacing) * 3);
240
252
  }
@@ -256,9 +268,6 @@
256
268
  .left-3 {
257
269
  left: calc(var(--spacing) * 3);
258
270
  }
259
- .left-3\.5 {
260
- left: calc(var(--spacing) * 3.5);
261
- }
262
271
  .left-4 {
263
272
  left: calc(var(--spacing) * 4);
264
273
  }
@@ -364,6 +373,9 @@
364
373
  .inline {
365
374
  display: inline;
366
375
  }
376
+ .inline-block {
377
+ display: inline-block;
378
+ }
367
379
  .inline-flex {
368
380
  display: inline-flex;
369
381
  }
@@ -424,6 +436,9 @@
424
436
  .h-8 {
425
437
  height: calc(var(--spacing) * 8);
426
438
  }
439
+ .h-9 {
440
+ height: calc(var(--spacing) * 9);
441
+ }
427
442
  .h-10 {
428
443
  height: calc(var(--spacing) * 10);
429
444
  }
@@ -750,6 +765,9 @@
750
765
  margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
751
766
  }
752
767
  }
768
+ .gap-x-2 {
769
+ column-gap: calc(var(--spacing) * 2);
770
+ }
753
771
  .self-center {
754
772
  align-self: center;
755
773
  }
@@ -833,9 +851,6 @@
833
851
  border-color: color-mix(in oklab, var(--destructive) 35%, transparent);
834
852
  }
835
853
  }
836
- .bg-\[oklch\(0\.16_0\.02_240\)\] {
837
- background-color: oklch(0.16 0.02 240);
838
- }
839
854
  .bg-\[var\(--accent\)\]\/10 {
840
855
  background-color: var(--accent);
841
856
  @supports (color: color-mix(in lab, red, red)) {
@@ -896,6 +911,9 @@
896
911
  background-color: color-mix(in oklab, var(--destructive) 15%, transparent);
897
912
  }
898
913
  }
914
+ .bg-foreground {
915
+ background-color: var(--foreground);
916
+ }
899
917
  .bg-green-100 {
900
918
  background-color: var(--color-green-100);
901
919
  }
@@ -947,6 +965,24 @@
947
965
  .bg-yellow-100 {
948
966
  background-color: var(--color-yellow-100);
949
967
  }
968
+ .bg-linear-to-b {
969
+ --tw-gradient-position: to bottom;
970
+ @supports (background-image: linear-gradient(in lab, red, red)) {
971
+ --tw-gradient-position: to bottom in oklab;
972
+ }
973
+ background-image: linear-gradient(var(--tw-gradient-stops));
974
+ }
975
+ .from-black\/25 {
976
+ --tw-gradient-from: color-mix(in srgb, #000 25%, transparent);
977
+ @supports (color: color-mix(in lab, red, red)) {
978
+ --tw-gradient-from: color-mix(in oklab, var(--color-black) 25%, transparent);
979
+ }
980
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
981
+ }
982
+ .to-transparent {
983
+ --tw-gradient-to: transparent;
984
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
985
+ }
950
986
  .fill-foreground {
951
987
  fill: var(--foreground);
952
988
  }
@@ -1046,9 +1082,15 @@
1046
1082
  .pt-4 {
1047
1083
  padding-top: calc(var(--spacing) * 4);
1048
1084
  }
1085
+ .pt-\[max\(0\.75rem\,env\(safe-area-inset-top\)\)\] {
1086
+ padding-top: max(0.75rem, env(safe-area-inset-top));
1087
+ }
1049
1088
  .pt-\[max\(env\(safe-area-inset-top\)\,2rem\)\] {
1050
1089
  padding-top: max(env(safe-area-inset-top), 2rem);
1051
1090
  }
1091
+ .pr-3 {
1092
+ padding-right: calc(var(--spacing) * 3);
1093
+ }
1052
1094
  .pr-8 {
1053
1095
  padding-right: calc(var(--spacing) * 8);
1054
1096
  }
@@ -1061,6 +1103,12 @@
1061
1103
  .pb-4 {
1062
1104
  padding-bottom: calc(var(--spacing) * 4);
1063
1105
  }
1106
+ .pl-2 {
1107
+ padding-left: calc(var(--spacing) * 2);
1108
+ }
1109
+ .pl-\[max\(0\.875rem\,env\(safe-area-inset-left\)\)\] {
1110
+ padding-left: max(0.875rem, env(safe-area-inset-left));
1111
+ }
1064
1112
  .text-center {
1065
1113
  text-align: center;
1066
1114
  }
@@ -1168,15 +1216,9 @@
1168
1216
  .text-\[inherit\] {
1169
1217
  color: inherit;
1170
1218
  }
1171
- .text-\[oklch\(0\.9_0\.01_220\)\] {
1172
- color: oklch(0.9 0.01 220);
1173
- }
1174
1219
  .text-\[oklch\(0\.16_0\.02_240\)\] {
1175
1220
  color: oklch(0.16 0.02 240);
1176
1221
  }
1177
- .text-\[oklch\(0\.72_0\.16_18\)\] {
1178
- color: oklch(0.72 0.16 18);
1179
- }
1180
1222
  .text-\[var\(--accent\)\] {
1181
1223
  color: var(--accent);
1182
1224
  }
@@ -1198,6 +1240,9 @@
1198
1240
  .text-\[var\(--warning\)\] {
1199
1241
  color: var(--warning);
1200
1242
  }
1243
+ .text-background {
1244
+ color: var(--background);
1245
+ }
1201
1246
  .text-black {
1202
1247
  color: var(--color-black);
1203
1248
  }
@@ -1252,20 +1297,14 @@
1252
1297
  .text-viewer-foreground {
1253
1298
  color: var(--viewer-foreground);
1254
1299
  }
1255
- .text-white {
1256
- color: var(--color-white);
1257
- }
1258
- .text-white\/65 {
1259
- color: color-mix(in srgb, #fff 65%, transparent);
1300
+ .text-viewer-foreground\/70 {
1301
+ color: var(--viewer-foreground);
1260
1302
  @supports (color: color-mix(in lab, red, red)) {
1261
- color: color-mix(in oklab, var(--color-white) 65%, transparent);
1303
+ color: color-mix(in oklab, var(--viewer-foreground) 70%, transparent);
1262
1304
  }
1263
1305
  }
1264
- .text-white\/70 {
1265
- color: color-mix(in srgb, #fff 70%, transparent);
1266
- @supports (color: color-mix(in lab, red, red)) {
1267
- color: color-mix(in oklab, var(--color-white) 70%, transparent);
1268
- }
1306
+ .text-white {
1307
+ color: var(--color-white);
1269
1308
  }
1270
1309
  .text-yellow-800 {
1271
1310
  color: var(--color-yellow-800);
@@ -1311,6 +1350,10 @@
1311
1350
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1312
1351
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1313
1352
  }
1353
+ .shadow-sm {
1354
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1355
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1356
+ }
1314
1357
  .filter {
1315
1358
  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,);
1316
1359
  }
@@ -1351,6 +1394,13 @@
1351
1394
  }
1352
1395
  }
1353
1396
  }
1397
+ .hover\:bg-border {
1398
+ &:hover {
1399
+ @media (hover: hover) {
1400
+ background-color: var(--border);
1401
+ }
1402
+ }
1403
+ }
1354
1404
  .active\:bg-accent {
1355
1405
  &:active {
1356
1406
  background-color: var(--accent);
@@ -12886,6 +12936,46 @@
12886
12936
  font-size: 18px;
12887
12937
  }
12888
12938
  }
12939
+ @keyframes ti-rec-pulse {
12940
+ 0% {
12941
+ transform: scale(0.62);
12942
+ opacity: 0.7;
12943
+ }
12944
+ 100% {
12945
+ transform: scale(1.25);
12946
+ opacity: 0;
12947
+ }
12948
+ }
12949
+ @keyframes ti-rec-blink {
12950
+ 0%, 100% {
12951
+ opacity: 1;
12952
+ }
12953
+ 50% {
12954
+ opacity: 0.25;
12955
+ }
12956
+ }
12957
+ @keyframes ti-wf {
12958
+ 0%, 100% {
12959
+ height: 4px;
12960
+ }
12961
+ 50% {
12962
+ height: var(--wfmax);
12963
+ }
12964
+ }
12965
+ @keyframes ti-fade {
12966
+ from {
12967
+ opacity: 0;
12968
+ }
12969
+ }
12970
+ .ti-rec-pulse {
12971
+ animation: ti-rec-pulse 1.8s ease-out infinite;
12972
+ }
12973
+ .ti-rec-blink {
12974
+ animation: ti-rec-blink 1.2s ease-in-out infinite;
12975
+ }
12976
+ .ti-fade {
12977
+ animation: ti-fade 0.25s ease both;
12978
+ }
12889
12979
  @property --tw-scale-x {
12890
12980
  syntax: "*";
12891
12981
  inherits: false;
@@ -12931,6 +13021,48 @@
12931
13021
  inherits: false;
12932
13022
  initial-value: solid;
12933
13023
  }
13024
+ @property --tw-gradient-position {
13025
+ syntax: "*";
13026
+ inherits: false;
13027
+ }
13028
+ @property --tw-gradient-from {
13029
+ syntax: "<color>";
13030
+ inherits: false;
13031
+ initial-value: #0000;
13032
+ }
13033
+ @property --tw-gradient-via {
13034
+ syntax: "<color>";
13035
+ inherits: false;
13036
+ initial-value: #0000;
13037
+ }
13038
+ @property --tw-gradient-to {
13039
+ syntax: "<color>";
13040
+ inherits: false;
13041
+ initial-value: #0000;
13042
+ }
13043
+ @property --tw-gradient-stops {
13044
+ syntax: "*";
13045
+ inherits: false;
13046
+ }
13047
+ @property --tw-gradient-via-stops {
13048
+ syntax: "*";
13049
+ inherits: false;
13050
+ }
13051
+ @property --tw-gradient-from-position {
13052
+ syntax: "<length-percentage>";
13053
+ inherits: false;
13054
+ initial-value: 0%;
13055
+ }
13056
+ @property --tw-gradient-via-position {
13057
+ syntax: "<length-percentage>";
13058
+ inherits: false;
13059
+ initial-value: 50%;
13060
+ }
13061
+ @property --tw-gradient-to-position {
13062
+ syntax: "<length-percentage>";
13063
+ inherits: false;
13064
+ initial-value: 100%;
13065
+ }
12934
13066
  @property --tw-leading {
12935
13067
  syntax: "*";
12936
13068
  inherits: false;
@@ -13124,48 +13256,6 @@
13124
13256
  inherits: false;
13125
13257
  initial-value: 0;
13126
13258
  }
13127
- @property --tw-gradient-position {
13128
- syntax: "*";
13129
- inherits: false;
13130
- }
13131
- @property --tw-gradient-from {
13132
- syntax: "<color>";
13133
- inherits: false;
13134
- initial-value: #0000;
13135
- }
13136
- @property --tw-gradient-via {
13137
- syntax: "<color>";
13138
- inherits: false;
13139
- initial-value: #0000;
13140
- }
13141
- @property --tw-gradient-to {
13142
- syntax: "<color>";
13143
- inherits: false;
13144
- initial-value: #0000;
13145
- }
13146
- @property --tw-gradient-stops {
13147
- syntax: "*";
13148
- inherits: false;
13149
- }
13150
- @property --tw-gradient-via-stops {
13151
- syntax: "*";
13152
- inherits: false;
13153
- }
13154
- @property --tw-gradient-from-position {
13155
- syntax: "<length-percentage>";
13156
- inherits: false;
13157
- initial-value: 0%;
13158
- }
13159
- @property --tw-gradient-via-position {
13160
- syntax: "<length-percentage>";
13161
- inherits: false;
13162
- initial-value: 50%;
13163
- }
13164
- @property --tw-gradient-to-position {
13165
- syntax: "<length-percentage>";
13166
- inherits: false;
13167
- initial-value: 100%;
13168
- }
13169
13259
  @property --tw-backdrop-blur {
13170
13260
  syntax: "*";
13171
13261
  inherits: false;
@@ -13275,6 +13365,15 @@
13275
13365
  --tw-skew-y: initial;
13276
13366
  --tw-space-y-reverse: 0;
13277
13367
  --tw-border-style: solid;
13368
+ --tw-gradient-position: initial;
13369
+ --tw-gradient-from: #0000;
13370
+ --tw-gradient-via: #0000;
13371
+ --tw-gradient-to: #0000;
13372
+ --tw-gradient-stops: initial;
13373
+ --tw-gradient-via-stops: initial;
13374
+ --tw-gradient-from-position: 0%;
13375
+ --tw-gradient-via-position: 50%;
13376
+ --tw-gradient-to-position: 100%;
13278
13377
  --tw-leading: initial;
13279
13378
  --tw-font-weight: initial;
13280
13379
  --tw-tracking: initial;
@@ -13336,15 +13435,6 @@
13336
13435
  --tw-outline-style: solid;
13337
13436
  --tw-border-spacing-x: 0;
13338
13437
  --tw-border-spacing-y: 0;
13339
- --tw-gradient-position: initial;
13340
- --tw-gradient-from: #0000;
13341
- --tw-gradient-via: #0000;
13342
- --tw-gradient-to: #0000;
13343
- --tw-gradient-stops: initial;
13344
- --tw-gradient-via-stops: initial;
13345
- --tw-gradient-from-position: 0%;
13346
- --tw-gradient-via-position: 50%;
13347
- --tw-gradient-to-position: 100%;
13348
13438
  --tw-backdrop-blur: initial;
13349
13439
  --tw-backdrop-brightness: initial;
13350
13440
  --tw-backdrop-contrast: initial;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lindaui/tokens",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "description": "Brand design tokens (OKLCH light/dark) + HeroUI v3 + Tailwind v4 compiled into a single CSS bundle.",
5
5
  "author": "Franco Carballar <francocarballar@gmail.com>",
6
6
  "license": "MIT",