-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathcss.go
More file actions
197 lines (190 loc) · 5.61 KB
/
Copy pathcss.go
File metadata and controls
197 lines (190 loc) · 5.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
//go:build !wasm
package css
func RootCSS() *Stylesheet {
return NewStylesheet(
Root(
// Brand group
Declare(ColorPrimary, "#00ADD8"),
Declare(ColorOnPrimary, "#1C1C1E"),
Declare(ColorSecondary, "#654FF0"),
Declare(ColorOnSecondary, "#FFFFFF"),
Declare(ColorSuccess, "#3FB950"),
Declare(ColorError, "#E34F26"),
),
Root(
// Theme group
Declare(ColorBackgroundLight, "#FFFFFF"),
Declare(ColorBackgroundDark, "#0D1117"),
Declare(ColorSurfaceLight, "#F2F2F7"),
Declare(ColorSurfaceDark, "#161B22"),
Declare(ColorOnSurfaceLight, "#1C1C1E"),
Declare(ColorOnSurfaceDark, "#E6EDF3"),
Declare(ColorMutedLight, "#6E6E73"),
Declare(ColorMutedDark, "#8B949E"),
Declare(ColorHoverLight, "#B8860B"),
Declare(ColorHoverDark, "#F7DF1E"),
),
Root(
// Typography scale
Declare(TextXs, "0.75rem"),
Declare(TextSm, "0.875rem"),
Declare(TextBase, "1rem"),
Declare(TextLg, "1.25rem"),
Declare(TextXl, "1.5rem"),
Declare(Text2xl, "2rem"),
),
Root(
// Spacing scale
Declare(Space1, "0.25rem"),
Declare(Space2, "0.5rem"),
Declare(Space3, "0.75rem"),
Declare(Space4, "1rem"),
Declare(Space6, "1.5rem"),
Declare(Space8, "2rem"),
Declare(Space12, "3rem"),
),
Root(
// Border-radius scale
Declare(RadiusSm, "4px"),
Declare(RadiusMd, "8px"),
Declare(RadiusLg, "16px"),
Declare(RadiusFull, "9999px"),
),
Root(
// Typography
Declare(LeadingTight, "1.25"),
Declare(LeadingNormal, "1.5"),
Declare(LeadingRelaxed, "1.75"),
Declare(FontWeightRegular, "400"),
Declare(FontWeightMedium, "500"),
Declare(FontWeightBold, "700"),
Declare(TrackingTight, "-0.02em"),
Declare(TrackingNormal, "0"),
Declare(TrackingWide, "0.05em"),
),
Root(
// Elevation
Declare(ShadowSm, "0 1px 2px rgba(0, 0, 0, 0.05)"),
Declare(ShadowMd, "0 4px 6px rgba(0, 0, 0, 0.10)"),
Declare(ShadowLg, "0 10px 15px rgba(0, 0, 0, 0.10)"),
Declare(ShadowXl, "0 20px 25px rgba(0, 0, 0, 0.15)"),
),
Root(
// Motion
Declare(DurationFast, "150ms"),
Declare(DurationBase, "250ms"),
Declare(DurationSlow, "400ms"),
Declare(EaseIn, "cubic-bezier(0.4, 0, 1, 1)"),
Declare(EaseOut, "cubic-bezier(0, 0, 0.2, 1)"),
Declare(EaseInOut, "cubic-bezier(0.4, 0, 0.2, 1)"),
),
Root(
// Z-index
Declare(ZBase, "0"),
Declare(ZDropdown, "100"),
Declare(ZSticky, "200"),
Declare(ZModal, "300"),
Declare(ZToast, "400"),
Declare(ZTooltip, "500"),
),
Root(
// Breakpoints
Declare(BpSm, "640px"),
Declare(BpMd, "768px"),
Declare(BpLg, "1024px"),
Declare(BpXl, "1280px"),
),
Root(
// Container widths
Declare(MaxWProse, "65ch"),
Declare(MaxWContent, "1200px"),
Declare(MaxWScreen, "1440px"),
),
)
}
func RenderCSS() *Stylesheet {
return NewStylesheet(
Rule(Selector("*, *::before, *::after"),
BoxSizing(Str("border-box")),
),
Rule(Selector("html"),
RawRule(" -webkit-text-size-adjust: 100%;\n text-size-adjust: 100%;"),
),
Rule(Selector("body"),
Margin(Zero),
FontFamily(Str("system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif")),
FontSize(TextBase),
LineHeight(LeadingNormal),
Color(ColorOnSurface),
Background(ColorBackground),
),
Rule(Selector(":focus-visible"),
Outline(Str("2px solid " + ColorPrimary.Var())),
OutlineOffset(Px(2)),
),
Rule(Selector("img, svg, video"),
Display(Block),
MaxWidth(Pct(100)),
),
Root(
Bind(ColorBackground, ColorBackgroundLight),
Bind(ColorSurface, ColorSurfaceLight),
Bind(ColorOnSurface, ColorOnSurfaceLight),
Bind(ColorMuted, ColorMutedLight),
Bind(ColorHover, ColorHoverLight),
),
MediaPrefersDark(
Root(
Bind(ColorBackground, ColorBackgroundDark),
Bind(ColorSurface, ColorSurfaceDark),
Bind(ColorOnSurface, ColorOnSurfaceDark),
Bind(ColorMuted, ColorMutedDark),
Bind(ColorHover, ColorHoverDark),
),
),
// Explicit theme override via the [data-theme] attribute (set by a theme
// toggle on <html>). These come after the :root/@media defaults and have
// higher specificity, so a manual choice wins over the OS preference.
// Removing the attribute (ThemeAuto) falls back to the @media query above.
Rule(Selector("[data-theme=\"light\"]"),
Bind(ColorBackground, ColorBackgroundLight),
Bind(ColorSurface, ColorSurfaceLight),
Bind(ColorOnSurface, ColorOnSurfaceLight),
Bind(ColorMuted, ColorMutedLight),
Bind(ColorHover, ColorHoverLight),
),
Rule(Selector("[data-theme=\"dark\"]"),
Bind(ColorBackground, ColorBackgroundDark),
Bind(ColorSurface, ColorSurfaceDark),
Bind(ColorOnSurface, ColorOnSurfaceDark),
Bind(ColorMuted, ColorMutedDark),
Bind(ColorHover, ColorHoverDark),
),
)
}
// Override es el cambio de valor de UN token. Campos no exportados: solo Set lo construye.
type Override struct {
token Token
value string
}
// Set declara el override de un token del catálogo. Token tipado (no un nombre libre);
// value es el borde de I/O.
func Set(t Token, value string) Override { return Override{t, value} }
// Theme devuelve el catálogo :root COMPLETO (como RootCSS) con los overrides al final.
// Pensado como el RootCSS() del proyecto raíz — assetmin REEMPLAZA el :root de css por el de
// la app, por eso trae el catálogo entero, no solo los overrides.
func Theme(overrides ...Override) *Stylesheet {
root := RootCSS() // catálogo por defecto
if len(overrides) == 0 {
return root
}
decls := make([]Decl, len(overrides))
for i, o := range overrides {
decls[i] = Declare(o.token, o.value)
}
return withRootTail(root, Root(decls...))
}
func withRootTail(s *Stylesheet, it item) *Stylesheet {
s.items = append(s.items, it)
return s
}