Skip to content

Commit c504407

Browse files
authored
chore: fix styles on typedoc generated API reference pages (#2148)
Fixes `font-size`-related rendering bugs. Follows https://crawlee.dev/js/api as the original source of visual style. |before|after| |---|---| |<img width="1460" height="1211" alt="image" src="https://github.com/user-attachments/assets/48267e7d-c32d-439e-b455-c1c5f4f6a203" />| <img width="1460" height="1211" alt="image" src="https://github.com/user-attachments/assets/7cc9d0fd-f4ff-4b6c-a0ee-ebcd0d1ae027" /> | Closes apify/apify-sdk-js#531 <!-- CURSOR_SUMMARY --> --- > [!NOTE] > Adjusts fonts, heading sizes, and TypeDoc spacing; adds `Lota Grotesque` font for headings to fix API reference typography. > > - **CSS (apify-docs-theme/src/theme/custom.css)**: > - **Typography**: Set `--ifm-heading-font-family` to `Lota Grotesque`; added `@font-face` for `Lota Grotesque`. > - **TypeDoc layout**: Introduced `--tsd-spacing-*` variables; tuned `.tsd-flag-group` margin and `.tsd-comment` spacing. > - **Headings**: Added explicit sizes for `.apiItemContainer h2–h5`; refined Markdown heading size variables. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 1403943. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY -->
1 parent f724f41 commit c504407

File tree

1 file changed

+38
-7
lines changed

1 file changed

+38
-7
lines changed

apify-docs-theme/src/theme/custom.css

Lines changed: 38 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -126,12 +126,15 @@ html[data-theme='dark'] {
126126

127127
:root {
128128
/* use default system font based on https://devhints.io/css-system-font-stack */
129-
--ifm-font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI',
130-
'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
131-
'Helvetica Neue', sans-serif;
132-
--ifm-heading-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
133-
'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
134-
'Helvetica Neue', sans-serif;
129+
--ifm-font-family-base:
130+
-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
131+
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
132+
sans-serif;
133+
--ifm-heading-font-family: 'Lota Grotesque', sans-serif;
134+
--tsd-spacing-vertical: 1.2rem !important;
135+
--tsd-spacing-horizontal: 1.6rem !important;
136+
--ifm-list-item-margin: 0.4rem !important;
137+
--ifm-list-left-padding: 3.2rem !important;
135138
--ifm-font-weight-semibold: 600;
136139
--ifm-font-color-base: #242736;
137140

@@ -286,6 +289,34 @@ html[data-theme='dark'] {
286289
--button-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
287290
}
288291

292+
@font-face {
293+
font-family: 'Lota Grotesque';
294+
src:
295+
url('/font/lota.woff2') format('woff2'),
296+
url('/font/lota.woff') format('woff');
297+
font-weight: 600;
298+
}
299+
300+
.apiItemContainer h2 {
301+
font-size: 2.4rem;
302+
}
303+
304+
.apiItemContainer h3 {
305+
font-size: 2rem;
306+
}
307+
308+
.apiItemContainer h4 {
309+
font-size: 1.6rem;
310+
}
311+
312+
.apiItemContainer h5 {
313+
font-size: 1.4rem;
314+
}
315+
316+
.tsd-comment {
317+
margin-bottom: var(--tsd-spacing-vertical);
318+
}
319+
289320
.markdown h1,
290321
.markdown h2,
291322
.markdown h3,
@@ -621,7 +652,7 @@ article .card h2 {
621652
}
622653

623654
.tsd-panel-header .tsd-flag-group {
624-
margin-right: .5rem;
655+
margin-right: .8rem;
625656
margin-left: .5rem;
626657
}
627658

0 commit comments

Comments
 (0)