Skip to content

revamp: update fonts and improved home page navigation #238

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

Closed
vihar wants to merge 3 commits into from
Closed

revamp: update fonts and improved home page navigation #238

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f3418a9
revamp: update fonts and improved home page navigation
vihar Mar 9, 2026
8a6de4e
clean-up conflicts
vihar Mar 9, 2026
7b743c0
fix: build-errors
vihar Mar 9, 2026
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
11 changes: 11 additions & 0 deletions .claude/launch.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
"version": "0.0.1",
"configurations": [
{
"name": "dev",
"runtimeExecutable": "pnpm",
"runtimeArgs": ["dev"],
"port": 5173
}
]
}
22 changes: 13 additions & 9 deletions docs/.vitepress/config.mts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,17 @@ export default withMermaid(
head: [
["link", { rel: "icon", href: "/logo/favicon-32x32.png" }],

// Font preload for critical rendering
[
"link",
{
rel: "preload",
href: "/fonts/Inter/Inter-roman.var.woff2",
as: "font",
type: "font/woff2",
crossorigin: "",
},
],
Comment on lines +96 to +106
Copy link

@coderabbitai coderabbitai bot Mar 9, 2026

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Verify Inter font file exists
fd -t f "Inter-roman.var.woff2" docs/.vitepress/public/fonts/

# If not found in public/fonts, search broader
if [ $? -ne 0 ]; then
  echo "Searching entire docs directory..."
  fd -t f "Inter-roman.var.woff2" docs/
fi

Repository: makeplane/developer-docs

Length of output: 236

🏁 Script executed:

# Find style.css files
fd -t f "style.css" docs/

# List the public directory structure
find docs/.vitepress/public -type d -o -type f 2>/dev/null | head -20

# Search for any reference to Inter font in config files
rg "Inter" docs/.vitepress/ -t mts -t ts -t css

Repository: makeplane/developer-docs

Length of output: 95

🏁 Script executed:

# Check git history for font-related changes in this PR
git log -1 --name-status
git diff HEAD~1 HEAD --name-status | grep -i font

Repository: makeplane/developer-docs

Length of output: 25930

🏁 Script executed:

cat -n docs/.vitepress/theme/style.css

Repository: makeplane/developer-docs

Length of output: 28902

🏁 Script executed:

# Also check the config.mts around the preload section for any other font references
sed -n '80,120p' docs/.vitepress/config.mts

Repository: makeplane/developer-docs

Length of output: 1335

Font file missing: preload references non-existent asset.

The Inter font file (/fonts/Inter/Inter-roman.var.woff2) does not exist in the repository. While the preload declaration in config.mts correctly matches the @font-face src path in style.css, the actual font file is absent from docs/public/fonts/. This will cause the preload to fail at runtime with a 404 error, negating any performance benefit and potentially breaking the application's typography.

Add the Inter variable font file to docs/public/fonts/Inter/ or update both the preload link and @font-face declaration in style.css to reference the available fonts (IBMPlexMono or Satoshi).

🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@docs/.vitepress/config.mts` around lines 96 - 106, The preload entry for the
Inter variable font (the link object in docs/.vitepress/config.mts referencing
"/fonts/Inter/Inter-roman.var.woff2") points to a missing asset; either add the
Inter variable font file into docs/public/fonts/Inter/ with the exact filename
or update the preload entry and the corresponding `@font-face` src in style.css to
use an existing font (e.g., IBMPlexMono or Satoshi) with matching paths and
filenames so the preload and `@font-face` references are consistent and do not 404
at runtime.

// Google Analytics with Consent Mode v2
["script", { async: "", src: "https://www.googletagmanager.com/gtag/js?id=G-JF828SKW90" }],
[
Expand Down Expand Up @@ -190,8 +201,8 @@ export default withMermaid(
{ text: "Self-hosting", link: "/self-hosting/overview" },
{ text: "API Reference", link: "/api-reference/introduction" },
{ text: "Build and extend", link: "/dev-tools/build-plane-app/overview" },
{ text: "Plane Docs", link: "https://docs.plane.so" },
{ text: "Sign in", link: "https://app.plane.so/sign-in" },
{ text: "Plane Docs", link: "https://docs.plane.so", noIcon: true },
{ text: "Sign in", link: "https://app.plane.so/sign-in", noIcon: true },
],

sidebar: {
Expand Down Expand Up @@ -758,13 +769,6 @@ export default withMermaid(
],
},

socialLinks: [
{ icon: "github", link: "https://github.com/makeplane/plane" },
{ icon: "discord", link: "https://discord.com/invite/A92xrEGCge" },
{ icon: "twitter", link: "https://twitter.com/planepowers" },
{ icon: "linkedin", link: "https://www.linkedin.com/company/planepowers/" },
],

search: searchConfig,

editLink: {
Expand Down
1 change: 1 addition & 0 deletions docs/.vitepress/theme/components/Card.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ const customSvgIcons = {
`,
coolify: `<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" xml:space="preserve" viewBox="0 0 512 512"><path d="M63.7-161.7h-90.9v272.8h90.9zm0 363.7h363.7v-90.9H63.7zm0-363.7h363.7v-90.9H63.7z" style="fill:#006399;fill-opacity:.302" transform="translate(84.664 310.016)"/><path d="M48.2-177.1h-90.9V95.6h90.9zm0 363.6h363.7V95.6H48.2zm0-363.6h363.7V-268H48.2z" style="fill:#006399;fill-opacity:.502" transform="translate(71.406 296.758)"/><path d="M32.8-192.6h-90.9V80.2h90.9zm0 363.7h363.7V80.2H32.8zm0-363.7h363.7v-90.9H32.8z" style="fill:#006399" transform="translate(58.147 283.5)"/></svg>`,

github: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2Z" fill="currentColor"/></svg>`,
// Add more icons as needed
};

Expand Down
42 changes: 42 additions & 0 deletions docs/.vitepress/theme/components/TabNav.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<script setup>
import { useRoute } from "vitepress";
import { computed } from "vue";

const route = useRoute();

const sections = [
{ text: "Self-hosting", link: "/self-hosting/overview", match: "/self-hosting/" },
{ text: "API Reference", link: "/api-reference/introduction", match: "/api-reference/" },
{ text: "Build & Extend", link: "/dev-tools/build-plane-app/overview", match: "/dev-tools/" },
];

const activeSection = computed(() => {
const path = route.path;
for (const section of sections) {
if (path.startsWith(section.match)) return section.match;
}
return "";
});
</script>

<template>
<div class="tab-nav">
<div class="tab-nav-wrapper">
<div class="tab-nav-container">
<div class="tab-nav-content">
<div class="tab-nav-inner">
<a
v-for="section in sections"
:key="section.match"
:href="section.link"
class="tab-nav-link"
:class="{ active: activeSection === section.match }"
>
{{ section.text }}
</a>
</div>
</div>
</div>
</div>
</div>
</template>
2 changes: 2 additions & 0 deletions docs/.vitepress/theme/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import ResponsePanel from "./components/ResponsePanel.vue";
import Card from "./components/Card.vue";
import CardGroup from "./components/CardGroup.vue";
import CookieConsent from "./components/CookieConsent.vue";
import TabNav from "./components/TabNav.vue";

/**
* Adds 'api-page' class to hide the aside on API reference pages
Expand Down Expand Up @@ -110,6 +111,7 @@ export default {
extends: DefaultTheme,
Layout() {
return h(DefaultTheme.Layout, null, {
"layout-top": () => h(TabNav),
"layout-bottom": () => h(CookieConsent),
});
},
Expand Down
Loading
Loading