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