Skip to content

Documentation font changes #2139

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 12 commits into from
Aug 20, 2024
Merged

Documentation font changes #2139

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
a14f460
branding changes
CobusT Aug 18, 2024
66793e7
removed 'Enterprise' link from footer
CobusT Aug 18, 2024
478eb66
css tweaks
CobusT Aug 19, 2024
c399812
Fixed color of button text on main page.
CobusT Aug 19, 2024
071e9a1
Use Vitepress headers for faster font loading
Fil Aug 20, 2024
c43d1ca
normalize hex color to lowercase
Fil Aug 20, 2024
fea6505
scope a.button to .promo, to remove an !important
Fil Aug 20, 2024
51b4cbd
base
Fil Aug 20, 2024
3188d48
fixed h1 heading font and removed h1 margin
CobusT Aug 20, 2024
4bf2930
revert the change to vp-font-family-base
Fil Aug 20, 2024
4b0cc91
rename base classes
Fil Aug 20, 2024
101be38
merged 2 root sections of css
CobusT Aug 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions docs/.vitepress/config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,9 @@ export default defineConfig({
}
},
head: [
["link", {rel: "preconnect", href: "https://fonts.gstatic.com", crossorigin: ""}],
["link", {rel: "preload", as: "style", href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"}],
["link", {rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"}],
["link", {rel: "apple-touch-icon", href: "https://static.observablehq.com/favicon-512.0667824687f99c942a02e06e2db1a060911da0bf3606671676a255b1cf97b4fe.png"}],
["link", {rel: "icon", type: "image/png", href: "https://static.observablehq.com/favicon-512.0667824687f99c942a02e06e2db1a060911da0bf3606671676a255b1cf97b4fe.png", sizes: "512x512"}],
["script", {async: "", src: "https://www.googletagmanager.com/gtag/js?id=G-9B88TP6PKQ"}],
Expand Down
1 change: 0 additions & 1 deletion docs/.vitepress/theme/CustomFooter.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,6 @@
<li class="mb2"><a target="_blank" href="https://observablehq.com/plot">Plot</a></li>
<li class="mb2"><a target="_blank" href="https://observablehq.com/data-integrations">Integrations</a></li>
<li class="mb2"><a target="_blank" href="https://observablehq.com/pricing">Pricing</a></li>
<li class="mb2"><a target="_blank" href="https://observablehq.com/enterprise">Enterprise</a></li>
</ul>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion docs/.vitepress/theme/ObservablePromo.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ h1 {
opacity: 0.7;
}

a.button {
.promo a.button {
display: inline-block;
border: 1px solid transparent;
text-align: center;
Expand Down
35 changes: 25 additions & 10 deletions docs/.vitepress/theme/custom.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,25 +3,40 @@
--vp-c-purple-2: #7f42cd;
--vp-c-purple-3: #9555e2;
--vp-c-purple-soft: rgba(155, 91, 233, 0.14);
--vp-c-red: #f43f5e;
--vp-c-green: #10b981;
--vp-c-blue: #0092ff;
--vp-c-purple: #a463f2;
--vp-c-brand-1: var(--vp-c-purple-1);
--vp-c-brand-2: var(--vp-c-purple-2);
--vp-c-brand-3: var(--vp-c-purple-3);
--vp-c-brand-soft: var(--vp-c-purple-soft);
--vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu,
roboto, noto, "segoe ui", arial, sans-serif;
--sans-text: Inter, var(--vp-font-family-base);
--mono-heading: "Spline Sans Mono", monospace;
}

.dark {
--vp-c-purple-1: #db96ff;
--vp-c-purple-2: #9a5ae8;
--vp-c-purple-3: #884ad6;
--vp-c-purple-soft: rgba(155, 91, 233, 0.16);
--vp-c-text-1: #f5f5f5;
}

:root {
--vp-c-red: #f43f5e;
--vp-c-green: #10b981;
--vp-c-blue: #0092ff;
--vp-c-purple: #a463f2;
--vp-c-brand-1: var(--vp-c-purple-1);
--vp-c-brand-2: var(--vp-c-purple-2);
--vp-c-brand-3: var(--vp-c-purple-3);
--vp-c-brand-soft: var(--vp-c-purple-soft);
--vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif;
.vp-doc {
font-family: var(--sans-text);
font-weight: 500;
}

.vp-doc h1 {
font-family: var(--mono-heading);
font-weight: 500;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These two font-weight: 500; make the the normal text a bit fatter, and the headers skinny.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There was actually a bug in the font name and it was showing monospace instead of Spline Sans Mono. Fixed.

}

.vp-doc a {
color: var(--vp-c-text-1);
}

.vp-doc figcaption {
Expand Down