Skip to content

Commit fc6dbdd

Browse files
cxraminajoannalyeknagurski
authored
Feature/add tokens (harness#1112)
* Test design tokens push from Figma to Git * added container paddings for breakpoints * typography settings update * typography structure update * global typography font-weight and style value update * breakpont font size gradation add (without value) * desktop font size update * viewport updates * desktop typography structure update * desktop typography naming update * typography desktop settings update * desktop typography update * typography global update * data typography update * display font update * typography update * line-height update * line-height update * line-height update * radius update * colors update * colors update * colors update * colors update * colors update * typography naming update * radius update * added height and width list (empty for now) * hight desktop update * btn update * sizing update * sizing update * btn update * btn update * structure update * btn update * dark color upd * colors update * renaming * renaming * renaming * renaming * update caption base & subtle line height to 16px * light colors update * light colors update * border rename * size update * upd * color update * token upd * color upd * palette upd * palette upd * green upd * orange and green upd * indigo upd * orange upd * purple upd * accent upd * green upd * gray upd * colors upd * adding leading-none, updates to pipeline card * rename * update labels line height * colors upd * token rename * red upd * red upd * colors upd * colors update * token upd * color upd * upd * typography upd * fix * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * updt * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * Upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * upd * update icon size * update icons previous change not updated * icons * icn upd * icn upd * icn upd * icn upd * icn upd * upd * color update * rename iconWidth to iconStrokeWidth for more clarity * tokens push from figma to repo * remove gitness version of tokens --------- Co-authored-by: Joanna <[email protected]> Co-authored-by: Kevin Nagurski <[email protected]>
1 parent e83daff commit fc6dbdd

File tree

14 files changed

+6908
-1
lines changed

14 files changed

+6908
-1
lines changed

‎apps/gitness/src/design-tokens/README.md‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎packages/ui/design-tokens/$metadata.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"tokenSetOrder": [
3+
"primitives/colors",
4+
"primitives/typography",
5+
"primitives/dimensions",
6+
"primitives/icon",
7+
"theme/dark",
8+
"theme/light",
9+
"breakpoint/desktop",
10+
"components/desktop/base/button",
11+
"components/desktop/base/input",
12+
"components/desktop/base/dropdown menu",
13+
"components/desktop/feature/pipline"
14+
]
15+
}

‎packages/ui/design-tokens/$themes.json‎

Lines changed: 1653 additions & 0 deletions
Large diffs are not rendered by default.

‎packages/ui/design-tokens/breakpoint/desktop.json‎

