docs: add logo and sage brand theme

Surface the new logo in the README, VitePress navbar, home hero, and
favicon. Override VitePress brand tokens with the logo's sage palette
(#517158 in light mode, #ADC77F in dark) and recolor the shield.io
badges to match. Also widen the .gitignore globs so .vitepress/{cache,
dist} are ignored from any workspace location.

Author: antfu

.gitignore

@@ -12,6 +12,6 @@ logs
 node_modules
 temp
 .turbo
-.vitepress/cache
-.vitepress/dist
+**/.vitepress/cache
+**/.vitepress/dist
 packages/devframe/skills

README.md

@@ -1,4 +1,10 @@
-# Devframe
+<p align="center">
+  <a href="https://devfra.me/" target="_blank" rel="noopener noreferrer">
+    <img src="https://raw.githubusercontent.com/devframes/devframe/main/docs/public/logo.svg" width="140" alt="Devframe" />
+  </a>
+</p>
+
+<h1 align="center">Devframe</h1>
 
 [![npm version][npm-version-src]][npm-version-href]
 [![npm downloads][npm-downloads-src]][npm-downloads-href]
@@ -72,13 +78,13 @@ await createCli(devframe).parse()
 
 <!-- Badges -->
 
-[npm-version-src]: https://img.shields.io/npm/v/devframe?style=flat&colorA=080f12&colorB=1fa669
+[npm-version-src]: https://img.shields.io/npm/v/devframe?style=flat&colorA=080f12&colorB=517158
 [npm-version-href]: https://npmx.dev/package/devframe
-[npm-downloads-src]: https://img.shields.io/npm/dm/devframe?style=flat&colorA=080f12&colorB=1fa669
+[npm-downloads-src]: https://img.shields.io/npm/dm/devframe?style=flat&colorA=080f12&colorB=517158
 [npm-downloads-href]: https://npmx.dev/package/devframe
-[bundle-src]: https://img.shields.io/bundlephobia/minzip/devframe?style=flat&colorA=080f12&colorB=1fa669&label=minzip
+[bundle-src]: https://img.shields.io/bundlephobia/minzip/devframe?style=flat&colorA=080f12&colorB=517158&label=minzip
 [bundle-href]: https://bundlephobia.com/result?p=devframe
-[license-src]: https://img.shields.io/github/license/devframes/devframe.svg?style=flat&colorA=080f12&colorB=1fa669
+[license-src]: https://img.shields.io/github/license/devframes/devframe.svg?style=flat&colorA=080f12&colorB=517158
 [license-href]: https://github.com/devframes/devframe/blob/main/LICENSE.md
-[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669
+[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=517158
 [jsdocs-href]: https://www.jsdocs.io/package/devframe

docs/.vitepress/config.ts

@@ -58,7 +58,11 @@ export function devframeNav(prefix = ''): DefaultTheme.NavItemWithLink[] {
 export default withMermaid(defineConfig({
   title: 'Devframe',
   description: 'Framework-neutral foundation for building generic DevTools — RPC layer, hosts, and adapters.',
+  head: [
+    ['link', { rel: 'icon', type: 'image/svg+xml', href: '/logo.svg' }],
+  ],
   themeConfig: {
+    logo: { light: '/logo.svg', dark: '/logo.svg' },
     nav: [
       { text: 'Guide', items: guideItems('') },
       { text: 'Error Reference', link: '/errors/' },

docs/.vitepress/theme/index.ts

@@ -0,0 +1,4 @@
+import DefaultTheme from 'vitepress/theme'
+import './style.css'
+
+export default DefaultTheme

docs/.vitepress/theme/style.css

@@ -0,0 +1,30 @@
+:root {
+  --vp-c-brand-1: #517158;
+  --vp-c-brand-2: #486954;
+  --vp-c-brand-3: #3e5c4a;
+  --vp-c-brand-soft: rgba(81, 113, 88, 0.14);
+
+  --vp-button-brand-border: transparent;
+  --vp-button-brand-text: #ffffff;
+  --vp-button-brand-bg: #517158;
+  --vp-button-brand-hover-border: transparent;
+  --vp-button-brand-hover-text: #ffffff;
+  --vp-button-brand-hover-bg: #486954;
+  --vp-button-brand-active-border: transparent;
+  --vp-button-brand-active-text: #ffffff;
+  --vp-button-brand-active-bg: #3e5c4a;
+
+  --vp-home-hero-name-color: transparent;
+  --vp-home-hero-name-background: linear-gradient(120deg, #adc77f, #517158);
+
+  --vp-local-search-highlight-bg: #517158;
+}
+
+.dark {
+  --vp-c-brand-1: #adc77f;
+  --vp-c-brand-2: #93b062;
+  --vp-c-brand-3: #7f9c4e;
+  --vp-c-brand-soft: rgba(173, 199, 127, 0.16);
+
+  --vp-local-search-highlight-bg: #adc77f;
+}

docs/index.md

@@ -5,6 +5,10 @@ hero:
   name: Devframe
   text: Framework-neutral foundation for DevTools
   tagline: One devframe definition. Seven adapters. RPC, hosts, shared state, and agent-native — independent of Vite and any UI framework.
+  image:
+    src: /logo.svg
+    alt: Devframe
+    width: 240
   actions:
     - theme: brand
       text: Get Started