@bison-lab/tokens 0.7.0 → 0.9.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/package.json +1 -1
  2. package/css/utilities.css +0 -185
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bison-lab/tokens",
3
- "version": "0.7.0",
3
+ "version": "0.9.0",
4
4
  "description": "Design tokens, CSS custom properties, and preset files for Bison Lab component library",
5
5
  "type": "module",
6
6
  "main": "./dist/index.mjs",
package/css/utilities.css DELETED
@@ -1,185 +0,0 @@
1
- /*
2
- * Bison Lab — Decorative utility classes
3
- * Import this file alongside your theme to get common decorative patterns.
4
- */
5
-
6
- /* --- Background patterns --- */
7
-
8
- .dot-pattern {
9
- background-image: radial-gradient(circle, hsl(var(--border)) 1px, transparent 1px);
10
- background-size: 24px 24px;
11
- }
12
-
13
- .grid-pattern {
14
- background-image:
15
- linear-gradient(hsl(var(--border-subtle)) 1px, transparent 1px),
16
- linear-gradient(90deg, hsl(var(--border-subtle)) 1px, transparent 1px);
17
- background-size: 48px 48px;
18
- }
19
-
20
- .cross-pattern {
21
- background-image:
22
- repeating-linear-gradient(
23
- 45deg,
24
- hsl(var(--border-subtle)),
25
- hsl(var(--border-subtle)) 1px,
26
- transparent 1px,
27
- transparent 16px
28
- ),
29
- repeating-linear-gradient(
30
- -45deg,
31
- hsl(var(--border-subtle)),
32
- hsl(var(--border-subtle)) 1px,
33
- transparent 1px,
34
- transparent 16px
35
- );
36
- background-size: 32px 32px;
37
- }
38
-
39
- /* --- Layout overlays --- */
40
-
41
- .content-grid {
42
- background-image: repeating-linear-gradient(
43
- 90deg,
44
- hsl(var(--primary) / 0.05) 0,
45
- hsl(var(--primary) / 0.05) calc((100% - 7 * 1rem) / 8),
46
- transparent calc((100% - 7 * 1rem) / 8),
47
- transparent calc((100% - 7 * 1rem) / 8 + 1rem)
48
- );
49
- }
50
-
51
- /* --- Section tints --- */
52
-
53
- .section-tint-primary {
54
- background: linear-gradient(
55
- to bottom,
56
- hsl(var(--primary) / 0.03),
57
- hsl(var(--primary) / 0.08)
58
- );
59
- }
60
-
61
- .section-tint-secondary {
62
- background: linear-gradient(
63
- to bottom,
64
- hsl(var(--secondary) / 0.03),
65
- hsl(var(--secondary) / 0.08)
66
- );
67
- }
68
-
69
- .section-tint-accent {
70
- background: linear-gradient(
71
- to bottom,
72
- hsl(var(--brand-accent) / 0.03),
73
- hsl(var(--brand-accent) / 0.08)
74
- );
75
- }
76
-
77
- .section-tint-highlight {
78
- background: linear-gradient(
79
- to bottom,
80
- hsl(var(--highlight) / 0.03),
81
- hsl(var(--highlight) / 0.08)
82
- );
83
- }
84
-
85
- /* --- Text gradients --- */
86
-
87
- .text-gradient-primary-secondary {
88
- background: linear-gradient(
89
- 135deg,
90
- hsl(var(--primary)),
91
- hsl(var(--secondary))
92
- );
93
- -webkit-background-clip: text;
94
- background-clip: text;
95
- -webkit-text-fill-color: transparent;
96
- }
97
-
98
- .text-gradient-primary-accent {
99
- background: linear-gradient(
100
- 135deg,
101
- hsl(var(--primary)),
102
- hsl(var(--brand-accent))
103
- );
104
- -webkit-background-clip: text;
105
- background-clip: text;
106
- -webkit-text-fill-color: transparent;
107
- }
108
-
109
- .text-gradient-primary-highlight {
110
- background: linear-gradient(
111
- 135deg,
112
- hsl(var(--primary)),
113
- hsl(var(--highlight))
114
- );
115
- -webkit-background-clip: text;
116
- background-clip: text;
117
- -webkit-text-fill-color: transparent;
118
- }
119
-
120
- /* --- Typography decorations --- */
121
-
122
- .accent-serif {
123
- font-family: Georgia, "Times New Roman", serif;
124
- font-style: italic;
125
- }
126
-
127
- .deco-strike {
128
- position: relative;
129
- display: inline-block;
130
- }
131
-
132
- .deco-strike::after {
133
- content: "";
134
- position: absolute;
135
- left: -4px;
136
- right: -4px;
137
- top: 50%;
138
- height: 2px;
139
- background: linear-gradient(
140
- 90deg,
141
- hsl(var(--primary)),
142
- hsl(var(--secondary))
143
- );
144
- transform: translateY(-50%) rotate(-1deg);
145
- }
146
-
147
- /* --- Dividers --- */
148
-
149
- .section-divider {
150
- border: none;
151
- height: 2px;
152
- background: linear-gradient(
153
- 90deg,
154
- transparent,
155
- hsl(var(--primary) / 0.3),
156
- hsl(var(--secondary) / 0.3),
157
- hsl(var(--highlight) / 0.3),
158
- transparent
159
- );
160
- }
161
-
162
- /* --- Scrollbar styling --- */
163
-
164
- .scrollbar-thin {
165
- scrollbar-width: thin;
166
- scrollbar-color: hsl(var(--border)) transparent;
167
- }
168
-
169
- .scrollbar-thin::-webkit-scrollbar {
170
- width: 6px;
171
- height: 6px;
172
- }
173
-
174
- .scrollbar-thin::-webkit-scrollbar-track {
175
- background: transparent;
176
- }
177
-
178
- .scrollbar-thin::-webkit-scrollbar-thumb {
179
- background-color: hsl(var(--border));
180
- border-radius: 9999px;
181
- }
182
-
183
- .scrollbar-thin::-webkit-scrollbar-thumb:hover {
184
- background-color: hsl(var(--border-strong));
185
- }