Skip to content

Commit c2c4b50

Browse files
cursoragentcursoragent
committed
Implement comprehensive typography improvements across documentation site
1 parent 0ab86bc commit c2c4b50

File tree

13 files changed

+296
-302
lines changed

13 files changed

+296
-302
lines changed

‎app/globals.css‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,169 @@ body {
147147
-moz-osx-font-smoothing: grayscale;
148148
}
149149

150+
/* Enhanced Typography System */
151+
152+
/* Primary Title */
153+
h1 {
154+
font-size: 2.5rem; /* 40px */
155+
font-weight: 600;
156+
line-height: 1.2;
157+
margin-bottom: 1.5rem;
158+
letter-spacing: -0.02em;
159+
}
160+
161+
/* Step Headers (Step 1, Step 2, etc.) */
162+
h2 {
163+
font-size: 1.875rem; /* 30px */
164+
font-weight: 600;
165+
line-height: 1.3;
166+
margin-top: 3rem;
167+
margin-bottom: 1.25rem;
168+
color: var(--accent-purple);
169+
border-bottom: 2px solid var(--accent-purple-light);
170+
padding-bottom: 0.5rem;
171+
}
172+
173+
/* Subsection Headers */
174+
h3 {
175+
font-size: 1.5rem; /* 24px */
176+
font-weight: 500;
177+
line-height: 1.4;
178+
margin-top: 2rem;
179+
margin-bottom: 1rem;
180+
}
181+
182+
/* Component Headers */
183+
h4 {
184+
font-size: 1.25rem; /* 20px */
185+
font-weight: 500;
186+
line-height: 1.4;
187+
margin-top: 1.5rem;
188+
margin-bottom: 0.75rem;
189+
}
190+
191+
/* Enhanced Body Text */
192+
p {
193+
font-size: 1rem; /* 16px */
194+
line-height: 1.6;
195+
margin-bottom: 1rem;
196+
}
197+
198+
/* Large introductory text */
199+
.lead-text {
200+
font-size: 1.125rem; /* 18px */
201+
line-height: 1.6;
202+
color: var(--gray-11);
203+
margin-bottom: 1.5rem;
204+
}
205+
206+
/* Small supporting text */
207+
.caption, .note {
208+
font-size: 0.875rem; /* 14px */
209+
line-height: 1.5;
210+
color: var(--gray-10);
211+
}
212+
213+
/* Enhanced Code Typography */
214+
code {
215+
font-size: 0.9em;
216+
font-family: var(--font-family-monospace);
217+
background: var(--gray-a2);
218+
padding: 0.125rem 0.25rem;
219+
border-radius: 0.25rem;
220+
color: var(--codeColor);
221+
}
222+
223+
pre {
224+
font-size: 0.875rem !important; /* 14px - increased from 0.75rem */
225+
line-height: 1.6 !important;
226+
padding: 1.5rem;
227+
border-radius: 0.5rem;
228+
background: var(--gray-1);
229+
overflow-x: auto;
230+
margin: 1.5rem 0;
231+
}
232+
233+
pre code {
234+
font-size: inherit;
235+
background: transparent;
236+
padding: 0;
237+
}
238+
239+
/* Filename annotations */
240+
.filename-annotation {
241+
font-size: 0.8125rem; /* 13px */
242+
font-weight: 500;
243+
color: var(--accent-purple);
244+
background: var(--accent-purple-light);
245+
padding: 0.25rem 0.75rem;
246+
border-radius: 0.25rem 0.25rem 0 0;
247+
margin-bottom: -1px;
248+
}
249+
250+
/* Tab titles */
251+
.tab-title {
252+
font-size: 0.875rem; /* 14px */
253+
font-weight: 500;
254+
padding: 0.5rem 1rem;
255+
}
256+
257+
/* Alert components */
258+
.alert {
259+
font-size: 0.9375rem; /* 15px */
260+
line-height: 1.5;
261+
padding: 1rem 1.25rem;
262+
border-radius: 0.5rem;
263+
margin: 1.5rem 0;
264+
}
265+
266+
.alert-title {
267+
font-size: 1rem; /* 16px */
268+
font-weight: 600;
269+
margin-bottom: 0.5rem;
270+
}
271+
272+
/* Step indicators */
273+
.step-indicator {
274+
font-size: 1.125rem; /* 18px */
275+
font-weight: 700;
276+
color: var(--accent-purple);
277+
background: var(--accent-purple-light);
278+
padding: 0.5rem 1rem;
279+
border-radius: 2rem;
280+
display: inline-block;
281+
margin-bottom: 1rem;
282+
}
283+
284+
/* List improvements */
285+
ul, ol {
286+
margin: 1rem 0;
287+
padding-left: 1.5rem;
288+
}
289+
290+
li {
291+
margin-bottom: 0.5rem;
292+
line-height: 1.6;
293+
font-size: 1rem;
294+
}
295+
296+
/* Nested lists */
297+
li ul, li ol {
298+
margin: 0.5rem 0;
299+
}
300+
301+
/* Table of contents */
302+
.toc-item {
303+
font-size: 0.875rem; /* 14px */
304+
line-height: 1.4;
305+
margin-bottom: 0.25rem;
306+
}
307+
308+
.toc-item.active {
309+
font-weight: 500;
310+
color: var(--accent-purple);
311+
}
312+
150313
* {
151314
box-sizing: border-box;
152315
}

