Update global HTML architecture
This commit is contained in:
parent
8b596c0f6e
commit
5fcb946d10
18 changed files with 1689 additions and 1639 deletions
|
@ -6,23 +6,36 @@ const {t} = useI18n({useScope: 'local'});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ReloadPWA/>
|
<div id="appflex">
|
||||||
<main>
|
<div id="page">
|
||||||
<router-view></router-view>
|
<div class="action-bar">
|
||||||
</main>
|
<router-view name="ActionBar"></router-view>
|
||||||
<header>
|
</div>
|
||||||
<router-link to='/apps'>
|
<main id="content">
|
||||||
<img alt="" src="./assets/logo.svg"/>
|
<ReloadPWA/>
|
||||||
{{ t('home.apps') }}
|
<router-view></router-view>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
<div id="sidebar" class="sidebar">
|
||||||
|
<router-view name="Sidebar"></router-view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<header class="navbar">
|
||||||
|
<router-link :to="{name: 'Apps'}" class="home-link">
|
||||||
|
<img id="main-logo" alt="" src="./assets/logo.svg"/>
|
||||||
|
<span id="site-name">{{ t('home.apps') }}</span>
|
||||||
</router-link>
|
</router-link>
|
||||||
<select v-model="$i18n.locale" @change="$i18n.loadMessages()">
|
<div class="links">
|
||||||
<option value="de">Deutsch</option>
|
<router-view name="Links"></router-view>
|
||||||
<option value="en">English</option>
|
<select v-model="$i18n.locale" @change="$i18n.loadMessages()">
|
||||||
<option value="fr">Français</option>
|
<option value="de">Deutsch</option>
|
||||||
<option value="nl">Nederlands</option>
|
<option value="en">English</option>
|
||||||
</select>
|
<option value="fr">Français</option>
|
||||||
|
<option value="nl">Nederlands</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<footer>
|
<footer class="footer">
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
@ -42,8 +55,5 @@ const {t} = useI18n({useScope: 'local'});
|
||||||
@import './assets/css/theme-dark-hc.less';
|
@import './assets/css/theme-dark-hc.less';
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script>
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<i18n lang="json" locale="en" src="./locale/en.json"/>
|
<i18n lang="json" locale="en" src="./locale/en.json"/>
|
||||||
<i18n lang="json" locale="fr" src="./locale/fr.json"/>
|
<i18n lang="json" locale="fr" src="./locale/fr.json"/>
|
||||||
|
|
|
@ -1,25 +1,25 @@
|
||||||
.arrow {
|
.arrow {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 0;
|
width: 0;
|
||||||
height: 0;
|
height: 0;
|
||||||
&.up {
|
&.up {
|
||||||
border-left: 0.3rem solid transparent;
|
border-left: 0.3rem solid transparent;
|
||||||
border-right: 0.3rem solid transparent;
|
border-right: 0.3rem solid transparent;
|
||||||
border-bottom: 0.5rem solid var(--ArBgClr);
|
border-bottom: 0.5rem solid var(--ArBgClr);
|
||||||
}
|
}
|
||||||
&.down {
|
&.down {
|
||||||
border-left: 0.3rem solid transparent;
|
border-left: 0.3rem solid transparent;
|
||||||
border-right: 0.3rem solid transparent;
|
border-right: 0.3rem solid transparent;
|
||||||
border-top: 0.5rem solid var(--ArBgClr);
|
border-top: 0.5rem solid var(--ArBgClr);
|
||||||
}
|
}
|
||||||
&.right {
|
&.right {
|
||||||
border-top: 0.3rem solid transparent;
|
border-top: 0.3rem solid transparent;
|
||||||
border-bottom: 0.3rem solid transparent;
|
border-bottom: 0.3rem solid transparent;
|
||||||
border-left: 0.5rem solid var(--ArBgClr);
|
border-left: 0.5rem solid var(--ArBgClr);
|
||||||
}
|
}
|
||||||
&.left {
|
&.left {
|
||||||
border-top: 0.3rem solid transparent;
|
border-top: 0.3rem solid transparent;
|
||||||
border-bottom: 0.3rem solid transparent;
|
border-bottom: 0.3rem solid transparent;
|
||||||
border-right: 0.5rem solid var(--ArBgClr);
|
border-right: 0.5rem solid var(--ArBgClr);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,187 +1,187 @@
|
||||||
pre {
|
pre {
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
#content {
|
||||||
td.linenos, td.code {
|
td.linenos, td.code {
|
||||||
border: none;
|
border: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
> .highlight pre {
|
> .highlight pre {
|
||||||
border: none;
|
border: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
code {
|
|
||||||
color: var(--CdTClr);
|
|
||||||
padding: 0.25rem 0.1rem;
|
|
||||||
margin: 0;
|
|
||||||
font-size: 0.85em;
|
|
||||||
background-color: var(--CdBgClr);
|
|
||||||
border-bottom: var(--CdBClr) solid 0.2em;
|
|
||||||
a, a:visited {
|
|
||||||
color: var(--CdLClr);
|
|
||||||
&:hover {
|
|
||||||
color: var(--CdLHClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
td.linenos pre, pre span.lineno {
|
|
||||||
border-right: solid 0.3em var(--CdLnBClr);
|
|
||||||
background-color: var(--CdLnBgClr);
|
|
||||||
box-decoration-break: clone;
|
|
||||||
-webkit-box-decoration-break: clone;
|
|
||||||
color: var(--CdLnTClr);
|
|
||||||
white-space: pre;
|
|
||||||
overflow-wrap: normal;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre span.lineno {
|
|
||||||
float: left;
|
|
||||||
margin: 0 0.5rem 0 -0.5rem;
|
|
||||||
padding-left: 0.5rem;
|
|
||||||
box-decoration-break: clone;
|
|
||||||
-webkit-box-decoration-break: clone;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre, pre[class*="language-"] {
|
|
||||||
line-height: 1.4;
|
|
||||||
padding: 1.25rem 1.5rem 1.25rem 0.5rem;
|
|
||||||
margin: 0.85rem 0;
|
|
||||||
background-color: var(--PrBgClr);
|
|
||||||
color: var(--PrTClr);
|
|
||||||
border-left: var(--PrBClr) solid 0.5em;
|
|
||||||
box-decoration-break: clone;
|
|
||||||
-webkit-box-decoration-break: clone;
|
|
||||||
code {
|
code {
|
||||||
color: var(--PrTClr);
|
color: var(--CdTClr);
|
||||||
padding: 0;
|
padding: 0.25rem 0.1rem;
|
||||||
background-color: transparent;
|
margin: 0;
|
||||||
|
font-size: 0.85em;
|
||||||
|
background-color: var(--CdBgClr);
|
||||||
|
border-bottom: var(--CdBClr) solid 0.2em;
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--CdLClr);
|
||||||
|
&:hover {
|
||||||
|
color: var(--CdLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
a, a:visited {
|
|
||||||
color: var(--PrLClr);
|
td.linenos pre, pre span.lineno {
|
||||||
&:hover {
|
border-right: solid 0.3em var(--CdLnBClr);
|
||||||
color: var(--PrLHClr);
|
background-color: var(--CdLnBgClr);
|
||||||
}
|
box-decoration-break: clone;
|
||||||
|
-webkit-box-decoration-break: clone;
|
||||||
|
color: var(--CdLnTClr);
|
||||||
|
white-space: pre;
|
||||||
|
overflow-wrap: normal;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre span.lineno {
|
||||||
|
float: left;
|
||||||
|
margin: 0 0.5rem 0 -0.5rem;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
box-decoration-break: clone;
|
||||||
|
-webkit-box-decoration-break: clone;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre, pre[class*="language-"] {
|
||||||
|
line-height: 1.4;
|
||||||
|
padding: 1.25rem 1.5rem 1.25rem 0.5rem;
|
||||||
|
margin: 0.85rem 0;
|
||||||
|
background-color: var(--PrBgClr);
|
||||||
|
color: var(--PrTClr);
|
||||||
|
border-left: var(--PrBClr) solid 0.5em;
|
||||||
|
box-decoration-break: clone;
|
||||||
|
-webkit-box-decoration-break: clone;
|
||||||
|
code {
|
||||||
|
color: var(--PrTClr);
|
||||||
|
padding: 0;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--PrLClr);
|
||||||
|
&:hover {
|
||||||
|
color: var(--PrLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class*="language-"] {
|
div[class*="language-"] {
|
||||||
position: relative;
|
|
||||||
background-color: var(--CdBgClr);
|
|
||||||
box-decoration-break: clone;
|
|
||||||
-webkit-box-decoration-break: clone;
|
|
||||||
.highlight-lines {
|
|
||||||
padding-top: 1.3rem;
|
|
||||||
width: 100%;
|
|
||||||
line-height: 1.4;
|
|
||||||
.highlighted {
|
|
||||||
background-color: var(--CdBgAClr);
|
|
||||||
color: var(--CdAClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
pre, pre[class*="language-"] {
|
|
||||||
background: transparent;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
background-color: var(--CdBgClr);
|
||||||
}
|
box-decoration-break: clone;
|
||||||
&::before {
|
-webkit-box-decoration-break: clone;
|
||||||
z-index: 3;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
color: var(--CdT2Clr);
|
|
||||||
}
|
|
||||||
&:not(.line-numbers-mode) {
|
|
||||||
.line-numbers-wrapper {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.line-numbers-mode {
|
|
||||||
.highlight-lines {
|
.highlight-lines {
|
||||||
.highlighted {
|
padding-top: 1.3rem;
|
||||||
position: relative;
|
width: 100%;
|
||||||
&:before {
|
line-height: 1.4;
|
||||||
content: ' ';
|
.highlighted {
|
||||||
z-index: 3;
|
background-color: var(--CdBgAClr);
|
||||||
display: block;
|
color: var(--CdAClr);
|
||||||
width: var(--lineNumbersWrapperWidth);
|
|
||||||
height: 100%;
|
|
||||||
background-color: var(--CdBgAClr);
|
|
||||||
color: var(--CdBgClr);
|
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
pre {
|
pre, pre[class*="language-"] {
|
||||||
padding-left: var(--lineNumbersWrapperWidth);
|
background: transparent;
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
.line-numbers-wrapper {
|
|
||||||
width: var(--lineNumbersWrapperWidth);
|
|
||||||
text-align: center;
|
|
||||||
color: var(--PrLNClr);
|
|
||||||
padding: 1.25rem 0;
|
|
||||||
line-height: 1.4;
|
|
||||||
.line-number {
|
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 4;
|
z-index: 1;
|
||||||
font-size: 0.85em;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&::after {
|
&::before {
|
||||||
content: '';
|
z-index: 3;
|
||||||
z-index: 2;
|
font-size: 0.75rem;
|
||||||
width: var(--lineNumbersWrapperWidth);
|
color: var(--CdT2Clr);
|
||||||
height: 100%;
|
}
|
||||||
border-left: 0.5rem solid var(--PrB2Clr);
|
&:not(.line-numbers-mode) {
|
||||||
background-color: var(--PrBgClr);
|
.line-numbers-wrapper {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.line-numbers-mode {
|
||||||
|
.highlight-lines {
|
||||||
|
.highlighted {
|
||||||
|
position: relative;
|
||||||
|
&:before {
|
||||||
|
content: ' ';
|
||||||
|
z-index: 3;
|
||||||
|
display: block;
|
||||||
|
width: var(--lineNumbersWrapperWidth);
|
||||||
|
height: 100%;
|
||||||
|
background-color: var(--CdBgAClr);
|
||||||
|
color: var(--CdBgClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
pre {
|
||||||
|
padding-left: var(--lineNumbersWrapperWidth);
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.line-numbers-wrapper {
|
||||||
|
width: var(--lineNumbersWrapperWidth);
|
||||||
|
text-align: center;
|
||||||
|
color: var(--PrLNClr);
|
||||||
|
padding: 1.25rem 0;
|
||||||
|
line-height: 1.4;
|
||||||
|
.line-number {
|
||||||
|
position: relative;
|
||||||
|
z-index: 4;
|
||||||
|
font-size: 0.85em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
z-index: 2;
|
||||||
|
width: var(--lineNumbersWrapperWidth);
|
||||||
|
height: 100%;
|
||||||
|
border-left: 0.5rem solid var(--PrB2Clr);
|
||||||
|
background-color: var(--PrBgClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//for lang in js ts html md vue css sass scss less stylus go java c sh yaml rst rust zsh gdscript esc
|
//for lang in js ts html md vue css sass scss less stylus go java c sh yaml rst rust zsh gdscript esc
|
||||||
// div{'[class~="language-' + lang + '"]'}
|
// div{'[class~="language-' + lang + '"]'}
|
||||||
// &:before
|
// &:before
|
||||||
// content ('' + lang)
|
// content ('' + lang)
|
||||||
|
|
||||||
div[class~="language-javascript"] {
|
div[class~="language-javascript"] {
|
||||||
&:before {
|
&:before {
|
||||||
content: "js";
|
content: "js";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-typescript"] {
|
div[class~="language-typescript"] {
|
||||||
&:before {
|
&:before {
|
||||||
content: "ts";
|
content: "ts";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-markup"] {
|
div[class~="language-markup"] {
|
||||||
&:before {
|
&:before {
|
||||||
content: "html";
|
content: "html";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-markdown"] {
|
div[class~="language-markdown"] {
|
||||||
&:before {
|
&:before {
|
||||||
content: "md";
|
content: "md";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-json"]:before {
|
div[class~="language-json"]:before {
|
||||||
content: "json";
|
content: "json";
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-ruby"]:before {
|
div[class~="language-ruby"]:before {
|
||||||
content: "rb";
|
content: "rb";
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-python"]:before {
|
div[class~="language-python"]:before {
|
||||||
content: "py";
|
content: "py";
|
||||||
}
|
}
|
||||||
|
|
||||||
div[class~="language-bash"]:before {
|
div[class~="language-bash"]:before {
|
||||||
content: "sh";
|
content: "sh";
|
||||||
}
|
}
|
||||||
|
|
File diff suppressed because it is too large
Load diff
|
@ -1,120 +1,120 @@
|
||||||
.custom-block {
|
.custom-block {
|
||||||
background-color: var(--AaBgClr);
|
background-color: var(--AaBgClr);
|
||||||
border-color: var(--AaBClr);
|
border-color: var(--AaBClr);
|
||||||
color: var(--AaTClr);
|
color: var(--AaTClr);
|
||||||
a, a:visited {
|
|
||||||
color: var(--AaLClr);
|
|
||||||
:hover {
|
|
||||||
color: var(--AaLHClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.custom-block-title {
|
|
||||||
font-weight: 600;
|
|
||||||
margin-bottom: 0.4rem;
|
|
||||||
}
|
|
||||||
&.tip, &.warning, &.danger {
|
|
||||||
padding: .1rem 1.5rem;
|
|
||||||
border-left-width: .5rem;
|
|
||||||
border-left-style: solid;
|
|
||||||
margin: 1rem 0;
|
|
||||||
}
|
|
||||||
&.tip {
|
|
||||||
background-color: var(--AtBgClr);
|
|
||||||
border-color: var(--AtBClr);
|
|
||||||
color: var(--AtTClr);
|
|
||||||
a, a:visited {
|
a, a:visited {
|
||||||
color: var(--AtLClr);
|
color: var(--AaLClr);
|
||||||
:hover {
|
:hover {
|
||||||
color: var(--AtLHClr);
|
color: var(--AaLHClr);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
.custom-block-title {
|
||||||
&.hint {
|
font-weight: 600;
|
||||||
background-color: var(--AhBgClr);
|
margin-bottom: 0.4rem;
|
||||||
border-color: var(--AhBClr);
|
|
||||||
color: var(--AhTClr);
|
|
||||||
a, a:visited {
|
|
||||||
color: var(--AhLClr);
|
|
||||||
:hover {
|
|
||||||
color: var(--AhLHClr);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
&.tip, &.warning, &.danger {
|
||||||
&.important {
|
padding: .1rem 1.5rem;
|
||||||
background-color: var(--AiBgClr);
|
border-left-width: .5rem;
|
||||||
border-color: var(--AiBClr);
|
border-left-style: solid;
|
||||||
color: var(--AiTClr);
|
margin: 1rem 0;
|
||||||
a, a:visited {
|
|
||||||
color: var(--AiLClr);
|
|
||||||
:hover {
|
|
||||||
color: var(--AiLHClr);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
&.tip {
|
||||||
&.note {
|
background-color: var(--AtBgClr);
|
||||||
background-color: var(--AnBgClr);
|
border-color: var(--AtBClr);
|
||||||
border-color: var(--AnBClr);
|
color: var(--AtTClr);
|
||||||
color: var(--AnTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AtLClr);
|
||||||
color: var(--AnLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AtLHClr);
|
||||||
color: var(--AnLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.hint {
|
||||||
&.success {
|
background-color: var(--AhBgClr);
|
||||||
background-color: var(--AsBgClr);
|
border-color: var(--AhBClr);
|
||||||
border-color: var(--AsBClr);
|
color: var(--AhTClr);
|
||||||
color: var(--AsTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AhLClr);
|
||||||
color: var(--AsLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AhLHClr);
|
||||||
color: var(--AsLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.important {
|
||||||
&.warning {
|
background-color: var(--AiBgClr);
|
||||||
background-color: var(--AwBgClr);
|
border-color: var(--AiBClr);
|
||||||
border-color: var(--AwBClr);
|
color: var(--AiTClr);
|
||||||
color: var(--AwTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AiLClr);
|
||||||
color: var(--AwLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AiLHClr);
|
||||||
color: var(--AwLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.note {
|
||||||
&.caution {
|
background-color: var(--AnBgClr);
|
||||||
background-color: var(--AcBgClr);
|
border-color: var(--AnBClr);
|
||||||
border-color: var(--AcBClr);
|
color: var(--AnTClr);
|
||||||
color: var(--AcTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AnLClr);
|
||||||
color: var(--AcLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AnLHClr);
|
||||||
color: var(--AcLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.success {
|
||||||
&.danger {
|
background-color: var(--AsBgClr);
|
||||||
background-color: var(--AdBgClr);
|
border-color: var(--AsBClr);
|
||||||
border-color: var(--AdBClr);
|
color: var(--AsTClr);
|
||||||
color: var(--AdTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AsLClr);
|
||||||
color: var(--AdLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AsLHClr);
|
||||||
color: var(--AdLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.warning {
|
||||||
&.error {
|
background-color: var(--AwBgClr);
|
||||||
background-color: var(--AeBgClr);
|
border-color: var(--AwBClr);
|
||||||
border-color: var(--AeBClr);
|
color: var(--AwTClr);
|
||||||
color: var(--AeTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AwLClr);
|
||||||
color: var(--AeLClr);
|
:hover {
|
||||||
:hover {
|
color: var(--AwLHClr);
|
||||||
color: var(--AeLHClr);
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
&.caution {
|
||||||
|
background-color: var(--AcBgClr);
|
||||||
|
border-color: var(--AcBClr);
|
||||||
|
color: var(--AcTClr);
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--AcLClr);
|
||||||
|
:hover {
|
||||||
|
color: var(--AcLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.danger {
|
||||||
|
background-color: var(--AdBgClr);
|
||||||
|
border-color: var(--AdBClr);
|
||||||
|
color: var(--AdTClr);
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--AdLClr);
|
||||||
|
:hover {
|
||||||
|
color: var(--AdLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.error {
|
||||||
|
background-color: var(--AeBgClr);
|
||||||
|
border-color: var(--AeBClr);
|
||||||
|
color: var(--AeTClr);
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--AeLClr);
|
||||||
|
:hover {
|
||||||
|
color: var(--AeLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,37 +1,37 @@
|
||||||
input, textarea {
|
input, textarea {
|
||||||
background-color: var(--InBgClr);
|
background-color: var(--InBgClr);
|
||||||
color: var(--InTClr);
|
color: var(--InTClr);
|
||||||
border: solid 0.1em var(--InBClr);
|
border: solid 0.1em var(--InBClr);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
border-radius: 0.3em;
|
border-radius: 0.3em;
|
||||||
padding: 0.2em 0.8em 0.2em 0.8em;
|
padding: 0.2em 0.8em 0.2em 0.8em;
|
||||||
margin: 0.2em;
|
margin: 0.2em;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
||||||
+ span.validity {
|
+ span.validity {
|
||||||
height: 1.5em;
|
height: 1.5em;
|
||||||
width: 1.5ex;
|
width: 1.5ex;
|
||||||
|
|
||||||
&:invalid {
|
&:invalid {
|
||||||
border: solid 0.12em var(--AeBClr);
|
border: solid 0.12em var(--AeBClr);
|
||||||
|
}
|
||||||
|
&:focus {
|
||||||
|
border: solid 0.1em var(--InBClr);
|
||||||
|
}
|
||||||
|
+ span.validity::after {
|
||||||
|
content: "✘";
|
||||||
|
color: var(--AeBClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
&:focus {
|
|
||||||
border: solid 0.1em var(--InBClr);
|
|
||||||
}
|
|
||||||
+ span.validity::after {
|
|
||||||
content: "✘";
|
|
||||||
color: var(--AeBClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:valid {
|
&:valid {
|
||||||
border: solid 0.12em var(--AsBClr);
|
border: solid 0.12em var(--AsBClr);
|
||||||
&:focus {
|
&:focus {
|
||||||
border: solid 0.1em var(--InBClr);
|
border: solid 0.1em var(--InBClr);
|
||||||
|
}
|
||||||
|
+ span.validity::after {
|
||||||
|
content: "✓";
|
||||||
|
color: var(--AsBClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
+ span.validity::after {
|
|
||||||
content: "✓";
|
|
||||||
color: var(--AsBClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,53 +1,53 @@
|
||||||
// narrow desktop / iPad
|
// narrow desktop / iPad
|
||||||
@media (max-width: var(--MQNarrow)) {
|
@media (max-width: var(--MQNarrow)) {
|
||||||
.sidebar {
|
.sidebar {
|
||||||
font-size: 1.1rem;
|
font-size: 1.1rem;
|
||||||
width: var(--sidebarWidth);
|
width: var(--sidebarWidth);
|
||||||
}
|
}
|
||||||
.page {
|
#page {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// wide mobile
|
// wide mobile
|
||||||
@media (max-width: var(--MQMobile)) {
|
@media (max-width: var(--MQMobile)) {
|
||||||
.sidebar {
|
.sidebar {
|
||||||
top: 0;
|
top: 0;
|
||||||
transform: translateX(-100%);
|
transform: translateX(-100%);
|
||||||
transition: transform .2s ease;
|
transition: transform .2s ease;
|
||||||
margin-right: calc(0rem - var(--sidebarWidth));
|
margin-right: calc(0rem - var(--sidebarWidth));
|
||||||
}
|
|
||||||
.page {
|
|
||||||
padding-left: 0;
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
.home-link {
|
|
||||||
text-align: right;
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
.theme-container {
|
|
||||||
&.sidebar-open {
|
|
||||||
.sidebar {
|
|
||||||
transform: translateX(0);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&.no-navbar {
|
#page {
|
||||||
.sidebar {
|
padding-left: 0;
|
||||||
padding-top: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
.home-link {
|
||||||
|
text-align: right;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
.theme-container {
|
||||||
|
&.sidebar-open {
|
||||||
|
.sidebar {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.no-navbar {
|
||||||
|
.sidebar {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// narrow mobile
|
// narrow mobile
|
||||||
@media (max-width: var(--MQMobileNarrow)) {
|
@media (max-width: var(--MQMobileNarrow)) {
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 1.9rem;
|
font-size: 1.9rem;
|
||||||
}
|
}
|
||||||
.content {
|
#content {
|
||||||
div[class*="language-"] {
|
div[class*="language-"] {
|
||||||
margin: 0.85rem -1.5rem;
|
margin: 0.85rem -1.5rem;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,203 +1,203 @@
|
||||||
@media print {
|
@media print {
|
||||||
@page {
|
@page {
|
||||||
margin: 0mm !important;
|
margin: 0mm !important;
|
||||||
size: A4;
|
size: A4;
|
||||||
orphans:4;
|
orphans:4;
|
||||||
widows:3;
|
widows:3;
|
||||||
}
|
|
||||||
|
|
||||||
.print-only {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.no-print {
|
|
||||||
display: none !important;
|
|
||||||
div, section, span {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
main.content {
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar, .sidebar-mask, .nav-links,
|
|
||||||
.sidebar-button {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
html, body {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
font-size: 11pt;
|
|
||||||
size: A4;
|
|
||||||
height: 297mm;
|
|
||||||
width: 210mm;
|
|
||||||
hyphens: auto;
|
|
||||||
hyphenate-character: "\2013";
|
|
||||||
-webkit-hyphenate-character: "\2013";
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
word-break: break-word;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main_layout_table {
|
|
||||||
> tbody {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
> tfoot {
|
|
||||||
display: table-footer-group !important;
|
|
||||||
}
|
|
||||||
> thead {
|
|
||||||
display: table-header-group !important;
|
|
||||||
}
|
|
||||||
> thead #layout_header {
|
|
||||||
display: inline-block;
|
|
||||||
height: calc(var(--PrintHeaderHeight) + 1rem + 10mm);
|
|
||||||
min-height: calc(var(--PrintHeaderHeight) + 1rem + 10mm);
|
|
||||||
}
|
|
||||||
> tfoot #layout_footer {
|
|
||||||
display: inline-block;
|
|
||||||
height: calc(var(--PrintFooterHeight) + 1rem + 10mm);
|
|
||||||
min-height: calc(var(--PrintFooterHeight) + 1rem + 10mm);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#app {
|
|
||||||
display: block !important;
|
|
||||||
flex-flow: row nowrap !important;
|
|
||||||
justify-content: normal !important;
|
|
||||||
> * {
|
|
||||||
flex-grow: 0 !important;
|
|
||||||
flex-basis: auto !important;
|
|
||||||
flex-shrink: 0 !important;
|
|
||||||
}
|
|
||||||
#appflex {
|
|
||||||
display: block !important;
|
|
||||||
flex-flow: row nowrap !important;
|
|
||||||
flex-grow: 0 !important;
|
|
||||||
flex-basis: auto !important;
|
|
||||||
justify-content: normal !important;
|
|
||||||
> * {
|
|
||||||
flex-grow: 0 !important;
|
|
||||||
flex-basis: auto !important;
|
|
||||||
flex-shrink: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
footer.footer {
|
.print-only {
|
||||||
position: fixed !important;
|
display: block;
|
||||||
bottom: 0;
|
}
|
||||||
left: 0;
|
.no-print {
|
||||||
margin: 0 10mm 0 10mm;
|
display: none !important;
|
||||||
padding: 0 0 10mm 0;
|
div, section, span {
|
||||||
width: calc(100% - 20mm);
|
display: none !important;
|
||||||
height: var(--PrintFooterHeight);
|
}
|
||||||
z-index: 1000;
|
}
|
||||||
box-shadow: none;
|
|
||||||
p {
|
main#content {
|
||||||
|
width: 100%;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0.5em 0 0 0;
|
padding: 0;
|
||||||
line-height: 1.2em !important;
|
|
||||||
}
|
|
||||||
p, h1, h2, h3, h4, h5, h6 {
|
|
||||||
text-indent: 0;
|
|
||||||
}
|
|
||||||
a[href*='//']:after {
|
|
||||||
content:"";
|
|
||||||
}
|
|
||||||
#pagecount {
|
|
||||||
float: right;
|
|
||||||
height: 2em;
|
|
||||||
font-weight: bold;
|
|
||||||
content: counter(page) "/" counter(pages);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
header.navbar {
|
.sidebar, .sidebar-mask, .nav-links,
|
||||||
position: fixed !important;
|
.sidebar-button {
|
||||||
box-shadow: none;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: calc(100% - 20mm);
|
|
||||||
height: calc(var(--PrintHeaderHeight) + 10mm);
|
|
||||||
overflow: hidden;
|
|
||||||
z-index: 1000;
|
|
||||||
margin: 0 10mm 0 10mm;
|
|
||||||
padding: 10mm 0 0 0;
|
|
||||||
|
|
||||||
.home-link {
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
h1 {
|
html, body {
|
||||||
column-span: all;
|
padding: 0;
|
||||||
break-after: right;
|
margin: 0;
|
||||||
text-align: center;
|
font-size: 11pt;
|
||||||
margin-top: 25%;
|
size: A4;
|
||||||
font-size: 3em;
|
height: 297mm;
|
||||||
}
|
width: 210mm;
|
||||||
h2 {
|
hyphens: auto;
|
||||||
text-align: right;
|
hyphenate-character: "\2013";
|
||||||
column-span: all;
|
-webkit-hyphenate-character: "\2013";
|
||||||
break-before: page;
|
overflow-wrap: break-word;
|
||||||
break-after: avoid;
|
word-break: break-word;
|
||||||
padding-top: 0;
|
text-align: justify;
|
||||||
}
|
}
|
||||||
|
|
||||||
img, svg, h1, h2, h3, h4, h5, h6, span, a[data-lightbox] {
|
#main_layout_table {
|
||||||
break-inside: avoid !important;
|
> tbody {
|
||||||
}
|
overflow: hidden;
|
||||||
h3, h4, h5, h6 {
|
}
|
||||||
break-before: auto;
|
> tfoot {
|
||||||
break-after: avoid-page;
|
display: table-footer-group !important;
|
||||||
margin-bottom: 1.2em;
|
}
|
||||||
}
|
> thead {
|
||||||
pre, table, form, svg, .colspan {
|
display: table-header-group !important;
|
||||||
column-span: all;
|
}
|
||||||
margin-top: 1.5em;
|
> thead #layout_header {
|
||||||
margin-bottom: 1.5em;
|
display: inline-block;
|
||||||
}
|
height: calc(var(--PrintHeaderHeight) + 1rem + 10mm);
|
||||||
.flexgroup, .postlist-style-flex {
|
min-height: calc(var(--PrintHeaderHeight) + 1rem + 10mm);
|
||||||
display: block !important;
|
}
|
||||||
flex-flow: row nowrap !important;
|
> tfoot #layout_footer {
|
||||||
justify-content: normal !important;
|
display: inline-block;
|
||||||
> * {
|
height: calc(var(--PrintFooterHeight) + 1rem + 10mm);
|
||||||
border: none !important;
|
min-height: calc(var(--PrintFooterHeight) + 1rem + 10mm);
|
||||||
box-shadow: none !important;
|
}
|
||||||
flex-grow: 0 !important;
|
|
||||||
flex-basis: auto !important;
|
|
||||||
flex-shrink: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
p, li, span, h1, h2, h3, h4, h5, h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
hyphens: auto !important;
|
|
||||||
hyphenate-character: "\2013";
|
|
||||||
-webkit-hyphenate-character: "\2013";
|
|
||||||
word-break: break-word;
|
|
||||||
}
|
|
||||||
p, h1, h2, h3, h4, h5, h6 {
|
|
||||||
text-indent: 1.2em;
|
|
||||||
}
|
}
|
||||||
|
#app {
|
||||||
|
display: block !important;
|
||||||
|
flex-flow: row nowrap !important;
|
||||||
|
justify-content: normal !important;
|
||||||
|
> * {
|
||||||
|
flex-grow: 0 !important;
|
||||||
|
flex-basis: auto !important;
|
||||||
|
flex-shrink: 0 !important;
|
||||||
|
}
|
||||||
|
#appflex {
|
||||||
|
display: block !important;
|
||||||
|
flex-flow: row nowrap !important;
|
||||||
|
flex-grow: 0 !important;
|
||||||
|
flex-basis: auto !important;
|
||||||
|
justify-content: normal !important;
|
||||||
|
> * {
|
||||||
|
flex-grow: 0 !important;
|
||||||
|
flex-basis: auto !important;
|
||||||
|
flex-shrink: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
a[href*='//']:after {
|
footer.footer {
|
||||||
content:" [" attr(href) "]";
|
position: fixed !important;
|
||||||
font-style: italic;
|
bottom: 0;
|
||||||
text-decoration: underline;
|
left: 0;
|
||||||
}
|
margin: 0 10mm 0 10mm;
|
||||||
|
padding: 0 0 10mm 0;
|
||||||
|
width: calc(100% - 20mm);
|
||||||
|
height: var(--PrintFooterHeight);
|
||||||
|
z-index: 1000;
|
||||||
|
box-shadow: none;
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0.5em 0 0 0;
|
||||||
|
line-height: 1.2em !important;
|
||||||
|
}
|
||||||
|
p, h1, h2, h3, h4, h5, h6 {
|
||||||
|
text-indent: 0;
|
||||||
|
}
|
||||||
|
a[href*='//']:after {
|
||||||
|
content:"";
|
||||||
|
}
|
||||||
|
#pagecount {
|
||||||
|
float: right;
|
||||||
|
height: 2em;
|
||||||
|
font-weight: bold;
|
||||||
|
content: counter(page) "/" counter(pages);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.toctree-wrapper.compound, div.section, ul, ol, pre, blockquote, .admonition, form {
|
header.navbar {
|
||||||
display: block;
|
position: fixed !important;
|
||||||
|
box-shadow: none;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: calc(100% - 20mm);
|
||||||
|
height: calc(var(--PrintHeaderHeight) + 10mm);
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 1000;
|
||||||
|
margin: 0 10mm 0 10mm;
|
||||||
|
padding: 10mm 0 0 0;
|
||||||
|
|
||||||
|
.home-link {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
column-span: all;
|
||||||
|
break-after: right;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 25%;
|
||||||
|
font-size: 3em;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
text-align: right;
|
||||||
|
column-span: all;
|
||||||
|
break-before: page;
|
||||||
|
break-after: avoid;
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
img, svg, h1, h2, h3, h4, h5, h6, span, a[data-lightbox] {
|
||||||
|
break-inside: avoid !important;
|
||||||
|
}
|
||||||
|
h3, h4, h5, h6 {
|
||||||
|
break-before: auto;
|
||||||
|
break-after: avoid-page;
|
||||||
|
margin-bottom: 1.2em;
|
||||||
|
}
|
||||||
|
pre, table, form, svg, .colspan {
|
||||||
|
column-span: all;
|
||||||
|
margin-top: 1.5em;
|
||||||
|
margin-bottom: 1.5em;
|
||||||
|
}
|
||||||
|
.flexgroup, .postlist-style-flex {
|
||||||
|
display: block !important;
|
||||||
|
flex-flow: row nowrap !important;
|
||||||
|
justify-content: normal !important;
|
||||||
|
> * {
|
||||||
|
border: none !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
flex-grow: 0 !important;
|
||||||
|
flex-basis: auto !important;
|
||||||
|
flex-shrink: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
p, li, span, h1, h2, h3, h4, h5, h6 {
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
hyphens: auto !important;
|
||||||
|
hyphenate-character: "\2013";
|
||||||
|
-webkit-hyphenate-character: "\2013";
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
|
p, h1, h2, h3, h4, h5, h6 {
|
||||||
|
text-indent: 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
a[href*='//']:after {
|
||||||
|
content:" [" attr(href) "]";
|
||||||
|
font-style: italic;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toctree-wrapper.compound, div.section, ul, ol, pre, blockquote, .admonition, form {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.toctree-wrapper.compound, div.section, ul, ol, pre, blockquote, .admonition, table, form {
|
||||||
|
height: min-content;
|
||||||
|
justify-self: normal;
|
||||||
|
justify-content: normal;
|
||||||
|
break-inside: auto;
|
||||||
|
break-before: auto;
|
||||||
|
break-after: auto;
|
||||||
|
box-decoration-break: clone;
|
||||||
|
-webkit-box-decoration-break: clone;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.toctree-wrapper.compound, div.section, ul, ol, pre, blockquote, .admonition, table, form {
|
|
||||||
height: min-content;
|
|
||||||
justify-self: normal;
|
|
||||||
justify-content: normal;
|
|
||||||
break-inside: auto;
|
|
||||||
break-before: auto;
|
|
||||||
break-after: auto;
|
|
||||||
box-decoration-break: clone;
|
|
||||||
-webkit-box-decoration-break: clone;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,445 +1,445 @@
|
||||||
@import './wrapper.less';
|
@import './wrapper.less';
|
||||||
|
|
||||||
.navbar {
|
.navbar {
|
||||||
padding: 0.7rem 1.5rem;
|
padding: 0.7rem 1.5rem;
|
||||||
background: var(--NvBgClr);
|
background: var(--NvBgClr);
|
||||||
color: var(--NvTClr);
|
|
||||||
a, span, img {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.logo {
|
|
||||||
margin-right: 0.8rem;
|
|
||||||
vertical-align: top;
|
|
||||||
}
|
|
||||||
.site-name {
|
|
||||||
font-size: 1.3rem;
|
|
||||||
font-weight: 600;
|
|
||||||
color: var(--NvTClr);
|
color: var(--NvTClr);
|
||||||
}
|
a, span, img {
|
||||||
.links {
|
display: inline-block;
|
||||||
font-size: 0.9rem;
|
}
|
||||||
right: 1.5rem;
|
.logo {
|
||||||
top: 0.7rem;
|
margin-right: 0.8rem;
|
||||||
}
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
#site-name {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--NvTClr);
|
||||||
|
}
|
||||||
|
.links {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
right: 1.5rem;
|
||||||
|
top: 0.7rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-links {
|
.nav-links {
|
||||||
display: inline-block;
|
|
||||||
a, a:visited {
|
|
||||||
line-height: 1.4rem;
|
|
||||||
color: inherit;
|
|
||||||
&.link-active {
|
|
||||||
margin-bottom: -0.2em;
|
|
||||||
border-bottom: 0.2em solid var(--NvAClr);
|
|
||||||
}
|
|
||||||
&:hover {
|
|
||||||
margin-bottom: -0.2em;
|
|
||||||
border-bottom: 0.2em solid var(--NvLHClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.nav-item {
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: 1.5rem;
|
a, a:visited {
|
||||||
line-height: 2rem;
|
line-height: 1.4rem;
|
||||||
}
|
color: inherit;
|
||||||
.repo-link {
|
&.link-active {
|
||||||
margin-left: 1.5rem;
|
margin-bottom: -0.2em;
|
||||||
}
|
border-bottom: 0.2em solid var(--NvAClr);
|
||||||
.nav-links summary {
|
}
|
||||||
&:hover, &.link-active {
|
&:hover {
|
||||||
margin-bottom: -0.2em;
|
margin-bottom: -0.2em;
|
||||||
border-bottom: 0.2em solid var(--NvLClr);
|
border-bottom: 0.2em solid var(--NvLHClr);
|
||||||
cursor: pointer;
|
}
|
||||||
|
}
|
||||||
|
.nav-item {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 1.5rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
}
|
||||||
|
.repo-link {
|
||||||
|
margin-left: 1.5rem;
|
||||||
|
}
|
||||||
|
.nav-links summary {
|
||||||
|
&:hover, &.link-active {
|
||||||
|
margin-bottom: -0.2em;
|
||||||
|
border-bottom: 0.2em solid var(--NvLClr);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon.outbound {
|
.icon.outbound {
|
||||||
color: var(--TClr);
|
color: var(--TClr);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.page {
|
#page {
|
||||||
padding-top: 0rem;
|
padding-top: 0rem;
|
||||||
padding-bottom: 2rem;
|
padding-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.page-nav {
|
.page-nav {
|
||||||
.wrapper();
|
.wrapper();
|
||||||
padding-top: 1rem;
|
|
||||||
padding-bottom: 0;
|
|
||||||
.inner {
|
|
||||||
min-height: 2rem;
|
|
||||||
margin-top: 0;
|
|
||||||
border-top: 0.1em solid var(--BClr);
|
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
overflow: auto // clear float;
|
padding-bottom: 0;
|
||||||
}
|
.inner {
|
||||||
.next {
|
min-height: 2rem;
|
||||||
float: right;
|
margin-top: 0;
|
||||||
}
|
border-top: 0.1em solid var(--BClr);
|
||||||
|
padding-top: 1rem;
|
||||||
|
overflow: auto // clear float;
|
||||||
|
}
|
||||||
|
.next {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
font-size: 0.95em;
|
font-size: 0.95em;
|
||||||
background-color: var(--SdBgClr);
|
background-color: var(--SdBgClr);
|
||||||
width: var(--sidebarWidth);
|
width: var(--sidebarWidth);
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
box-sizing: border-box;
|
|
||||||
border-right: 0.2em solid var(--SdBClr);
|
|
||||||
box-shadow: 0 0 var(--SdBClr), -0.3em 0.1em 0.2em 0.3em var(--NvBgClr);
|
|
||||||
padding-left: 1em;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
a, a:visited {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.nav-links {
|
|
||||||
display: none;
|
|
||||||
border-bottom: 0.3em solid var(--SdBClr);
|
|
||||||
padding: 0.5rem 0 0.75rem 0;
|
|
||||||
a, a:visited {
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
.nav-item, .repo-link {
|
|
||||||
display: block;
|
|
||||||
line-height: 1.25rem;
|
|
||||||
font-size: 1.1em;
|
|
||||||
padding: 0.5rem 0 0.5rem 1.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.searchbox {
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 1.1em;
|
|
||||||
line-height: 1.5rem;
|
|
||||||
padding: 1rem 0 1.5rem 1.5rem;
|
|
||||||
border-bottom: 0.1em solid var(--BClr);
|
|
||||||
input[type='text'] {
|
|
||||||
width: calc(var(--sidebarWidth) - 4.5rem) !important;
|
|
||||||
margin-right: 1.5em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.sidebar-links {
|
|
||||||
padding: 1.5rem 0;
|
|
||||||
}
|
|
||||||
.toctree-l1 a, .toctree-l2 a, .toctree-l3 a, .toctree-l4 a {
|
|
||||||
font-weight: 400;
|
|
||||||
display: inline-block;
|
|
||||||
color: var(--SdTClr);
|
|
||||||
line-height: 1.4;
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-left: 0.5rem solid transparent;
|
border-right: 0.2em solid var(--SdBClr);
|
||||||
&.current {
|
box-shadow: 0 0 var(--SdBClr), -0.3em 0.1em 0.2em 0.3em var(--NvBgClr);
|
||||||
color: var(--SdAClr);
|
padding-left: 1em;
|
||||||
font-weight: 600;
|
|
||||||
|
ul {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
&:hover {
|
a, a:visited {
|
||||||
color: var(--SdLHClr);
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.nav-links {
|
||||||
|
display: none;
|
||||||
|
border-bottom: 0.3em solid var(--SdBClr);
|
||||||
|
padding: 0.5rem 0 0.75rem 0;
|
||||||
|
a, a:visited {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.nav-item, .repo-link {
|
||||||
|
display: block;
|
||||||
|
line-height: 1.25rem;
|
||||||
|
font-size: 1.1em;
|
||||||
|
padding: 0.5rem 0 0.5rem 1.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.searchbox {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 1.1em;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
padding: 1rem 0 1.5rem 1.5rem;
|
||||||
|
border-bottom: 0.1em solid var(--BClr);
|
||||||
|
input[type='text'] {
|
||||||
|
width: calc(var(--sidebarWidth) - 4.5rem) !important;
|
||||||
|
margin-right: 1.5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sidebar-links {
|
||||||
|
padding: 1.5rem 0;
|
||||||
|
}
|
||||||
|
.toctree-l1 a, .toctree-l2 a, .toctree-l3 a, .toctree-l4 a {
|
||||||
|
font-weight: 400;
|
||||||
|
display: inline-block;
|
||||||
|
color: var(--SdTClr);
|
||||||
|
line-height: 1.4;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-left: 0.5rem solid transparent;
|
||||||
|
&.current {
|
||||||
|
color: var(--SdAClr);
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: var(--SdLHClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-group .caption {
|
.sidebar-group .caption {
|
||||||
color: var(--SdT2Clr);
|
color: var(--SdT2Clr);
|
||||||
transition: color .15s ease;
|
transition: color .15s ease;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 0 1.5rem;
|
padding: 0 1.5rem;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
&.open, &:hover {
|
&.open, &:hover {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
.arrow {
|
.arrow {
|
||||||
top: -0.12em;
|
top: -0.12em;
|
||||||
left: 0.5em;
|
left: 0.5em;
|
||||||
}
|
}
|
||||||
&.open .arrow {
|
&.open .arrow {
|
||||||
top: -0.18em;
|
top: -0.18em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar .toctree-l1 ul {
|
.sidebar .toctree-l1 ul {
|
||||||
font-size: 0.95em;
|
font-size: 0.95em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toctree-l1.current a {
|
.toctree-l1.current a {
|
||||||
border-left: .5rem solid var(--SdA2Clr);
|
border-left: .5rem solid var(--SdA2Clr);
|
||||||
}
|
}
|
||||||
.toctree-l1 a {
|
.toctree-l1 a {
|
||||||
padding: 0.35rem 1rem 0.35rem 1.25rem;
|
padding: 0.35rem 1rem 0.35rem 1.25rem;
|
||||||
&.current {
|
&.current {
|
||||||
border-left-color: var(--SdAClr);
|
border-left-color: var(--SdAClr);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.toctree-l2 a {
|
.toctree-l2 a {
|
||||||
padding: 0.25rem 1rem 0.25rem 1.75rem;
|
padding: 0.25rem 1rem 0.25rem 1.75rem;
|
||||||
}
|
}
|
||||||
.toctree-l3 a {
|
.toctree-l3 a {
|
||||||
padding: 0.15rem 1rem 0.15rem 1.75rem;
|
padding: 0.15rem 1rem 0.15rem 1.75rem;
|
||||||
}
|
}
|
||||||
.toctree-l4 a {
|
.toctree-l4 a {
|
||||||
padding: 0.05rem 1rem 0.05rem 1.75rem;
|
padding: 0.05rem 1rem 0.05rem 1.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.home {
|
.home {
|
||||||
padding: var(--navbarHeight) 2rem 0;
|
padding: var(--navbarHeight) 2rem 0;
|
||||||
max-width: 96em;
|
max-width: 96em;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
.hero {
|
.hero {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
img {
|
img {
|
||||||
max-height: 28em;
|
max-height: 28em;
|
||||||
display: block;
|
display: block;
|
||||||
margin: 3rem auto 1.5rem;
|
margin: 3rem auto 1.5rem;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
||||||
|
h1, .description, .action {
|
||||||
|
margin: 1.8rem auto;
|
||||||
|
}
|
||||||
|
.description {
|
||||||
|
max-width: 35rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
line-height: 1.3;
|
||||||
|
color: var(--T2Clr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
h1 {
|
.footer {
|
||||||
font-size: 3rem;
|
padding: 2.5rem;
|
||||||
|
border-top: 0.1em solid var(--BClr);
|
||||||
|
text-align: center;
|
||||||
|
color: var(--FoTClr);
|
||||||
}
|
}
|
||||||
h1, .description, .action {
|
|
||||||
margin: 1.8rem auto;
|
|
||||||
}
|
|
||||||
.description {
|
|
||||||
max-width: 35rem;
|
|
||||||
font-size: 1.6rem;
|
|
||||||
line-height: 1.3;
|
|
||||||
color: var(--T2Clr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.footer {
|
|
||||||
padding: 2.5rem;
|
|
||||||
border-top: 0.1em solid var(--BClr);
|
|
||||||
text-align: center;
|
|
||||||
color: var(--FoTClr);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-button {
|
.sidebar-button {
|
||||||
display: none;
|
display: none;
|
||||||
width: 1.65rem;
|
width: 1.65rem;
|
||||||
height: 1.65rem;
|
height: 1.65rem;
|
||||||
padding: 0.2rem;
|
padding: 0.2rem;
|
||||||
border: 0.1em solid var(--NvBClr) !important;
|
border: 0.1em solid var(--NvBClr) !important;
|
||||||
border-radius: 0.1em !important;
|
border-radius: 0.1em !important;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
svg {
|
svg {
|
||||||
display: block;
|
display: block;
|
||||||
width: 1.25rem;
|
width: 1.25rem;
|
||||||
height: 1.25rem;
|
height: 1.25rem;
|
||||||
fill: var(--NvTClr);
|
fill: var(--NvTClr);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-group {
|
.sidebar-group {
|
||||||
&:not(.first) {
|
&:not(.first) {
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
}
|
}
|
||||||
.sidebar-group {
|
.sidebar-group {
|
||||||
padding-left: 0.5em;
|
padding-left: 0.5em;
|
||||||
}
|
}
|
||||||
&:not(.collapsable) {
|
&:not(.collapsable) {
|
||||||
.sidebar-heading {
|
.sidebar-heading {
|
||||||
cursor: auto;
|
cursor: auto;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-heading {
|
.sidebar-heading {
|
||||||
color: var(--SdTClr);
|
color: var(--SdTClr);
|
||||||
transition: color .15s ease;
|
transition: color .15s ease;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 0 1.5rem;
|
padding: 0 1.5rem;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
&.open, &:hover {
|
&.open, &:hover {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
.arrow {
|
.arrow {
|
||||||
top: -0.12em;
|
top: -0.12em;
|
||||||
left: 0.5em;
|
left: 0.5em;
|
||||||
}
|
}
|
||||||
&.open .arrow {
|
&.open .arrow {
|
||||||
top: -0.18em;
|
top: -0.18em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-group-items {
|
.sidebar-group-items {
|
||||||
transition: height .1s ease-out;
|
transition: height .1s ease-out;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar .sidebar-sub-headers {
|
.sidebar .sidebar-sub-headers {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
font-size: 0.95em;
|
font-size: 0.95em;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.sidebar-link, a:visited.sidebar-link {
|
a.sidebar-link, a:visited.sidebar-link {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
color: var(--SdLClr);
|
color: var(--SdLClr);
|
||||||
border-left: 0.25rem solid transparent;
|
border-left: 0.25rem solid transparent;
|
||||||
padding: 0.35rem 1rem 0.35rem 1.25rem;
|
padding: 0.35rem 1rem 0.35rem 1.25rem;
|
||||||
line-height: 1.4;
|
line-height: 1.4;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
&:hover {
|
&:hover {
|
||||||
color: var(--SdLHClr);
|
color: var(--SdLHClr);
|
||||||
}
|
}
|
||||||
&.active {
|
&.active {
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--SdAClr);
|
color: var(--SdAClr);
|
||||||
border-left-color: var(--SdAClr);
|
border-left-color: var(--SdAClr);
|
||||||
}
|
}
|
||||||
.sidebar-group & {
|
.sidebar-group & {
|
||||||
padding-left: 2rem;
|
padding-left: 2rem;
|
||||||
}
|
}
|
||||||
.sidebar-sub-headers & {
|
.sidebar-sub-headers & {
|
||||||
padding-top: 0.25rem;
|
padding-top: 0.25rem;
|
||||||
padding-bottom: 0.25rem;
|
padding-bottom: 0.25rem;
|
||||||
border-left: none;
|
border-left: none;
|
||||||
&.active {
|
&.active {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: var(--MQMobile)) {
|
@media (max-width: var(--MQMobile)) {
|
||||||
.navbar {
|
.navbar {
|
||||||
.can-hide {
|
.can-hide {
|
||||||
display: none;
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.nav-links {
|
|
||||||
.nav-item, .repo-link {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar {
|
|
||||||
z-index: 9;
|
|
||||||
.nav-links {
|
.nav-links {
|
||||||
display: block;
|
.nav-item, .repo-link {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.sidebar-links {
|
|
||||||
padding: 1rem 0;
|
|
||||||
}
|
|
||||||
&[opened] {
|
|
||||||
transform: translateX(0%);
|
|
||||||
transition: transform .2s ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-links details {
|
.sidebar {
|
||||||
summary {
|
z-index: 9;
|
||||||
font-size: 1.2em;
|
.nav-links {
|
||||||
font-weight: bold;
|
display: block;
|
||||||
margin-bottom: 0.2em;
|
}
|
||||||
|
.sidebar-links {
|
||||||
|
padding: 1rem 0;
|
||||||
|
}
|
||||||
|
&[opened] {
|
||||||
|
transform: translateX(0%);
|
||||||
|
transition: transform .2s ease;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
font-size: 0.9em;
|
|
||||||
font-weight: normal;
|
.nav-links details {
|
||||||
ul li.nav-link {
|
summary {
|
||||||
margin-left: 2.4em;
|
font-size: 1.2em;
|
||||||
a, a:visited, a:focus {
|
font-weight: bold;
|
||||||
|
margin-bottom: 0.2em;
|
||||||
|
}
|
||||||
|
font-size: 0.9em;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
ul li.nav-link {
|
||||||
|
margin-left: 2.4em;
|
||||||
|
a, a:visited, a:focus {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-button {
|
.sidebar-button {
|
||||||
display: inline;
|
display: inline;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: var(--MQMobile)) {
|
@media (min-width: var(--MQMobile)) {
|
||||||
.nav-links a, .nav-links a:visited {
|
.nav-links a, .nav-links a:visited {
|
||||||
&:hover, &.link-active {
|
&:hover, &.link-active {
|
||||||
color: var(--NvLClr);
|
color: var(--NvLClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
.nav-item > a:not(.external),
|
||||||
.nav-item > a:not(.external),
|
.nav-item > a:visited:not(.external) {
|
||||||
.nav-item > a:visited:not(.external) {
|
&:hover, &.link-active {
|
||||||
&:hover, &.link-active {
|
margin-bottom: -0.2em;
|
||||||
margin-bottom: -0.2em;
|
border-bottom: 0.2em solid var(--NvBClr);
|
||||||
border-bottom: 0.2em solid var(--NvBClr);
|
color: var(--NvLHClr);
|
||||||
color: var(--NvLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: var(--MQMobile)) {
|
@media (min-width: var(--MQMobile)) {
|
||||||
.nav-links summary {
|
.nav-links summary {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: var(--NvLClr);
|
color: var(--NvLClr);
|
||||||
&.link-active, .link-active {
|
&.link-active, .link-active {
|
||||||
color: var(--NvAClr);
|
color: var(--NvAClr);
|
||||||
margin-bottom: -0.2em;
|
margin-bottom: -0.2em;
|
||||||
border-bottom: 0.2em solid var(--NvAClr);
|
border-bottom: 0.2em solid var(--NvAClr);
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: var(--NvLHClr);
|
||||||
|
margin-bottom: -0.2em;
|
||||||
|
border-bottom: 0.2em solid var(--NvLHClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
&:hover {
|
.nav-item > a:not(.external),
|
||||||
color: var(--NvLHClr);
|
.nav-item > a:visited:not(.external) {
|
||||||
margin-bottom: -0.2em;
|
&.link-active {
|
||||||
border-bottom: 0.2em solid var(--NvLHClr);
|
margin-bottom: -0.2em;
|
||||||
|
border-bottom: 0.2em solid var(--NvAClr);
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
margin-bottom: -0.2em;
|
||||||
|
border-bottom: 0.2em solid var(--NvLHClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
.nav-item > a:not(.external),
|
|
||||||
.nav-item > a:visited:not(.external) {
|
|
||||||
&.link-active {
|
|
||||||
margin-bottom: -0.2em;
|
|
||||||
border-bottom: 0.2em solid var(--NvAClr);
|
|
||||||
}
|
|
||||||
&:hover {
|
|
||||||
margin-bottom: -0.2em;
|
|
||||||
border-bottom: 0.2em solid var(--NvLHClr);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: var(--MQMobileNarrow)) {
|
@media (max-width: var(--MQMobileNarrow)) {
|
||||||
.home {
|
.home {
|
||||||
padding-left: 1.5rem;
|
padding-left: 1.5rem;
|
||||||
padding-right: 1.5rem;
|
padding-right: 1.5rem;
|
||||||
.hero {
|
.hero {
|
||||||
img {
|
img {
|
||||||
max-height: 21em;
|
max-height: 21em;
|
||||||
margin: 2rem auto 1.2rem;
|
margin: 2rem auto 1.2rem;
|
||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
}
|
}
|
||||||
h1, .description, .action {
|
h1, .description, .action {
|
||||||
margin: 1.2rem auto;
|
margin: 1.2rem auto;
|
||||||
}
|
}
|
||||||
.description {
|
.description {
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: calc(var(--MQMobile) + 0.2ex)) {
|
@media (min-width: calc(var(--MQMobile) + 0.2ex)) {
|
||||||
.theme-container.no-sidebar {
|
.theme-container.no-sidebar {
|
||||||
.sidebar {
|
.sidebar {
|
||||||
display: none;
|
display: none;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
img.align-right, figure.align-right {
|
||||||
|
float: none;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.page {
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
img.align-right, figure.align-right {
|
|
||||||
float: none;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,245 +1,245 @@
|
||||||
.content .section {
|
#content .section {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
&:hover {
|
&:hover {
|
||||||
.headerlink {
|
.headerlink {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
#content {
|
||||||
// FIXME: sphinx should provide a citation-reference?
|
// FIXME: sphinx should provide a citation-reference?
|
||||||
& a:focus {
|
& a:focus {
|
||||||
// remove outline because padding mess it up
|
// remove outline because padding mess it up
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Use # as symbol for anchor headerlinks */
|
/* Use # as symbol for anchor headerlinks */
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1, h2, h3, h4, h5, h6 {
|
||||||
&:hover a.headerlink, &:hover a:visited.headerlink {
|
&:hover a.headerlink, &:hover a:visited.headerlink {
|
||||||
&::after {
|
&::after {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
content: "#";
|
content: "#";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a.headerlink, a:visited.headerlink {
|
a.headerlink, a:visited.headerlink {
|
||||||
font-size: 0.85em;
|
font-size: 0.85em;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
&:hover {
|
&:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.page-nav {
|
ul.page-nav {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
& li {
|
& li {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.body-header {
|
.action-bar {
|
||||||
display: flex;
|
display: flex;
|
||||||
& ul.page-nav {
|
& ul.page-nav {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
list-style-position: inside;
|
list-style-position: inside;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
margin-right: 2em;
|
margin-right: 2em;
|
||||||
& li + li:before {
|
& li + li:before {
|
||||||
content: "|";
|
content: "|";
|
||||||
padding: 0 1em;
|
padding: 0 1em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.breadcrumbs {
|
ul.breadcrumbs {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
& li {
|
& li {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/** index page **/
|
/** index page **/
|
||||||
.toctree-wrapper .caption {
|
.toctree-wrapper .caption {
|
||||||
// same as h2
|
// same as h2
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
line-height: 1.25em;
|
line-height: 1.25em;
|
||||||
font-size: 1.65rem;
|
font-size: 1.65rem;
|
||||||
padding-bottom: .3rem;
|
padding-bottom: .3rem;
|
||||||
border-bottom: 0.1em solid var(--BClr);
|
border-bottom: 0.1em solid var(--BClr);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/** footer **/
|
/** footer **/
|
||||||
.footer {
|
.footer {
|
||||||
clear: both;
|
clear: both;
|
||||||
min-height: 2rem;
|
min-height: 2rem;
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
color: var(--FoTClr);
|
color: var(--FoTClr);
|
||||||
font-size: small;
|
font-size: small;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/** pygments style **/
|
/** pygments style **/
|
||||||
.content .highlight {
|
#content .highlight {
|
||||||
border-radius: 0.5em;
|
border-radius: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
// force background color from pygments
|
// force background color from pygments
|
||||||
.content .highlight pre {
|
#content .highlight pre {
|
||||||
background-color: inherit;
|
background-color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content .highlighted {
|
#content .highlighted {
|
||||||
background-color: var(--AClr); //#fbe54e;
|
background-color: var(--AClr); //#fbe54e;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 0 4px;
|
padding: 0 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*** admonitions based on custom-blocks.styl */
|
/*** admonitions based on custom-blocks.styl */
|
||||||
.admonition {
|
.admonition {
|
||||||
padding: .1rem 1.5rem;
|
padding: .1rem 1.5rem;
|
||||||
border-left-width: .5rem;
|
border-left-width: .5rem;
|
||||||
border-left-style: solid;
|
border-left-style: solid;
|
||||||
box-decoration-break: clone;
|
box-decoration-break: clone;
|
||||||
-webkit-box-decoration-break: clone;
|
-webkit-box-decoration-break: clone;
|
||||||
height: min-content;
|
height: min-content;
|
||||||
margin: 1rem 0;
|
margin: 1rem 0;
|
||||||
// default color
|
// default color
|
||||||
background-color: var(--AaBgClr);
|
background-color: var(--AaBgClr);
|
||||||
border-color: var(--AaBClr);
|
border-color: var(--AaBClr);
|
||||||
color: var(--AaTClr);
|
color: var(--AaTClr);
|
||||||
a, a:visited {
|
a, a:visited {
|
||||||
color: var(--AaLClr);
|
color: var(--AaLClr);
|
||||||
&:hover {
|
&:hover {
|
||||||
color: var(--AaLHClr);
|
color: var(--AaLHClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.admonition-title {
|
.admonition-title {
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
margin-bottom: -0.4rem;
|
margin-bottom: -0.4rem;
|
||||||
}
|
|
||||||
&.success {
|
|
||||||
background-color: var(--AsBgClr);
|
|
||||||
border-color: var(--AsBClr);
|
|
||||||
color: var(--AsTClr);
|
|
||||||
a, a:visited {
|
|
||||||
color: var(--AsLClr);
|
|
||||||
&:hover {
|
|
||||||
color: var(--AsLHClr);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
&.success {
|
||||||
&.hint {
|
background-color: var(--AsBgClr);
|
||||||
background-color: var(--AhBgClr);
|
border-color: var(--AsBClr);
|
||||||
border-color: var(--AhBClr);
|
color: var(--AsTClr);
|
||||||
color: var(--AhTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AsLClr);
|
||||||
color: var(--AhLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AsLHClr);
|
||||||
color: var(--AhLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.hint {
|
||||||
&.tip {
|
background-color: var(--AhBgClr);
|
||||||
background-color: var(--AtBgClr);
|
border-color: var(--AhBClr);
|
||||||
border-color: var(--AtBClr);
|
color: var(--AhTClr);
|
||||||
color: var(--AtTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AhLClr);
|
||||||
color: var(--AtLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AhLHClr);
|
||||||
color: var(--AtLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.tip {
|
||||||
&.important {
|
background-color: var(--AtBgClr);
|
||||||
background-color: var(--AiBgClr);
|
border-color: var(--AtBClr);
|
||||||
border-color: var(--AiBClr);
|
color: var(--AtTClr);
|
||||||
color: var(--AiTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AtLClr);
|
||||||
color: var(--AiLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AtLHClr);
|
||||||
color: var(--AiLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.important {
|
||||||
&.note {
|
background-color: var(--AiBgClr);
|
||||||
background-color: var(--AnBgClr);
|
border-color: var(--AiBClr);
|
||||||
border-color: var(--AnBClr);
|
color: var(--AiTClr);
|
||||||
color: var(--AnTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AiLClr);
|
||||||
color: var(--AnLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AiLHClr);
|
||||||
color: var(--AnLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.note {
|
||||||
&.warning {
|
background-color: var(--AnBgClr);
|
||||||
background-color: var(--AwBgClr);
|
border-color: var(--AnBClr);
|
||||||
border-color: var(--AwBClr);
|
color: var(--AnTClr);
|
||||||
color: var(--AwTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AnLClr);
|
||||||
color: var(--AwLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AnLHClr);
|
||||||
color: var(--AwLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.warning {
|
||||||
&.danger {
|
background-color: var(--AwBgClr);
|
||||||
background-color: var(--AdBgClr);
|
border-color: var(--AwBClr);
|
||||||
border-color: var(--AdBClr);
|
color: var(--AwTClr);
|
||||||
color: var(--AdTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AwLClr);
|
||||||
color: var(--AdLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AwLHClr);
|
||||||
color: var(--AdLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.danger {
|
||||||
&.caution {
|
background-color: var(--AdBgClr);
|
||||||
background-color: var(--AcBgClr);
|
border-color: var(--AdBClr);
|
||||||
border-color: var(--AcBClr);
|
color: var(--AdTClr);
|
||||||
color: var(--AcTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AdLClr);
|
||||||
color: var(--AcLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AdLHClr);
|
||||||
color: var(--AcLHClr);
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
&.caution {
|
||||||
&.danger {
|
background-color: var(--AcBgClr);
|
||||||
background-color: var(--AdBgClr);
|
border-color: var(--AcBClr);
|
||||||
border-color: var(--AdBClr);
|
color: var(--AcTClr);
|
||||||
color: var(--AdTClr);
|
a, a:visited {
|
||||||
a, a:visited {
|
color: var(--AcLClr);
|
||||||
color: var(--AdLClr);
|
&:hover {
|
||||||
&:hover {
|
color: var(--AcLHClr);
|
||||||
color: var(--AdLHClr);
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
&.danger {
|
||||||
|
background-color: var(--AdBgClr);
|
||||||
|
border-color: var(--AdBClr);
|
||||||
|
color: var(--AdTClr);
|
||||||
|
a, a:visited {
|
||||||
|
color: var(--AdLClr);
|
||||||
|
&:hover {
|
||||||
|
color: var(--AdLHClr);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
blockquote {
|
blockquote {
|
||||||
background-color: var(--BqBgClr);
|
background-color: var(--BqBgClr);
|
||||||
border-color: var(--BqBClr);
|
border-color: var(--BqBClr);
|
||||||
box-decoration-break: clone;
|
box-decoration-break: clone;
|
||||||
-webkit-box-decoration-break: clone;
|
-webkit-box-decoration-break: clone;
|
||||||
margin-left: -0.4rem;
|
margin-left: -0.4rem;
|
||||||
color: var(--BqTClr);
|
color: var(--BqTClr);
|
||||||
a, a:visited {
|
a, a:visited {
|
||||||
color: var(--BqLClr);
|
color: var(--BqLClr);
|
||||||
&:hover {
|
&:hover {
|
||||||
color: var(--BqLHClr);
|
color: var(--BqLHClr);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
.table-of-contents {
|
.table-of-contents {
|
||||||
.badge {
|
.badge {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
.wrapper {
|
.wrapper {
|
||||||
max-width: var(--contentWidth);
|
max-width: var(--contentWidth);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 2rem 2.5rem;
|
padding: 2rem 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
.wrapper {
|
.wrapper {
|
||||||
max-width: var(--contentWidth);
|
max-width: var(--contentWidth);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 2rem 2.5rem;
|
padding: 2rem 2.5rem;
|
||||||
@media (max-width: var(--MQNarrow)) {
|
@media (max-width: var(--MQNarrow)) {
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
}
|
}
|
||||||
@media (max-width: var(--MQMobileNarrow)) {
|
@media (max-width: var(--MQMobileNarrow)) {
|
||||||
padding: 1.5rem;
|
padding: 1.5rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,6 +5,12 @@ const {t} = useI18n({useScope: 'local'});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<div class="admonition danger" v-if="$route.params.errorPath" role="alert">
|
||||||
|
<p class="admonition-title">{{ t('apps.not_found') }}</p>
|
||||||
|
<p>
|
||||||
|
{{ t('apps.route_not_found', {route: $route.params.errorPath.join('/')}) }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
<h1>{{ t('apps.communication') }}</h1>
|
<h1>{{ t('apps.communication') }}</h1>
|
||||||
<h1>{{ t('apps.accounting') }}</h1>
|
<h1>{{ t('apps.accounting') }}</h1>
|
||||||
<h1>{{ t('apps.ordering') }}</h1>
|
<h1>{{ t('apps.ordering') }}</h1>
|
||||||
|
|
|
@ -1,20 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<div v-if="offlineReady || needRefresh" role="alert">
|
<div v-if="offlineReady || needRefresh" role="alert">
|
||||||
<div class="admonition warning">
|
<div class="admonition warning">
|
||||||
<span v-if="offlineReady">
|
<p v-if="offlineReady">
|
||||||
{{ t('pwa.ready') }}
|
{{ t('pwa.ready') }}
|
||||||
</span>
|
</p>
|
||||||
<span v-else>
|
<p v-else>
|
||||||
{{ t('pwa.new_content') }}
|
{{ t('pwa.new_content') }}
|
||||||
</span>
|
</p>
|
||||||
</div>
|
<div class="">
|
||||||
<div class="">
|
<button v-if="needRefresh" @click="updateServiceWorker()">
|
||||||
<button v-if="needRefresh" @click="updateServiceWorker()">
|
{{ t('pwa.reload') }}
|
||||||
{{ t('pwa.reload') }}
|
</button>
|
||||||
</button>
|
<button @click="close">
|
||||||
<button @click="close">
|
{{ t('pwa.close') }}
|
||||||
{{ t('pwa.close') }}
|
</button>
|
||||||
</button>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -1,10 +1,12 @@
|
||||||
{
|
{
|
||||||
"apps": {
|
"apps": {
|
||||||
"communication": "",
|
"communication": "Communication",
|
||||||
"accounting": "",
|
"accounting": "Accounting",
|
||||||
"ordering": "",
|
"ordering": "Ordering",
|
||||||
"stocks": "",
|
"stocks": "Stocks",
|
||||||
"monitoring": ""
|
"monitoring": "Monitoring",
|
||||||
|
"not_found": "Page not found",
|
||||||
|
"route_not_found": "Url {route} does not exist."
|
||||||
},
|
},
|
||||||
"home": {
|
"home": {
|
||||||
"apps": "Applications"
|
"apps": "Applications"
|
||||||
|
|
|
@ -4,7 +4,9 @@
|
||||||
"accounting": "Comptabilité",
|
"accounting": "Comptabilité",
|
||||||
"ordering": "Commande",
|
"ordering": "Commande",
|
||||||
"stocks": "Stocks",
|
"stocks": "Stocks",
|
||||||
"monitoring": "Veille"
|
"monitoring": "Veille",
|
||||||
|
"not_found": "Page introuvable",
|
||||||
|
"route_not_found": "La route {route} n'existe pas."
|
||||||
},
|
},
|
||||||
"home": {
|
"home": {
|
||||||
"apps": "Applications"
|
"apps": "Applications"
|
||||||
|
|
|
@ -7,8 +7,36 @@ const Apps = () => import('./components/NervTNApps.vue');
|
||||||
const Dashboard = () => import('./components/Dashboard.vue');
|
const Dashboard = () => import('./components/Dashboard.vue');
|
||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
{path: '/', component: Dashboard},
|
{
|
||||||
{path: '/apps', component: Apps}
|
path: '/',
|
||||||
|
name: "Dashboard",
|
||||||
|
components: {
|
||||||
|
default: Dashboard,
|
||||||
|
//Links: {},
|
||||||
|
//Sidebar: {},
|
||||||
|
//ActionBar: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/apps',
|
||||||
|
name: "Apps",
|
||||||
|
components: {
|
||||||
|
default: Apps,
|
||||||
|
//Links: {},
|
||||||
|
//Sidebar: {},
|
||||||
|
//ActionBar: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/:errorPath(.*)*',
|
||||||
|
name: "NotFound",
|
||||||
|
components: {
|
||||||
|
default: Apps,
|
||||||
|
//Links: {},
|
||||||
|
//Sidebar: {},
|
||||||
|
//ActionBar: {}
|
||||||
|
}
|
||||||
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
const router = VueRouter.createRouter({
|
const router = VueRouter.createRouter({
|
||||||
|
|
Loading…
Reference in a new issue