Lines changed: 371 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,371 @@
1+
{
2+
"breakpoint": {
3+
"viewport": {
4+
"$type": "number",
5+
"$value": "1440"
6+
},
7+
"viewport-min": {
8+
"$type": "number",
9+
"$value": "1080"
10+
},
11+
"viewport-max": {
12+
"$type": "number",
13+
"$value": "1919"
14+
},
15+
"container": {
16+
"$type": "number",
17+
"$value": "{spacing.8}"
18+
}
19+
},
20+
"display": {
21+
"large": {
22+
"$type": "typography",
23+
"$value": {
24+
"fontFamily": "{font-family.default}",
25+
"fontWeight": "{font-weight.default.normal.500}",
26+
"fontSize": "{text.5xl}",
27+
"letterSpacing": "{tracking.tight}",
28+
"textCase": "{text-case.none}",
29+
"lineHeight": "{leading.5xl.tight}"
30+
},
31+
"$description": "Large headlines with extra emphasis."
32+
},
33+
"base": {
34+
"$type": "typography",
35+
"$value": {
36+
"fontFamily": "{font-family.default}",
37+
"fontWeight": "{font-weight.default.normal.400}",
38+
"fontSize": "{text.3xl}",
39+
"letterSpacing": "{tracking.tight}",
40+
"textCase": "{text-case.none}",
41+
"lineHeight": "{leading.3xl.tight}"
42+
},
43+
"$description": "Large headlines, hero sections."
44+
}
45+
},
46+
"title": {
47+
"large": {
48+
"$type": "typography",
49+
"$value": {
50+
"fontFamily": "{font-family.default}",
51+
"fontWeight": "{font-weight.default.normal.500}",
52+
"fontSize": "{text.2xl}",
53+
"lineHeight": "{leading.2xl.tight}",
54+
"letterSpacing": "{tracking.normal}"
55+
},
56+
"$description": "Emphasized section headers."
57+
},
58+
"base": {
59+
"$type": "typography",
60+
"$value": {
61+
"fontFamily": "{font-family.default}",
62+
"fontWeight": "{font-weight.default.normal.500}",
63+
"fontSize": "{text.base}",
64+
"lineHeight": "{leading.base.tight}",
65+
"letterSpacing": "{tracking.normal}"
66+
},
67+
"$description": "Section headers."
68+
}
69+
},
70+
"body": {
71+
"leading-none": {
72+
"default": {
73+
"$type": "typography",
74+
"$value": {
75+
"fontFamily": "{font-family.default}",
76+
"fontWeight": "{font-weight.default.normal.400}",
77+
"fontSize": "{text.sm}",
78+
"lineHeight": "{leading.sm.none}",
79+
"letterSpacing": "{tracking.normal}"
80+
},
81+
"$description": "Primary text style for UI and content."
82+
},
83+
"accent": {
84+
"$type": "typography",
85+
"$value": {
86+
"fontFamily": "{font-family.default}",
87+
"fontWeight": "{font-weight.default.normal.500}",
88+
"fontSize": "{text.sm}",
89+
"lineHeight": "{leading.sm.none}",
90+
"letterSpacing": "{tracking.normal}"
91+
}
92+
}
93+
},
94+
"leading-tight": {
95+
"default": {
96+
"$type": "typography",
97+
"$value": {
98+
"fontFamily": "{font-family.default}",
99+
"fontWeight": "{font-weight.default.normal.400}",
100+
"fontSize": "{text.sm}",
101+
"lineHeight": "{leading.sm.tight}",
102+
"letterSpacing": "{tracking.normal}"
103+
},
104+
"$description": "Primary text style for UI and content."
105+
},
106+
"accent": {
107+
"$type": "typography",
108+
"$value": {
109+
"fontFamily": "{font-family.default}",
110+
"fontWeight": "{font-weight.default.normal.500}",
111+
"fontSize": "{text.sm}",
112+
"lineHeight": "{leading.sm.tight}",
113+
"letterSpacing": "{tracking.normal}"
114+
}
115+
}
116+
},
117+
"leading-snug": {
118+
"default": {
119+
"$type": "typography",
120+
"$value": {
121+
"fontFamily": "{font-family.default}",
122+
"fontWeight": "{font-weight.default.normal.400}",
123+
"fontSize": "{text.sm}",
124+
"lineHeight": "{leading.sm.snug}",
125+
"letterSpacing": "{tracking.normal}"
126+
},
127+
"$description": "Primary text style for UI and content."
128+
},
129+
"accent": {
130+
"$type": "typography",
131+
"$value": {
132+
"fontFamily": "{font-family.default}",
133+
"fontWeight": "{font-weight.default.normal.500}",
134+
"fontSize": "{text.sm}",
135+
"lineHeight": "{leading.sm.snug}",
136+
"letterSpacing": "{tracking.normal}"
137+
},
138+
"$description": "Primary text style for UI and content."
139+
}
140+
},
141+
"leading-normal": {
142+
"subtle": {
143+
"$type": "typography",
144+
"$value": {
145+
"fontFamily": "{font-family.default}",
146+
"fontWeight": "{font-weight.default.normal.300}",
147+
"lineHeight": "{leading.sm.normal}",
148+
"letterSpacing": "{tracking.normal}",
149+
"fontSize": "{text.sm}"
150+
},
151+
"$description": "De-emphasized body text, secondary information."
152+
},
153+
"default": {
154+
"$type": "typography",
155+
"$value": {
156+
"fontFamily": "{font-family.default}",
157+
"fontWeight": "{font-weight.default.normal.400}",
158+
"fontSize": "{text.sm}",
159+
"lineHeight": "{leading.sm.normal}",
160+
"letterSpacing": "{tracking.normal}"
161+
},
162+
"$description": "Primary text style for UI and content."
163+
},
164+
"accent": {
165+
"$type": "typography",
166+
"$value": {
167+
"fontFamily": "{font-family.default}",
168+
"fontWeight": "{font-weight.default.normal.500}",
169+
"lineHeight": "{leading.sm.normal}",
170+
"letterSpacing": "{tracking.tight}",
171+
"fontSize": "{text.sm}"
172+
},
173+
"$description": "Emphasized body text for important information."
174+
},
175+
"strong": {
176+
"$type": "typography",
177+
"$value": {
178+
"fontFamily": "{font-family.default}",
179+
"fontWeight": "{font-weight.default.normal.600}",
180+
"fontSize": "{text.sm}",
181+
"lineHeight": "{leading.sm.normal}",
182+
"letterSpacing": "{tracking.normal}"
183+
},
184+
"$description": "Strongly emphasized body text for high importance."
185+
}
186+
},
187+
"leading-relaxed": {
188+
"subtle": {
189+
"$type": "typography",
190+
"$value": {
191+
"fontFamily": "{font-family.default}",
192+
"fontWeight": "{font-weight.default.normal.300}",
193+
"lineHeight": "{leading.sm.relaxed}",
194+
"letterSpacing": "{tracking.normal}",
195+
"fontSize": "{text.sm}"
196+
},
197+
"$description": "De-emphasized body text, secondary information."
198+
},
199+
"default": {
200+
"$type": "typography",
201+
"$value": {
202+
"fontFamily": "{font-family.default}",
203+
"fontWeight": "{font-weight.default.normal.400}",
204+
"fontSize": "{text.sm}",
205+
"lineHeight": "{leading.sm.relaxed}",
206+
"letterSpacing": "{tracking.normal}"
207+
},
208+
"$description": "Primary text style for UI and content."
209+
},
210+
"accent": {
211+
"$type": "typography",
212+
"$value": {
213+
"fontFamily": "{font-family.default}",
214+
"fontWeight": "{font-weight.default.normal.500}",
215+
"lineHeight": "{leading.sm.relaxed}",
216+
"letterSpacing": "{tracking.tight}",
217+
"fontSize": "{text.sm}"
218+
},
219+
"$description": "Emphasized body text for important information."
220+
},
221+
"strong": {
222+
"$type": "typography",
223+
"$value": {
224+
"fontFamily": "{font-family.default}",
225+
"fontWeight": "{font-weight.default.normal.600}",
226+
"fontSize": "{text.sm}",
227+
"lineHeight": "{leading.sm.relaxed}",
228+
"letterSpacing": "{tracking.normal}"
229+
},
230+
"$description": "Strongly emphasized body text for high importance."
231+
}
232+
}
233+
},
234+
"caption": {
235+
"leading-none": {
236+
"default": {
237+
"$type": "typography",
238+
"$value": {
239+
"fontFamily": "{font-family.default}",
240+
"fontWeight": "{font-weight.default.normal.500}",
241+
"fontSize": "{text.xs}",
242+
"lineHeight": "{leading.xs.none}",
243+
"letterSpacing": "{tracking.normal}"
244+
},
245+
"$description": "Primary caption style, small but important text."
246+
},
247+
"subtle": {
248+
"$type": "typography",
249+
"$value": {
250+
"fontFamily": "{font-family.default}",
251+
"fontWeight": "{font-weight.default.normal.400}",
252+
"fontSize": "{text.xs}",
253+
"lineHeight": "{leading.xs.none}",
254+
"letterSpacing": "{tracking.normal}"
255+
},
256+
"$description": "Helper text, meta information."
257+
}
258+
},
259+
"leading-snug": {
260+
"default": {
261+
"$type": "typography",
262+
"$value": {
263+
"fontFamily": "{font-family.default}",
264+
"fontWeight": "{font-weight.default.normal.500}",
265+
"fontSize": "{text.xs}",
266+
"lineHeight": "{leading.xs.snug}",
267+
"letterSpacing": "{tracking.normal}"
268+
},
269+
"$description": "Primary caption style, small but important text."
270+
},
271+
"subtle": {
272+
"$type": "typography",
273+
"$value": {
274+
"fontFamily": "{font-family.default}",
275+
"fontWeight": "{font-weight.default.normal.400}",
276+
"fontSize": "{text.xs}",
277+
"lineHeight": "{leading.xs.snug}",
278+
"letterSpacing": "{tracking.normal}"
279+
},
280+
"$description": "Helper text, meta information."
281+
}
282+
}
283+
},
284+
"code": {
285+
"base": {
286+
"$type": "typography",
287+
"$value": {
288+
"fontFamily": "{font-family.mono}",
289+
"fontWeight": "{font-weight.default.normal.400}",
290+
"fontSize": "{text.sm}",
291+
"lineHeight": "{leading.sm.normal}",
292+
"letterSpacing": "{tracking.tight}"
293+
},
294+
"$description": "Code blocks and larger code snippets."
295+
}
296+
},
297+
"component": {
298+
"markdown-editor": {
299+
"title": {
300+
"h1": {
301+
"$type": "typography",
302+
"$value": {
303+
"fontFamily": "{font-family.default}",
304+
"fontWeight": "{font-weight.default.normal.600}",
305+
"fontSize": "{text.3xl}",
306+
"lineHeight": "{leading.3xl.normal}",
307+
"letterSpacing": "{tracking.tight}"
308+
},
309+
"$description": "Article main heading."
310+
},
311+
"h2": {
312+
"$type": "typography",
313+
"$value": {
314+
"fontFamily": "{font-family.default}",
315+
"fontWeight": "{font-weight.default.normal.600}",
316+
"fontSize": "{text.2xl}",
317+
"lineHeight": "{leading.2xl.normal}",
318+
"letterSpacing": "{tracking.tight}"
319+
},
320+
"$description": "Article section heading."
321+
},
322+
"h3": {
323+
"$type": "typography",
324+
"$value": {
325+
"fontFamily": "{font-family.default}",
326+
"fontWeight": "{font-weight.default.normal.600}",
327+
"fontSize": "{text.base}",
328+
"lineHeight": "{leading.base.normal}",
329+
"letterSpacing": "{tracking.normal}"
330+
},
331+
"$description": "Article subsection heading."
332+
}
333+
},
334+
"content": {
335+
"lead": {
336+
"$type": "typography",
337+
"$value": {
338+
"fontFamily": "{font-family.default}",
339+
"fontWeight": "{font-weight.default.normal.400}",
340+
"fontSize": "{text.xl}",
341+
"lineHeight": "{leading.xl.normal}",
342+
"letterSpacing": "{tracking.tight}"
343+
},
344+
"$description": "Article introduction paragraph."
345+
},
346+
"paragraph": {
347+
"$type": "typography",
348+
"$value": {
349+
"fontFamily": "{font-family.default}",
350+
"fontWeight": "{font-weight.default.normal.400}",
351+
"fontSize": "{text.base}",
352+
"lineHeight": "{leading.base.relaxed}",
353+
"letterSpacing": "{tracking.normal}"
354+
},
355+
"$description": "Article paragraph text."
356+
},
357+
"emphasized": {
358+
"$type": "typography",
359+
"$value": {
360+
"fontFamily": "{font-family.default}",
361+
"fontWeight": "{font-weight.default.normal.500}",
362+
"fontSize": "{text.base}",
363+
"lineHeight": "{leading.base.relaxed}",
364+
"letterSpacing": "{tracking.tight}"
365+
},
366+
"$description": "Emphasized paragraph text."
367+
}
368+
}
369+
}
370+
}
371+
}

0 commit comments

Comments
 (0)