Skip to content

fix(docs): upgrade comark-docs and fix logo layout shift #330

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
antfu merged 1 commit into from
Sep 2, 2026
+584 −397
Merged

fix(docs): upgrade comark-docs and fix logo layout shift #330

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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: 1 addition & 2 deletions docs/app/app.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@ export default defineAppConfig({
title: 'Devframe',
logo: {
alt: 'Devframe',
light: '/logo.svg',
dark: '/logo.svg',
mark: 'devframe',
},
nav: [
{
Expand Down
31 changes: 31 additions & 0 deletions docs/app/components/LogoMark.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<script setup lang="ts">
defineProps<{
name?: string
}>()
</script>

<template>
<svg class="h-6 w-auto" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_8_208)">
<path d="M238.464 40H66V236.007H104.577C220.688 236.007 232.79 158.437 232.79 121.733C232.79 108.867 243.38 108.867 243.38 121.733C251.318 236.701 356.35 245.457 365.527 246.223L365.542 246.224C374.619 246.981 382.561 251.521 365.542 254.548C253.592 264.765 243.758 364.282 243.38 375.634C243.002 386.986 235.438 399.851 232.79 375.634C222.957 274.603 144.289 257.954 104.577 257.954H66V460.772H238.464C358.356 460.772 452.152 371.472 452.152 251.521C452.152 131.571 356.465 40 238.464 40Z" fill="url(#paint0_radial_8_208)" />
<path d="M238.464 40H66V236.007H104.577C220.688 236.007 232.79 158.437 232.79 121.733C232.79 108.867 243.38 108.867 243.38 121.733C251.318 236.701 356.35 245.457 365.527 246.223L365.542 246.224C374.619 246.981 382.561 251.521 365.542 254.548C253.592 264.765 243.758 364.282 243.38 375.634C243.002 386.986 235.438 399.851 232.79 375.634C222.957 274.603 144.289 257.954 104.577 257.954H66V460.772H238.464C358.356 460.772 452.152 371.472 452.152 251.521C452.152 131.571 356.465 40 238.464 40Z" stroke="#86997F" stroke-opacity="0.5" stroke-width="1.33156" />
</g>
<defs>
<filter id="filter0_d_8_208" x="60.7404" y="39.3342" width="396.671" height="431.358" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
<feOffset dy="4.66045" />
<feGaussianBlur stdDeviation="2.29694" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix" values="0 0 0 0 0.25464 0 0 0 0 0.285175 0 0 0 0 0.243391 0 0 0 0.1 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_8_208" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_8_208" result="shape" />
</filter>
<radialGradient id="paint0_radial_8_208" cx="0" cy="0" r="1" gradientTransform="matrix(399.011 555.102 -568.423 408.982 -11.6221 -34.9218)" gradientUnits="userSpaceOnUse">
<stop stop-color="#ADC77F" />
<stop offset="0.71903" stop-color="#517158" />
<stop offset="1" stop-color="#486954" />
</radialGradient>
</defs>
</svg>
</template>
28 changes: 5 additions & 23 deletions patches/comark-docs@0.0.1.patch
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,31 +1,13 @@
diff --git a/server/utils/content.ts b/server/utils/content.ts
index e30eeb312d00dd6111b5574680e6b8b725d7cb76..2d6d6e570dfef6537276dc4a613f3cd5fcbf4e8c 100644
--- a/server/utils/content.ts
+++ b/server/utils/content.ts
@@ -1,14 +1,15 @@
import { defineContentPlugin, type ComarkContent, type CacheOptions, comarkContent } from 'comark-content';
import fs from 'comark-content/sources/fs'
import github from 'comark-content/sources/github'
@@ -4 +4 @@
-import rangi from 'comark/plugins/rangi'
+import shiki from 'comark/plugins/shiki'
import security from 'comark/plugins/security'
import emoji from 'comark/plugins/emoji'
import toc from 'comark/plugins/toc'
import mermaid from 'comark/plugins/mermaid'
import yaml from 'comark-content/plugins/yaml'
import tracingOtel from 'comark-content/plugins/tracing/otel'
-import { githubLight, githubDark } from 'rangi/themes'
@@ -12 +12,2 @@
-import { geistTheme } from '../../utils/geist-theme.ts'
+import vitesseDark from '@shikijs/themes/vitesse-dark'
+import vitesseLight from '@shikijs/themes/vitesse-light'
import { contentTracer } from './tracer.ts'

// Rebuilt only when the head advances (see `getProdContent`). Holds the *promise*, not the instance: the
@@ -18,7 +19,7 @@ let content: Promise<ComarkContent> | undefined
// Bump CONTENT_PARSER_VERSION in `cache.ts` when these plugins or their options change cached output.
const comarkPlugins = [
mermaid({ theme: 'zinc-light', themeDark: 'zinc-dark' }),
- rangi({ theme: { light: githubLight, dark: githubDark } }),
@@ -21 +22 @@
- rangi({ theme: geistTheme }),
+ shiki({ registerDefaultThemes: false, themes: { light: vitesseLight, dark: vitesseDark } }),
toc({ depth: 3 }),
emoji(),
security({
Loading
Loading