mirror/v
1
0
Fork 0
mirror of https://github.com/vlang/v.git synced 2023-08-10 21:13:21 +03:00
Code Issues Projects Releases Wiki Activity

vdoc: adds missing color tags; change design of footer

Browse Source
This commit is contained in:
Daniel Däschle 2020-06-07 01:23:56 +02:00 committed by GitHub
parent 442030a7c8
commit eb42d2220f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
cmd/tools/vdoc-resources/doc.css
View File

@ -1,24 +1,23 @@
:root { :root {
--background-color: #fff; --background-color: #fff;
--timestamp-color: #b8c2cc;
--link-color: #2779bd; --link-color: #2779bd;
--font-color: #000; --text-color: #000;
--ref-symbol-color: #dae1e7; --ref-symbol-color: #dae1e7;
--ref-symbol-hover-color: #b8c2cc; --ref-symbol-hover-color: #b8c2cc;
--title-bottom-line-color: #f1f5f8; --title-bottom-line-color: #f1f5f8;
--footer-top-line-color: #f1f5f8; --footer-top-line-color: #f1f5f8;
--footer-font-color: #616161; --footer-text-color: #616161;
--code-signature-border-color: #a0aec0; --code-signature-border-color: #a0aec0;
--menu-background-color: #4b6c88; --menu-background-color: #4b6c88;
--menu-font-color: #fff; --menu-text-color: #fff;
--menu-indent-line-color: #3b3b3b66; --menu-indent-line-color: #3b3b3b66;
--menu-indent-line-active-color: #00000066; --menu-indent-line-active-color: #00000066;
--menu-scrollbar-color: #a0aec0; --menu-scrollbar-color: #a0aec0;
--menu-toggle-icon-color: #fff; --menu-toggle-icon-color: #fff;
--menu-toggle-icon-hover-color: #00000044; --menu-toggle-icon-hover-color: #00000044;
--menu-search-background-color: #00000044; --menu-search-background-color: #00000044;
--menu-search-font-color: #fff; --menu-search-text-color: #fff;
--toc-font-color: #2779bd; --toc-text-color: #2779bd;
--toc-indent-line-color: #dae1e7; --toc-indent-line-color: #dae1e7;
--code-default-text-color: #5c6e74; --code-default-text-color: #5c6e74;
--code-background-color: #edf2f7; --code-background-color: #edf2f7;
@ -39,24 +38,23 @@
.dark body { .dark body {
--background-color: #1a202c; --background-color: #1a202c;
--timestamp-color: #b8c2cc; --text-color: #fff;
--font-color: #fff;
--link-color: #90cdf4; --link-color: #90cdf4;
--ref-symbol-color: #2d3748; --ref-symbol-color: #2d3748;
--ref-symbol-hover-color: #4a5568; --ref-symbol-hover-color: #4a5568;
--title-bottom-line-color: #2d3748; --title-bottom-line-color: #2d3748;
--footer-top-line-color: #2d3748; --footer-top-line-color: #2d3748;
--footer-font-color: #bbd3e1; --footer-text-color: #bbd3e1;
--code-signature-border-color: #4a5568; --code-signature-border-color: #4a5568;
--menu-background-color: #2d3748; --menu-background-color: #2d3748;
--menu-font-color: #fff; --menu-text-color: #fff;
--menu-indent-line-color: #4a5568; --menu-indent-line-color: #4a5568;
--menu-indent-line-active-color: #90cdf4; --menu-indent-line-active-color: #90cdf4;
--menu-scrollbar-color: #4a5568; --menu-scrollbar-color: #4a5568;
--menu-toggle-icon-color: #fff; --menu-toggle-icon-color: #fff;
--menu-search-background-color: #4a5568; --menu-search-background-color: #4a5568;
--menu-search-font-color: #fff; --menu-search-text-color: #fff;
--toc-font-color: #90cdf4; --toc-text-color: #90cdf4;
--toc-indent-line-color: #1a202c; --toc-indent-line-color: #1a202c;
--code-default-text-color: #cbd5e0; --code-default-text-color: #cbd5e0;
--code-background-color: #2d3748; --code-background-color: #2d3748;
@ -73,7 +71,7 @@ body {
background-color: #fff; background-color: #fff;
background-color: var(--background-color); background-color: var(--background-color);
color: #000; color: #000;
color: var(--font-color); color: var(--text-color);
} }
/** Reset for menus */ /** Reset for menus */
@ -95,7 +93,7 @@ body {
background-color: #4b6c88; background-color: #4b6c88;
background-color: var(--menu-background-color); background-color: var(--menu-background-color);
color: #fff; color: #fff;
color: var(--menu-font-color); color: var(--menu-text-color);
flex-direction: column; flex-direction: column;
overflow-y: auto; overflow-y: auto;
height: 100vh; height: 100vh;
@ -179,7 +177,7 @@ body {
background-color: #00000044; background-color: #00000044;
background-color: var(--menu-search-background-color); background-color: var(--menu-search-background-color);
color: #fff; color: #fff;
color: var(--menu-search-font-color); color: var(--menu-search-text-color);
margin-left: -0.6rem; margin-left: -0.6rem;
margin-right: -0.6rem; margin-right: -0.6rem;
} }
@ -240,7 +238,7 @@ body {
} }
.doc-nav > .content a { .doc-nav > .content a {
color: #fff; color: #fff;
color: var(--menu-font-color); color: var(--menu-text-color);
text-decoration: none; text-decoration: none;
user-select: none; user-select: none;
} }
@ -261,16 +259,12 @@ body {
overflow: hidden; overflow: hidden;
} }
.doc-content a { .doc-content a {
color: #2779bd;
color: var(--link-color); color: var(--link-color);
} }
.doc-content > .doc-node:not(:last-child) { .doc-content > .doc-node:not(:last-child) {
padding: 1rem 0 3rem 0; padding: 1rem 0 3rem 0;
} }
.doc-content > .timestamp {
font-size: 0.8rem;
color: #b8c2cc;
color: var(--timestamp-color);
}
.doc-content > .doc-node > .title { .doc-content > .doc-node > .title {
display: flex; display: flex;
align-items: center; align-items: center;
@ -284,6 +278,7 @@ body {
fill: var(--ref-symbol-color); fill: var(--ref-symbol-color);
} }
.doc-content > .doc-node > .title > .link:hover { .doc-content > .doc-node > .title > .link:hover {
fill: #b8c2cc;
fill: var(--ref-symbol-hover-color); fill: var(--ref-symbol-hover-color);
} }
.doc-content > .doc-node h1 { .doc-content > .doc-node h1 {
@ -325,14 +320,21 @@ body {
.doc-content > .doc-node > .title h4 a:hover, .doc-content > .doc-node > .title h4 a:hover,
.doc-content > .doc-node > .title h5 a:hover, .doc-content > .doc-node > .title h5 a:hover,
.doc-content > .doc-node > .title h6 a:hover { .doc-content > .doc-node > .title h6 a:hover {
color: #b8c2cc;
color: var(--ref-symbol-hover-color); color: var(--ref-symbol-hover-color);
} }
.doc-content .footer { .doc-content > .footer {
padding-top: 1rem; padding-top: 1rem;
margin-top: auto; margin-top: auto;
bottom: 1rem; bottom: 1rem;
color: var(--footer-font-color); color: 616161;
border-top: 1px solid var(--footer-top-line-color); color: var(--footer-text-color);
border-color: #f1f5f8;
border-color: var(--footer-top-line-color);
border-top-style: solid;
border-top-width: 1px;
font-size: 0.8rem;
font-weight: 500;
} }
/* Right menu */ /* Right menu */
@ -355,7 +357,7 @@ body {
} }
.doc-toc a { .doc-toc a {
color: #2779bd; color: #2779bd;
color: var(--toc-font-color); color: var(--toc-text-color);
font-size: 0.9rem; font-size: 0.9rem;
font-weight: 600; font-weight: 600;
overflow: hidden; overflow: hidden;
@ -453,7 +455,6 @@ pre[class*="language-"] {
color: var(--code-function-text-color); color: var(--code-function-text-color);
} }
/* Medium screen and up */ /* Medium screen and up */
@media (min-width: 768px) { @media (min-width: 768px) {
.doc-container { .doc-container {

3
cmd/tools/vdoc.v
View File

@ -231,9 +231,10 @@ fn doc_node_html(dd doc.DocNode, link string, head bool, tb &table.Table) string
sym_name = '${dd.parent_type}.' + sym_name sym_name = '${dd.parent_type}.' + sym_name
} }
node_id := slug(sym_name) node_id := slug(sym_name)
hash_link := if head_tag != 'h1' { ' <a href="#$node_id">#</a>' } else { '' }
dnw.writeln('<section id="$node_id" class="doc-node">') dnw.writeln('<section id="$node_id" class="doc-node">')
if dd.name != 'README' { if dd.name != 'README' {
dnw.write('<div class="title"><$head_tag>$sym_name <a href="#$node_id">#</a></$head_tag>') dnw.write('<div class="title"><$head_tag>$sym_name$hash_link</$head_tag>')
if link.len != 0 { if link.len != 0 {
dnw.write('<a class="link" rel="noreferrer" target="_blank" href="$link">$link_svg</a>') dnw.write('<a class="link" rel="noreferrer" target="_blank" href="$link">$link_svg</a>')
} }