vdoc: refactor theme files (#19024)

.editorconfig

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

.github/workflows/module_docs_lint.yml

@@ -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

cmd/tools/vdoc/html.v

@@ -10,6 +10,7 @@ import v.ast
 import v.token
 import v.doc
 import v.pref
+import v.util { tabs }
 
 const (
 	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 }}',
 		vd.assets['dark_icon']).replace('{{ menu_icon }}', vd.assets['menu_icon']).replace('{{ head_assets }}',
 		if cfg.inline_assets {
-		'\n${tabs[0]}<style>' + vd.assets['doc_css'] + '</style>\n${tabs[0]}<style>' +
-			vd.assets['normalize_css'] + '</style>\n${tabs[0]}<script>' +
-			vd.assets['dark_mode_js'] + '</script>'
+		'<style>${vd.assets['doc_css']}</style>
+${tabs(2)}<style>${vd.assets['normalize_css']}</style>
+${tabs(2)}<script>${vd.assets['dark_mode_js']}</script>'
 	} else {
-		'\n${tabs[0]}<link rel="stylesheet" href="' + vd.assets['doc_css'] +
-			'" />\n${tabs[0]}<link rel="stylesheet" href="' + vd.assets['normalize_css'] +
-			'" />\n${tabs[0]}<script src="' + vd.assets['dark_mode_js'] + '"></script>'
+		'<link rel="stylesheet" href="${vd.assets['doc_css']}" />
+${tabs(2)}<link rel="stylesheet" href="${vd.assets['normalize_css']}" />
+${tabs(2)}<script src="${vd.assets['dark_mode_js']}"></script>'
 	}).replace('{{ toc_links }}', if cfg.is_multi || vd.docs.len > 1 {
 		modules_toc_str
 	} else {
 		symbols_toc_str
 	}).replace('{{ contents }}', contents.str()).replace('{{ right_content }}', if cfg.is_multi
 		&& 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 {
 		''
 	}).replace('{{ footer_content }}', gen_footer_text(d, !cfg.no_timestamp)).replace('{{ footer_assets }}',
 		if cfg.inline_assets {
-		'<script>' + vd.assets['doc_js'] + '</script>'
+		'<script>${vd.assets['doc_js']}</script>'
 	} else {
-		'<script src="' + vd.assets['doc_js'] + '"></script>'
+		'<script src="${vd.assets['doc_js']}"></script>'
 	})
 	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}'
 		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.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 {
-			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 {
 			dnw.write_string('<a class="link" rel="noreferrer" target="_blank" href="${link}">${link_svg}</a>')

cmd/tools/vdoc/theme/.prettierrc

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

cmd/tools/vdoc/theme/dark-mode.js

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

cmd/tools/vdoc/theme/doc.css

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

cmd/tools/vdoc/theme/doc.js

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

cmd/tools/vdoc/theme/index.html

@@ -1,26 +1,31 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
-  <meta charset="UTF-8">
+	<head>
+		<meta charset="UTF-8" />
 		<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>
-  <link rel="preconnect" href="https://fonts.googleapis.com">
-  <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 href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet">
-  <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">
+		<link rel="preconnect" href="https://fonts.googleapis.com" />
+		<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
+			href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap"
+			rel="stylesheet"
+		/>
+		<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>
+	</head>
 
-<body>
+	<body>
 		<div><a id="skip-to-content-link" href="#main-content">Skip to content</a></div>
 		<div id="page">
 			<header class="doc-nav hidden">
@@ -30,11 +35,18 @@
 							<div class="module">{{ head_name }}</div>
 							<div class="toggle-version-container">
 								<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>
 							{{ menu_icon }}
 						</div>
-          <input type="text" id="search" placeholder="Search... (beta)" autocomplete="off">
+						<input type="text" id="search" placeholder="Search... (beta)" autocomplete="off" />
 					</div>
 				</div>
 				<nav class="search hidden"></nav>
@@ -48,9 +60,7 @@
 				<div class="doc-container">
 					<div class="doc-content">
 						{{ contents }}
-          <div class="footer">
-            {{ footer_content }}
-          </div>
+						<div class="footer">{{ footer_content }}</div>
 					</div>
 					{{ right_content }}
 				</div>
@@ -58,6 +68,5 @@
 		</div>
 		{{ footer_assets }}
 		<script async src="search_index.js"></script>
-</body>
-
+	</body>
 </html>

cmd/tools/vdoc/theme/normalize.css

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

cmd/tools/vdoc/vdoc.v

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