1
0
mirror of https://github.com/vlang/v.git synced 2023-08-10 21:13:21 +03:00

vdoc: refactor theme files (#19024)

This commit is contained in:
Turiiya 2023-08-02 09:46:18 +02:00 committed by GitHub
parent 43800a05e8
commit 6b978a6b5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 815 additions and 830 deletions

View File

@ -6,7 +6,7 @@ end_of_line = lf
insert_final_newline = true insert_final_newline = true
trim_trailing_whitespace = true trim_trailing_whitespace = true
[*.v] [*.{v,js,css}]
indent_style = tab indent_style = tab
[*.{bat,cmd}] [*.{bat,cmd}]

19
.github/workflows/module_docs_lint.yml vendored Normal file
View File

@ -0,0 +1,19 @@
name: Code CI vlib modules
on:
push:
paths:
- '**/cmd/tools/vdoc/theme/**'
pull_request:
paths:
- '**/cmd/tools/vdoc/theme/**'
jobs:
lint-module-docs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: Check Formatting
uses: actionsx/prettier@v2
with:
args: --check cmd/tools/vdoc/theme

View File

@ -10,6 +10,7 @@ import v.ast
import v.token import v.token
import v.doc import v.doc
import v.pref import v.pref
import v.util { tabs }
const ( const (
css_js_assets = ['doc.css', 'normalize.css', 'doc.js', 'dark-mode.js'] css_js_assets = ['doc.css', 'normalize.css', 'doc.js', 'dark-mode.js']
@ -249,27 +250,27 @@ fn (vd VDoc) gen_html(d doc.Doc) string {
version).replace('{{ light_icon }}', vd.assets['light_icon']).replace('{{ dark_icon }}', version).replace('{{ light_icon }}', vd.assets['light_icon']).replace('{{ dark_icon }}',
vd.assets['dark_icon']).replace('{{ menu_icon }}', vd.assets['menu_icon']).replace('{{ head_assets }}', vd.assets['dark_icon']).replace('{{ menu_icon }}', vd.assets['menu_icon']).replace('{{ head_assets }}',
if cfg.inline_assets { if cfg.inline_assets {
'\n${tabs[0]}<style>' + vd.assets['doc_css'] + '</style>\n${tabs[0]}<style>' + '<style>${vd.assets['doc_css']}</style>
vd.assets['normalize_css'] + '</style>\n${tabs[0]}<script>' + ${tabs(2)}<style>${vd.assets['normalize_css']}</style>
vd.assets['dark_mode_js'] + '</script>' ${tabs(2)}<script>${vd.assets['dark_mode_js']}</script>'
} else { } else {
'\n${tabs[0]}<link rel="stylesheet" href="' + vd.assets['doc_css'] + '<link rel="stylesheet" href="${vd.assets['doc_css']}" />
'" />\n${tabs[0]}<link rel="stylesheet" href="' + vd.assets['normalize_css'] + ${tabs(2)}<link rel="stylesheet" href="${vd.assets['normalize_css']}" />
'" />\n${tabs[0]}<script src="' + vd.assets['dark_mode_js'] + '"></script>' ${tabs(2)}<script src="${vd.assets['dark_mode_js']}"></script>'
}).replace('{{ toc_links }}', if cfg.is_multi || vd.docs.len > 1 { }).replace('{{ toc_links }}', if cfg.is_multi || vd.docs.len > 1 {
modules_toc_str modules_toc_str
} else { } else {
symbols_toc_str symbols_toc_str
}).replace('{{ contents }}', contents.str()).replace('{{ right_content }}', if cfg.is_multi }).replace('{{ contents }}', contents.str()).replace('{{ right_content }}', if cfg.is_multi
&& d.head.name != 'README' { && d.head.name != 'README' {
'<div class="doc-toc"><ul>' + symbols_toc_str + '</ul></div>' '<div class="doc-toc"><ul>${symbols_toc_str}</ul></div>'
} else { } else {
'' ''
}).replace('{{ footer_content }}', gen_footer_text(d, !cfg.no_timestamp)).replace('{{ footer_assets }}', }).replace('{{ footer_content }}', gen_footer_text(d, !cfg.no_timestamp)).replace('{{ footer_assets }}',
if cfg.inline_assets { if cfg.inline_assets {
'<script>' + vd.assets['doc_js'] + '</script>' '<script>${vd.assets['doc_js']}</script>'
} else { } else {
'<script src="' + vd.assets['doc_js'] + '"></script>' '<script src="${vd.assets['doc_js']}"></script>'
}) })
return result return result
} }
@ -407,12 +408,12 @@ fn doc_node_html(dn doc.DocNode, link string, head bool, include_examples bool,
node_id = 'readme_${node_id}' node_id = 'readme_${node_id}'
hash_link = ' <a href="#${node_id}">#</a>' hash_link = ' <a href="#${node_id}">#</a>'
} }
dnw.writeln('${tabs[1]}<section id="${node_id}" class="doc-node${node_class}">') dnw.writeln('${tabs(2)}<section id="${node_id}" class="doc-node${node_class}">')
if dn.name.len > 0 { if dn.name.len > 0 {
if dn.kind == .const_group { if dn.kind == .const_group {
dnw.write_string('${tabs[2]}<div class="title"><${head_tag}>${sym_name}${hash_link}</${head_tag}>') dnw.write_string('${tabs(3)}<div class="title"><${head_tag}>${sym_name}${hash_link}</${head_tag}>')
} else { } else {
dnw.write_string('${tabs[2]}<div class="title"><${head_tag}>${dn.kind} ${sym_name}${hash_link}</${head_tag}>') dnw.write_string('${tabs(3)}<div class="title"><${head_tag}>${dn.kind} ${sym_name}${hash_link}</${head_tag}>')
} }
if link.len != 0 { if link.len != 0 {
dnw.write_string('<a class="link" rel="noreferrer" target="_blank" href="${link}">${link_svg}</a>') dnw.write_string('<a class="link" rel="noreferrer" target="_blank" href="${link}">${link_svg}</a>')

View File

@ -0,0 +1,5 @@
{
"useTabs": true,
"printWidth": 100,
"singleQuote": true
}

View File

@ -1,6 +1,5 @@
(function () { (function () {
var html = document.getElementsByTagName('html')[0];
if (localStorage.getItem('dark-mode') === 'true') { if (localStorage.getItem('dark-mode') === 'true') {
html.classList.add('dark'); document.querySelector('html').classList.add('dark');
} }
})(); })();

View File

@ -86,8 +86,8 @@ html {
} }
body { body {
margin: 0; margin: 0;
font-family: Jost, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, font-family: Jost, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
background-color: #fff; background-color: #fff;
background-color: var(--background-color); background-color: var(--background-color);
color: #000; color: #000;
@ -157,8 +157,6 @@ body {
fill: var(--menu-toggle-icon-color); fill: var(--menu-toggle-icon-color);
} }
.doc-nav > .heading-container { .doc-nav > .heading-container {
position: relative;
/* IE11 */
position: sticky; position: sticky;
position: -webkit-sticky; position: -webkit-sticky;
top: 0; top: 0;
@ -184,16 +182,10 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.doc-nav .doc-nav > .heading-container > .heading > .info > .toggle-version-container > #dark-mode-toggle {
> .heading-container
> .heading
> .info
> .toggle-version-container
> #dark-mode-toggle {
cursor: pointer; cursor: pointer;
fill: #fff; fill: #fff;
display: flex; display: flex;
visibility: hidden;
} }
.doc-nav .doc-nav
> .heading-container > .heading-container
@ -325,8 +317,8 @@ body {
font-weight: 500; font-weight: 500;
} }
.doc-nav > .search .result > .link > .description { .doc-nav > .search .result > .link > .description {
font-family: Jost, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, font-family: Jost, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
font-size: 0.75rem; font-size: 0.75rem;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
@ -379,7 +371,6 @@ body {
padding: 5rem 0 2rem 0; padding: 5rem 0 2rem 0;
margin-top: -4rem; margin-top: -4rem;
overflow: hidden; overflow: hidden;
word-break: break-all; /* IE11 */
word-break: break-word; word-break: break-word;
} }
.doc-content > .doc-node.const:nth-child(2) { .doc-content > .doc-node.const:nth-child(2) {
@ -416,7 +407,7 @@ body {
background-color: var(--code-background-color); background-color: var(--code-background-color);
color: var(--attribute-text-color); color: var(--attribute-text-color);
margin-right: 0.8rem; margin-right: 0.8rem;
font-family: "Jetbrains Mono", monospace; font-family: 'Jetbrains Mono', monospace;
font-size: 0.9rem; font-size: 0.9rem;
} }
.doc-content > .doc-node > .attributes > .attribute-deprecated { .doc-content > .doc-node > .attributes > .attribute-deprecated {
@ -548,7 +539,7 @@ pre code {
color: var(--code-default-text-color); color: var(--code-default-text-color);
font-size: 0.948em; font-size: 0.948em;
text-shadow: none; text-shadow: none;
font-family: "Jetbrains Mono", monospace; font-family: 'Jetbrains Mono', monospace;
background-color: #edf2f7; background-color: #edf2f7;
background-color: var(--code-background-color); background-color: var(--code-background-color);
border-radius: 0.25rem; border-radius: 0.25rem;
@ -641,8 +632,6 @@ pre {
padding: 0rem 2rem 1rem 2rem; padding: 0rem 2rem 1rem 2rem;
} }
.doc-toc { .doc-toc {
position: relative;
/* IE11 */
position: sticky; position: sticky;
height: 100vh; height: 100vh;
position: -webkit-sticky; position: -webkit-sticky;
@ -699,12 +688,7 @@ pre {
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
} }
.doc-nav .doc-nav > .heading-container > .heading > .info > .toggle-version-container > #dark-mode-toggle {
> .heading-container
> .heading
> .info
> .toggle-version-container
> #dark-mode-toggle {
margin-right: auto; margin-right: auto;
} }
.doc-nav .content.show, .doc-nav .content.show,

View File

@ -1,96 +1,85 @@
(function () { (function () {
if (document.body.scrollIntoView) { const docnav = document.querySelector('.doc-nav');
var docnav = document.querySelector('.doc-nav'); const active = docnav.querySelector('li.active');
var active = docnav.querySelector('li.active'); active?.scrollIntoView({ block: 'center', inline: 'nearest' });
if (active) {
active.scrollIntoView({ block: 'center', inline: 'nearest' });
}
}
setupScrollSpy();
setupMobileToggle(); setupMobileToggle();
setupDarkMode(); setupDarkMode();
setupScrollSpy();
setupSearch(); setupSearch();
setupCollapse(); setupCollapse();
})(); })();
function setupScrollSpy() { function setupScrollSpy() {
var sectionPositions = []; const sections = document.querySelectorAll('section');
var sections = document.querySelectorAll('section'); const sectionPositions = Array.from(sections).map((section) => section.offsetTop);
sections.forEach(function (section) { let scrollPos = 0;
sectionPositions.push(section.offsetTop); window.addEventListener('scroll', () => {
}); const toc = document.querySelector('.doc-toc');
var scrollPos = 0;
window.addEventListener('scroll', function (_) {
// Reset classes // Reset classes
document.querySelectorAll('.doc-toc a[class="active"]').forEach(function (link) { toc.querySelectorAll('a[class="active"]').forEach((link) => link.classList.remove('active'));
link.classList.remove('active');
});
// Set current menu link as active // Set current menu link as active
var scrollPosition = document.documentElement.scrollTop || document.body.scrollTop; let scrollPosition = document.documentElement.scrollTop || document.body.scrollTop;
for (var i = 0; i < sectionPositions.length; i++) { for (const [i, position] of sectionPositions.entries()) {
var section = sections[i];
var position = sectionPositions[i];
if (position >= scrollPosition) { if (position >= scrollPosition) {
var link = document.querySelector('.doc-toc a[href="#' + section.id + '"]'); const section = sections[i];
const link = toc.querySelector('a[href="#' + section.id + '"]');
if (link) { if (link) {
link.classList.add('active'); link.classList.add('active');
var docToc = document.querySelector('.doc-toc'); const tocHeight = toc.clientHeight;
var tocHeight = docToc.clientHeight; const scrollTop = toc.scrollTop;
var scrollTop = docToc.scrollTop; if (
if ((document.body.getBoundingClientRect()).top < scrollPos && scrollTop < link.offsetTop - 10) { document.body.getBoundingClientRect().top < scrollPos &&
docToc.scrollTop = link.clientHeight + link.offsetTop - tocHeight + 10; scrollTop < link.offsetTop - 10
) {
toc.scrollTop = link.clientHeight + link.offsetTop - tocHeight + 10;
} else if (scrollTop > link.offsetTop - 10) { } else if (scrollTop > link.offsetTop - 10) {
docToc.scrollTop = link.offsetTop - 10; toc.scrollTop = link.offsetTop - 10;
} }
} }
break; break;
} }
} }
scrollPos = (document.body.getBoundingClientRect()).top; scrollPos = document.body.getBoundingClientRect().top;
}); });
} }
function setupMobileToggle() { function setupMobileToggle() {
var toggle = document.getElementById('toggle-menu'); document.getElementById('toggle-menu').addEventListener('click', () => {
toggle.addEventListener('click', function (_) { const docNav = document.querySelector('.doc-nav');
var docNav = document.querySelector('.doc-nav'); const isHidden = docNav.classList.contains('hidden');
var isHidden = docNav.classList.contains('hidden');
docNav.classList.toggle('hidden'); docNav.classList.toggle('hidden');
var search = document.querySelector('.doc-nav > .search'); const search = docNav.querySelector('.search');
console.log(search); // console.log(search);
var searchHasResults = search.classList.contains('has-results'); const searchHasResults = search.classList.contains('has-results');
if (isHidden && searchHasResults) { if (isHidden && searchHasResults) {
search.classList.remove('mobile-hidden'); search.classList.remove('mobile-hidden');
} else { } else {
search.classList.add('mobile-hidden'); search.classList.add('mobile-hidden');
} }
var content = document.querySelector('.doc-nav .content'); const content = docNav.querySelector('.content');
content.classList.toggle('hidden'); content.classList.toggle('hidden');
content.classList.toggle('show'); content.classList.toggle('show');
}); });
} }
function setupDarkMode() { function setupDarkMode() {
var html = document.getElementsByTagName('html')[0]; const html = document.querySelector('html');
var darkModeToggle = document.getElementById('dark-mode-toggle'); const darkModeToggle = document.getElementById('dark-mode-toggle');
darkModeToggle.addEventListener('click', function () { darkModeToggle.addEventListener('click', () => {
html.classList.toggle('dark'); html.classList.toggle('dark');
var isDarkModeEnabled = html.classList.contains('dark'); const isDarkModeEnabled = html.classList.contains('dark');
localStorage.setItem('dark-mode', isDarkModeEnabled); localStorage.setItem('dark-mode', isDarkModeEnabled);
darkModeToggle.setAttribute('aria-checked', isDarkModeEnabled) darkModeToggle.setAttribute('aria-checked', isDarkModeEnabled);
}); });
// Check if css var() is supported and enable dark mode toggle
if (window.CSS && CSS.supports('color', 'var(--fake-var)')) {
darkModeToggle.style.visibility = 'unset';
}
} }
function setupSearch() { function setupSearch() {
var searchInput = document.getElementById('search'); const searchInput = document.getElementById('search');
var onInputChange = debounce(function (e) { const onInputChange = debounce((e) => {
var searchValue = e.target.value.toLowerCase(); const searchValue = e.target.value.toLowerCase();
var menu = document.querySelector('.doc-nav > .content'); const docNav = document.querySelector('.doc-nav');
var search = document.querySelector('.doc-nav > .search'); const menu = docNav.querySelector('.content');
const search = docNav.querySelector('.search');
if (searchValue === '') { if (searchValue === '') {
// reset to default // reset to default
menu.style.display = ''; menu.style.display = '';
@ -108,96 +97,77 @@ function setupSearch() {
search.classList.add('has-results'); search.classList.add('has-results');
} }
// cache length for performance // cache length for performance
var foundModule = false; let foundModule = false;
var searchModuleIndexLength = searchModuleIndex.length; const ul = document.createElement('ul');
var ul = document.createElement('ul');
search.appendChild(ul); search.appendChild(ul);
for (var i = 0; i < searchModuleIndexLength; i++) { for (const [i, title] of searchModuleIndex.entries()) {
// no toLowerCase needed because modules are always lowercase // no toLowerCase needed because modules are always lowercase
var title = searchModuleIndex[i];
if (title.indexOf(searchValue) === -1) { if (title.indexOf(searchValue) === -1) {
continue continue;
} }
foundModule = true; foundModule = true;
// [description, link] // [description, link]
var data = searchModuleData[i]; const data = searchModuleData[i];
var description = data[0]; const el = createSearchResult({
var link = data[1];
var el = createSearchResult({
link: link,
title: title,
description: description,
badge: 'module', badge: 'module',
description: data[0],
link: data[1],
title: title,
}); });
ul.appendChild(el); ul.appendChild(el);
} }
if (foundModule) { if (foundModule) {
var hr = document.createElement('hr'); const hr = document.createElement('hr');
hr.classList.add('separator'); hr.classList.add('separator');
search.appendChild(hr); search.appendChild(hr);
} }
var searchIndexLength = searchIndex.length; let results = [];
var results = []; for (const [i, title] of searchIndex.entries()) {
for (var i = 0; i < searchIndexLength; i++) {
var title = searchIndex[i];
if (title.toLowerCase().indexOf(searchValue) === -1) { if (title.toLowerCase().indexOf(searchValue) === -1) {
continue continue;
} }
// [badge, description, link] // [badge, description, link]
var data = searchData[i]; const data = searchData[i];
var badge = data[0];
var description = data[1];
var link = data[2];
var prefix = data[3];
results.push({ results.push({
badge: badge, badge: data[0],
description: description, description: data[1],
link: link, link: data[2],
title: prefix + ' ' + title, title: data[3] + ' ' + title,
}); });
} }
results.sort(function (a, b) { results.sort((a, b) => (a.title < b.title ? -1 : a.title > b.title ? 1 : 0));
if (a.title < b.title) { const ul_ = document.createElement('ul');
return -1; search.appendChild(ul_);
} results.forEach((result) => {
if (a.title > b.title) { const el = createSearchResult(result);
return 1; ul_.appendChild(el);
}
return 0;
}); });
var ul = document.createElement('ul');
search.appendChild(ul);
for (var i = 0; i < results.length; i++) {
var result = results[i];
var el = createSearchResult(result);
ul.appendChild(el);
}
} }
}); });
searchInput.addEventListener('input', onInputChange); searchInput.addEventListener('input', onInputChange);
} }
function createSearchResult(data) { function createSearchResult(data) {
var li = document.createElement('li'); const li = document.createElement('li');
li.classList.add('result'); li.classList.add('result');
var a = document.createElement('a'); const a = document.createElement('a');
a.href = data.link; a.href = data.link;
a.classList.add('link'); a.classList.add('link');
li.appendChild(a); li.appendChild(a);
var defintion = document.createElement('div'); const defintion = document.createElement('div');
defintion.classList.add('definition'); defintion.classList.add('definition');
a.appendChild(defintion); a.appendChild(defintion);
if (data.description) { if (data.description) {
var description = document.createElement('div'); const description = document.createElement('div');
description.classList.add('description'); description.classList.add('description');
description.textContent = data.description; description.textContent = data.description;
a.appendChild(description); a.appendChild(description);
} }
var title = document.createElement('span'); const title = document.createElement('span');
title.classList.add('title'); title.classList.add('title');
title.textContent = data.title; title.textContent = data.title;
defintion.appendChild(title); defintion.appendChild(title);
var badge = document.createElement('badge'); const badge = document.createElement('badge');
badge.classList.add('badge'); badge.classList.add('badge');
badge.textContent = data.badge; badge.textContent = data.badge;
defintion.appendChild(badge); defintion.appendChild(badge);
@ -205,30 +175,29 @@ function createSearchResult(data) {
} }
function setupCollapse() { function setupCollapse() {
var dropdownArrows = document.querySelectorAll('.dropdown-arrow'); const dropdownArrows = document.querySelectorAll('.dropdown-arrow');
for (var i = 0; i < dropdownArrows.length; i++) { dropdownArrows.forEach((arrow) => {
var dropdownArrow = dropdownArrows[i]; arrow.addEventListener('click', (e) => {
dropdownArrow.addEventListener('click', function (e) { const parent = e.target.parentElement.parentElement.parentElement;
var parent = e.target.parentElement.parentElement.parentElement;
parent.classList.toggle('open'); parent.classList.toggle('open');
}); });
} });
} }
function debounce(func, timeout) { function debounce(func, timeout) {
var timer; let timer;
return (...args) => { return (...args) => {
const next = () => func(...args); const next = () => func(...args);
if (timer) { if (timer) {
clearTimeout(timer); clearTimeout(timer);
} }
timer = setTimeout(next, timeout > 0 ? timeout : 300); timer = setTimeout(next, timeout > 0 ? timeout : 300);
} };
} }
document.addEventListener('keypress', (ev) => { document.addEventListener('keypress', (ev) => {
if (ev.key == '/') { if (ev.key == '/') {
let search = document.getElementById('search'); const search = document.getElementById('search');
ev.preventDefault(); ev.preventDefault();
search.focus(); search.focus();
} }

View File

@ -1,22 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta http-equiv="x-ua-compatible" content="IE=edge" /> <meta http-equiv="x-ua-compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{{ title }} | vdoc</title> <title>{{ title }} | vdoc</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <link
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet"> href="https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap"
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png"> rel="stylesheet"
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png"> />
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png"> <link
<link rel="manifest" href="site.webmanifest"> href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap"
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5"> rel="stylesheet"
<meta name="msapplication-TileColor" content="#da532c"> />
<meta name="theme-color" content="#ffffff"> <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5" />
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#ffffff" />
{{ head_assets }} {{ head_assets }}
</head> </head>
@ -30,11 +35,18 @@
<div class="module">{{ head_name }}</div> <div class="module">{{ head_name }}</div>
<div class="toggle-version-container"> <div class="toggle-version-container">
<span>{{ version }}</span> <span>{{ version }}</span>
<div id="dark-mode-toggle" role="switch" aria-checked="false" aria-label="Toggle dark mode">{{ light_icon }}{{ dark_icon }}</div> <div
id="dark-mode-toggle"
role="switch"
aria-checked="false"
aria-label="Toggle dark mode"
>
{{ light_icon }}{{ dark_icon }}
</div>
</div> </div>
{{ menu_icon }} {{ menu_icon }}
</div> </div>
<input type="text" id="search" placeholder="Search... (beta)" autocomplete="off"> <input type="text" id="search" placeholder="Search... (beta)" autocomplete="off" />
</div> </div>
</div> </div>
<nav class="search hidden"></nav> <nav class="search hidden"></nav>
@ -48,9 +60,7 @@
<div class="doc-container"> <div class="doc-container">
<div class="doc-content"> <div class="doc-content">
{{ contents }} {{ contents }}
<div class="footer"> <div class="footer">{{ footer_content }}</div>
{{ footer_content }}
</div>
</div> </div>
{{ right_content }} {{ right_content }}
</div> </div>
@ -59,5 +69,4 @@
{{ footer_assets }} {{ footer_assets }}
<script async src="search_index.js"></script> <script async src="search_index.js"></script>
</body> </body>
</html> </html>

View File

@ -91,24 +91,24 @@ select {
} }
button, button,
[type="button"], [type='button'],
[type="reset"], [type='reset'],
[type="submit"] { [type='submit'] {
-webkit-appearance: button; -webkit-appearance: button;
} }
button::-moz-focus-inner, button::-moz-focus-inner,
[type="button"]::-moz-focus-inner, [type='button']::-moz-focus-inner,
[type="reset"]::-moz-focus-inner, [type='reset']::-moz-focus-inner,
[type="submit"]::-moz-focus-inner { [type='submit']::-moz-focus-inner {
border-style: none; border-style: none;
padding: 0; padding: 0;
} }
button:-moz-focusring, button:-moz-focusring,
[type="button"]:-moz-focusring, [type='button']:-moz-focusring,
[type="reset"]:-moz-focusring, [type='reset']:-moz-focusring,
[type="submit"]:-moz-focusring { [type='submit']:-moz-focusring {
outline: 1px dotted ButtonText; outline: 1px dotted ButtonText;
} }
@ -133,23 +133,23 @@ textarea {
overflow: auto; overflow: auto;
} }
[type="checkbox"], [type='checkbox'],
[type="radio"] { [type='radio'] {
box-sizing: border-box; box-sizing: border-box;
padding: 0; padding: 0;
} }
[type="number"]::-webkit-inner-spin-button, [type='number']::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button { [type='number']::-webkit-outer-spin-button {
height: auto; height: auto;
} }
[type="search"] { [type='search'] {
-webkit-appearance: textfield; -webkit-appearance: textfield;
outline-offset: -2px; outline-offset: -2px;
} }
[type="search"]::-webkit-search-decoration { [type='search']::-webkit-search-decoration {
-webkit-appearance: none; -webkit-appearance: none;
} }

View File

@ -16,7 +16,6 @@ const (
allowed_formats = ['md', 'markdown', 'json', 'text', 'stdout', 'html', 'htm'] allowed_formats = ['md', 'markdown', 'json', 'text', 'stdout', 'html', 'htm']
vexe = os.getenv_opt('VEXE') or { @VEXE } vexe = os.getenv_opt('VEXE') or { @VEXE }
vroot = os.dir(vexe) vroot = os.dir(vexe)
tabs = ['\t\t', '\t\t\t\t\t\t', '\t\t\t\t\t\t\t']
) )
enum OutputType { enum OutputType {