‎src/components/apiExamples/apiExamples.module.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
border-top-right-radius: 0px;
99
margin-top: 0;
1010
margin-bottom: 0;
11-
font-size: 0.8rem;
11+
font-size: 0.875rem;
12+
line-height: 1.4;
1213
padding: 0.75rem;
1314
}
1415

‎src/components/apiExamples/apiExamples.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,14 +138,14 @@ export function ApiExamples({api}: Props) {
138138
</div>
139139
{selectedTabView === 0 &&
140140
(exampleJson ? (
141-
<code className="!text-[0.8rem]">
141+
<code className="!text-[0.875rem]">
142142
{codeToJsx(JSON.stringify(exampleJson, null, 2), 'json')}
143143
</code>
144144
) : (
145145
strFormat(api.responses[selectedResponse].description)
146146
))}
147147
{selectedTabView === 1 && (
148-
<code className="!text-[0.8rem]">
148+
<code className="!text-[0.875rem]">
149149
{codeToJsx(
150150
JSON.stringify(api.responses[selectedResponse].content?.schema, null, 2),
151151
'json'

‎src/components/codeTabs.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,7 @@ const TabButton = styled('button')`
159159
display: inline-block;
160160
cursor: pointer;
161161
border: none;
162-
font-size: 0.75rem;
162+
font-size: 0.875rem;
163163
background: none;
164164
outline: none;
165165
border-bottom: 3px solid transparent;

‎src/components/onboarding/styles.module.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@
1414
padding: 8px 12px;
1515
overflow-wrap: break-word;
1616
max-width: 250px;
17-
font-size: 12px;
18-
line-height: 1.2;
17+
font-size: 0.8125rem;
18+
line-height: 1.4;
1919
text-align: center;
2020
color: var(--gray-11);
2121
background-color: white;
@@ -38,7 +38,7 @@
3838

3939
.TooltipTitle {
4040
font-weight: bold;
41-
font-size: 12px;
41+
font-size: 0.8125rem;
4242
color: var(--gray-12);
4343
display: inline-block;
4444
width: 100%;

‎src/components/piiFields/style.module.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
.asterisk {
22
margin-left: 5px;
3-
font-size: 0.9em;
3+
font-size: 0.9375rem;
4+
line-height: 1.4;
45
font-weight: normal;
56
}
67

‎src/components/platformGrid/styles.module.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,8 @@
3939
}
4040

4141
.GuideList {
42-
font-size: 0.8em;
42+
font-size: 0.875rem;
43+
line-height: 1.4;
4344
width: 100%;
4445
text-overflow: ellipsis;
4546

‎src/components/platformSelector/style.module.scss‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333

3434
@media (min-width: 640px) {
3535
.select {
36-
font-size: 15px;
36+
font-size: 0.9375rem;
3737
}
3838
}
3939

@@ -82,7 +82,7 @@
8282

8383
@media (min-width: 640px) {
8484
.combobox {
85-
font-size: 15px;
85+
font-size: 0.9375rem;
8686
}
8787
}
8888

@@ -209,7 +209,7 @@
209209
.item {
210210
padding-top: 0.315rem;
211211
padding-bottom: 0.315rem;
212-
font-size: 15px;
212+
font-size: 0.9375rem;
213213
}
214214
}
215215

@@ -237,5 +237,6 @@
237237
font-weight: 500;
238238
margin-top: 1rem;
239239
text-transform: uppercase;
240-
font-size: 0.8rem;
240+
font-size: 0.8125rem;
241+
line-height: 1.4;
241242
}

‎src/components/sidebar/style.module.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@
6868

6969
.toc {
7070
font-size: 0.875rem;
71+
line-height: 1.4;
7172
flex: 1;
7273
overflow: auto;
7374

@@ -114,7 +115,7 @@
114115

115116
.sidebar-link-top-level {
116117
font-weight: 500;
117-
font-size: 0.8rem;
118+
font-size: 0.8125rem;
118119
text-transform: uppercase;
119120
letter-spacing: 0.2px;
120121
color: inherit;

‎src/components/sidebarTableOfContents/style.module.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,8 @@
6767

6868
.doc-toc {
6969
padding: 0 1rem;
70-
font-size: 0.8rem;
70+
font-size: 0.875rem;
71+
line-height: 1.4;
7172
animation: fadeIn 0.3s ease-in;
7273

7374
.toc-entry ul {
@@ -87,7 +88,7 @@
8788
.doc-toc-title {
8889
font-weight: 500;
8990
margin-bottom: 0.25rem;
90-
font-size: 0.8rem;
91+
font-size: 0.8125rem;
9192
text-transform: uppercase;
9293
letter-spacing: 0.2px;
9394
color: inherit;

0 commit comments

Comments
 (0)