mirror of
https://gitee.com/docsifyjs/docsify.git
synced 2024-11-29 18:48:14 +08:00
77d93fae78
Style updates: - New "core" theme serves as base for all other themes (official and third-party) - New CSS custom properties for simplified customization of "core" theme **Note:** List of available properties will be made available in documentation by embedding soruce CSS in docs after merge. Merge is required because embedded CSS needs to be in `main` branch. For now, see `_vars.css` and `_vars-advanced.css` for details. - New theme "add-ons" modify core theme properties and/or add custom declarations as needed. - New Prism.js theme support - New configurable sidebar toggle design - New typography defaults to system sans-serif and monospace fonts instead of relying on external web font. - New "Core Dark" theme addon provide dark theme styles. Can optionally be applied based on operating system's light/dark setting using `@media` attribute on `<link>` element. - New "Vue" theme addon. Closely replicated popular v4 theme while allowing for v5 enhancements. - New CSS class names available for adding loading indicators, adding sidebar expand/collapse icons, adding sidebar group styles, clamping sidebar links to a single line with ellipses, and changing the sidebar toggle icon. - New auto-generated gradient background for cover page (ensure gradient hue is > 50 degree apart, use OKLCH color if supported, randomize grandient angle, reduce brightness in dark mode) - New button styles (basic, primary, secondary) - New form element styles (text input, radio, checkbox, ) - New "callouts" (previously "important" and "tip" helpers) - New default syntax highlighting theme (from [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/)) - New auto-generated theme color shade and tint colors - New auto-generated monochromatic color palette - New form element styles (fields, legend, text input, text area, checkbox, radio, toggles, and select) - New "headerless" tables - New `kbd` styles - New task list style - New merged navbar styles (consistent with sidebar nav styles) - New search plugin styles and keyboard shortcut indicators - Add ability restore previously focused content element after hiding sidebar - Add "focus trap" when sidebar is visible on mobile (accessibility) - Add ability for sidebar links to wrap by default (previous single-line w/ ellipsis display available as CSS class on `<body>` option) - Add sidebar `page-link`, `group`, and `group-title` CSS classes to sidebar markup. - Add reduced motion media query to set all animation/transition timings to zero - Update Google Font imports (use new variable vs older fixed width fonts) - Update primary/secondary button order on coverpage (primary should be first) - Fix missing merged navbar when loading at desktop resolution then resizing to mobile - Fix inverted open/close sidebar visibility state at desktop/mobile resolutions - Fix overflow setting to prevent clipping of element focus ring - Fix safe area inset margins on mobile in landscape orientation - Fix inverted "tip" and "warn" class names - Fix scroll padding to prevent headers from touching top edge of viewport when scrolled to - Remove Stylus dependency (now using only PostCSS) - Remove legacy themes "Buble", "Dark", "Dolphin", and "Pure". Documentation updates: - New "UI Kit" page showcasing all elements styled by Docsify - Update "Quick Start" page template - Update "Adding pages" page with information on how to properly create sidebar group titles and navbar drop-down menus - Update "Themes" page with theme and class toggles - Update "Configuration" page with deprecation warnings for `themeColor` and `topMargin` - Move "Edit Page" link to footer - Remove [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/) endorsement (currently not compatible with v5 and future is unknown) Miscellaneous updates: - New search plugin options: `insertBefore` and `insertAfter` - Add PostCSS config file - Update BrowserSync config (disable "ghost" mode) - Update tests - Fix Jest + Prettier 3 conflict - Fix `getAndRemoveDocisfyIgnoreConfig` name type (now `Docisfy` => `Docsify`) - Fix execution of sidebar-generating code when `hiddenSidebar` is `true` - Remove `inBrowser` constant (SSR deprecated, so no longer needed)
268 lines
8.5 KiB
HTML
268 lines
8.5 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>docsify</title>
|
|
<link rel="icon" href="_media/favicon.ico" />
|
|
<meta
|
|
name="google-site-verification"
|
|
content="6t0LoIeFksrjF4c9sqUEsVXiQNxLp2hgoqo0KryT-sE"
|
|
/>
|
|
<meta
|
|
name="keywords"
|
|
content="doc,docs,documentation,gitbook,creator,generator,github,jekyll,github-pages"
|
|
/>
|
|
<meta name="description" content="A magical documentation generator." />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1.0, viewport-fit=cover"
|
|
/>
|
|
|
|
<!-- Core Theme -->
|
|
<link
|
|
rel="stylesheet"
|
|
href="//cdn.jsdelivr.net/npm/docsify@5/dist/themes/core.min.css"
|
|
/>
|
|
|
|
<!-- Theme Add-on(s) -->
|
|
<link
|
|
rel="stylesheet"
|
|
href="//cdn.jsdelivr.net/npm/docsify@5/dist/themes/addons/core-dark.min.css"
|
|
media="(prefers-color-scheme: dark)"
|
|
data-group="addon"
|
|
data-sheet="core-dark-auto"
|
|
/>
|
|
<link
|
|
rel="stylesheet"
|
|
href="//cdn.jsdelivr.net/npm/docsify@5/dist/themes/addons/core-dark.min.css"
|
|
data-group="addon"
|
|
data-sheet="core-dark"
|
|
disabled
|
|
/>
|
|
<link
|
|
rel="stylesheet"
|
|
href="//cdn.jsdelivr.net/npm/docsify@5/dist/themes/addons/vue.min.css"
|
|
data-group="addon"
|
|
data-sheet="vue"
|
|
disabled
|
|
/>
|
|
|
|
<!-- Site styles -->
|
|
<style>
|
|
/* Plugin: Carbon Ads */
|
|
#carbonads > :last-child {
|
|
margin-block: calc((1em * var(--line-height)) / 2);
|
|
}
|
|
|
|
/* UI Kit */
|
|
.ui-kit-color {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 10px;
|
|
font-size: var(--font-size-s);
|
|
}
|
|
|
|
.ui-kit-color figure {
|
|
flex-grow: 1;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.ui-kit-color figure div {
|
|
height: 4rem;
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
.ui-kit-color figcaption {
|
|
text-align: center;
|
|
padding: 0.5em 0;
|
|
}
|
|
</style>
|
|
<script>
|
|
// Set html "lang" attribute based on URL
|
|
(function () {
|
|
const lang = location.hash.match(/#\/(de-de|es|ru-ru|zh-cn)\//);
|
|
|
|
if (lang) {
|
|
document.documentElement.setAttribute('lang', lang[1]);
|
|
}
|
|
})();
|
|
</script>
|
|
</head>
|
|
|
|
<body class="loading sidebar-chevron-right sidebar-group-box">
|
|
<div id="app"></div>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify-plugin-carbon@1"></script>
|
|
<script>
|
|
// Docsify configuration
|
|
window.$docsify = {
|
|
alias: {
|
|
'.*?/awesome':
|
|
'https://raw.githubusercontent.com/docsifyjs/awesome-docsify/master/README.md',
|
|
'.*?/changelog':
|
|
'https://raw.githubusercontent.com/docsifyjs/docsify/master/CHANGELOG.md',
|
|
'/.*/_navbar.md': '/_navbar.md',
|
|
'/es/(.*)':
|
|
'https://raw.githubusercontent.com/docsifyjs/docs-es/master/$1',
|
|
'/de-de/(.*)':
|
|
'https://raw.githubusercontent.com/docsifyjs/docs-de/master/$1',
|
|
'/ru-ru/(.*)':
|
|
'https://raw.githubusercontent.com/docsifyjs/docs-ru/master/$1',
|
|
'/zh-cn/(.*)':
|
|
'https://cdn.jsdelivr.net/gh/docsifyjs/docs-zh@master/$1',
|
|
},
|
|
auto2top: true,
|
|
coverpage: true,
|
|
executeScript: true,
|
|
// hideSidebar: true,
|
|
loadSidebar: true,
|
|
loadNavbar: true,
|
|
// mergeNavbar: true,
|
|
maxLevel: 4,
|
|
// repo: 'docsifyjs/docsify',
|
|
// routerMode: 'history',
|
|
subMaxLevel: 2,
|
|
ga: 'UA-106147152-1',
|
|
matomo: {
|
|
host: '//matomo.thunderwave.de',
|
|
id: 6,
|
|
},
|
|
name: 'docsify',
|
|
nameLink: {
|
|
'/es/': '#/es/',
|
|
'/de-de/': '#/de-de/',
|
|
'/ru-ru/': '#/ru-ru/',
|
|
'/zh-cn/': '#/zh-cn/',
|
|
'/': '#/',
|
|
},
|
|
search: {
|
|
// insertAfter: '.app-name',
|
|
// insertBefore: '.sidebar-nav',
|
|
noData: {
|
|
'/es/': '¡No hay resultados!',
|
|
'/de-de/': 'Keine Ergebnisse!',
|
|
'/ru-ru/': 'Никаких результатов!',
|
|
'/zh-cn/': '没有结果!',
|
|
'/': 'No results!',
|
|
},
|
|
paths: 'auto',
|
|
placeholder: {
|
|
'/es/': 'Buscar',
|
|
'/de-de/': 'Suche',
|
|
'/ru-ru/': 'Поиск',
|
|
'/zh-cn/': '搜索',
|
|
'/': 'Search',
|
|
},
|
|
pathNamespaces: ['/es', '/de-de', '/ru-ru', '/zh-cn'],
|
|
},
|
|
skipLink: {
|
|
'/es/': 'Saltar al contenido principal',
|
|
'/de-de/': 'Ga naar de hoofdinhoud',
|
|
'/ru-ru/': 'Перейти к основному содержанию',
|
|
'/zh-cn/': '跳到主要内容',
|
|
},
|
|
vueComponents: {
|
|
'button-counter': {
|
|
template: /* html */ `<button @click="count += 1">You clicked me {{ count }} times</button>`,
|
|
data() {
|
|
return {
|
|
count: 0,
|
|
};
|
|
},
|
|
},
|
|
},
|
|
vueGlobalOptions: {
|
|
data() {
|
|
return {
|
|
count: 0,
|
|
message: 'Hello, World!',
|
|
// Fake API response
|
|
images: [
|
|
{ title: 'Image 1', url: 'https://picsum.photos/150?random=1' },
|
|
{ title: 'Image 2', url: 'https://picsum.photos/150?random=2' },
|
|
{ title: 'Image 3', url: 'https://picsum.photos/150?random=3' },
|
|
],
|
|
};
|
|
},
|
|
computed: {
|
|
timeOfDay() {
|
|
const date = new Date();
|
|
const hours = date.getHours();
|
|
|
|
if (hours < 12) {
|
|
return 'morning';
|
|
} else if (hours < 18) {
|
|
return 'afternoon';
|
|
} else {
|
|
return 'evening';
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
hello() {
|
|
alert(this.message);
|
|
},
|
|
},
|
|
},
|
|
vueMounts: {
|
|
'#counter': {
|
|
data() {
|
|
return {
|
|
count: 0,
|
|
};
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
DocsifyCarbon.create('CEBI6KQE', 'docsifyjsorg'),
|
|
// Plugin: Footer
|
|
function (hook, vm) {
|
|
hook.beforeEach(html => {
|
|
if (/githubusercontent\.com/.test(vm.route.file)) {
|
|
url = vm.route.file
|
|
.replace('raw.githubusercontent.com', 'github.com')
|
|
.replace(/\/master/, '/blob/master');
|
|
} else if (/jsdelivr\.net/.test(vm.route.file)) {
|
|
url = vm.route.file
|
|
.replace('cdn.jsdelivr.net/gh', 'github.com')
|
|
.replace('@master', '/blob/master');
|
|
} else {
|
|
url =
|
|
'https://github.com/docsifyjs/docsify/blob/develop/docs/' +
|
|
vm.route.file;
|
|
}
|
|
|
|
const footerHTML = [
|
|
'<hr>',
|
|
'<div style="display: flex; align-items: center; justify-content: space-between;">',
|
|
' <span>Powered by <a href="/">Docsify.js</a></span>',
|
|
` <a href="${url}" style="display: inline-flex; align-items: center; gap: 0.25em;">:memo: Edit Page</a>`,
|
|
'</div>',
|
|
].join('\n');
|
|
|
|
return html + footerHTML;
|
|
});
|
|
},
|
|
],
|
|
};
|
|
</script>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify@5/dist/docsify.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify@5/dist/plugins/search.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify@5/dist/plugins/front-matter.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify@5/dist/plugins/ga.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/docsify@5/dist/plugins/matomo.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-markdown.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-nginx.min.js"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-php.min.js"></script>
|
|
|
|
<!-- Vue: Development -->
|
|
<!-- <script src="//cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script> -->
|
|
<!-- <script src="//cdn.jsdelivr.net/npm/vue@3/dist/vue.runtime.global.js"></script> -->
|
|
|
|
<!-- Vue: Production -->
|
|
<script src="//cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js"></script>
|
|
<!-- <script src="//cdn.jsdelivr.net/npm/vue@3/dist/vue.runtime.global.prod.js"></script> -->
|
|
</body>
|
|
</html>
|