borgmatic/docs/_includes/index.css

532 lines
25 KiB
CSS
Raw Normal View History

@font-face {
font-family: BenchNine;
src: url("data:font/woff2;charset=utf-8;base64,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
font-weight: 700;
font-display: swap;
unicode-range: U+20-7E,U+2014,U+2019;
}
* {
box-sizing: border-box;
}
body {
font-family: system-ui, sans-serif;
margin: 0;
color: #222;
}
img {
border: 0;
}
a,
a:visited,
a[href] {
color: #222;
}
strong,
b {
font-weight: 600;
}
hr {
margin: 3em 0;
border: none;
border-top: 1px solid #ddd;
}
p {
max-width: 42em;
line-height: 1.5;
}
/* Blockquotes */
blockquote {
font-family: Georgia, serif;
font-size: 1.1875em; /* 19px /16 */
color: #666;
margin: 1.5em 0;
padding: 0 1em;
max-width: 31.57894736842em; /* 600px /19 */
border-left: 6px solid #ddd;
/*text-indent: -0.3684210526316em;*/ /* 7px /19 */
}
blockquote + blockquote {
margin-top: 2em;
}
blockquote img {
height: 1.3em;
width: 1.3em;
border-radius: 50%;
vertical-align: text-top;
margin-left: 2px;
margin-right: 6px;
}
/* Main */
main {
font-size: 1.125em; /* 18px /16 */
}
main:not(:empty) {
padding-bottom: 3em;
margin-bottom: 3em;
}
/* Tables */
table {
border-collapse: collapse;
margin-bottom: 2em;
}
table th,
table td {
text-align: left;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
padding: .4em;
font-size: 0.8125em; /* 13px /16 */
}
table th:first-child,
table td:first-child {
padding-left: 0;
}
table th {
border-color: #ddd;
}
h2 + table {
margin-top: -0.625em; /* -10px /16 */
}
@media (min-width: 37.5em) { /* 600px */
table th,
table td {
padding: .4em .8em;
font-size: 1em; /* 16px /16 */
}
}
/* Headings */
h1,
h2,
h3,
h4,
h5 {
font-family: BenchNine, system-ui, sans-serif;
}
h1 {
font-size: 2.666666666667em; /* 48px /18 */
margin: 0 0 .5em;
}
main .elv-toc + h1 {
margin-top: 1em;
}
main h1:first-child,
main .elv-toc + h1 {
border-bottom: 2px dotted #666;
}
@media (min-width: 64em) { /* 1024px */
main .elv-toc + h1,
main .elv-toc + h2 {
margin-top: 0;
}
}
h2 {
font-size: 2.222222222222em; /* 40px /18 */
border-bottom: 1px solid #ddd;
margin: 1em 0 .25em;
}
h3 {
font-size: 1.666666666667em; /* 30px /18 */
margin-bottom: .5em;
}
h4 {
font-size: 1.444444444444em; /* 26px /18 */
margin-bottom: .5em;
}
h5 {
font-size: 1.277777777778em; /* 23px /18 */
margin-bottom: .5em;
}
main h1,
main h2,
main h3 {
text-transform: uppercase;
}
h1 code,
h2 code,
h3 code,
h4 code,
h5 code {
font-family: inherit;
text-transform: none;
}
/* Lists */
ul {
padding: 0 1em;
}
li {
padding: .25em 0;
}
li ul {
margin: .5em 0;
padding-left: 1em;
}
li li {
padding-top: .1em;
padding-bottom: .1em;
}
/* Syntax highlighting and Code blocks */
pre {
display: block;
padding: .5em;
margin: 1em -.5em 2em -.5em;
overflow-x: auto;
background-color: #fafafa;
font-size: 0.75em; /* 12px /16 */
}
pre,
code {
font-family: Monaco, monospace;
}
code {
-ms-word-break: break-all;
word-break: break-word;
-webkit-hyphens: manual;
-moz-hyphens: manual;
hyphens: manual;
background-color: #fafafa;
}
pre + pre[class*="language-"] {
margin-top: 1em;
}
pre + .note {
font-size: 0.6666666666667em; /* 16px /24 */
margin-top: -2.875em; /* 46px /16 */
margin-bottom: 2.5em; /* 40px /16 */
text-align: right;
}
@media (min-width: 37.5em) { /* 600px */
pre {
font-size: 0.75em; /* 16px /16 */
}
}
#quick-start ~ .language-text {
border-top: 2px solid #666;
border-bottom: 2px solid #666;
}
@media (min-width: 42em) { /* 672px */
#quick-start ~ .language-text {
border: 2px solid #666;
}
}
#quick-start ~ .language-text,
#quick-start ~ .language-text code {
background-color: #fafafa;
color: #222;
}
/* Layout */
.elv-layout {
padding: 1rem;
margin: 0 auto;
max-width: 42rem;
clear: both;
}
header.elv-layout {
padding: 0 1rem;
}
footer.elv-layout {
margin-bottom: 5em;
}
.elv-layout-full {
max-width: none;
}
@media (min-width: 64em) { /* 1024px */
.elv-layout-toc {
padding-left: 15rem;
max-width: 60rem;
margin-right: 1rem;
position: relative;
}
}
/*.elv-layout-wider {
max-width: 60rem;
}*/
/* Header */
.elv-header {
position: relative;
}
.elv-header-default {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-top: 0;
}
.elv-header-c {
width: 100%;
}
.elv-header-docs .elv-header-c {
padding: 1rem 0;
}
.elv-header-docs:before,
.elv-header-docs:after {
content: " ";
display: table;
}
.elv-header-docs:after {
clear: both;
}
/* Header Hero */
.elv-hero {
background-color: #222;
}
@media (prefers-color-scheme: dark) {
.elv-hero {
background-color: #292929;
}
}
.elv-hero img,
.elv-hero svg {
width: 42.95774646vh;
height: 60vh;
}
.elv-hero:hover img,
.elv-hero:hover svg {
background-color: inherit;
}
.elv-header-default .elv-hero {
display: flex;
justify-content: center;
width: calc(100% + 2rem);
margin-left: -1rem;
margin-right: -1rem;
}
.elv-hero:hover {
background-color: #333;
}
.elv-header-docs .elv-hero {
float: left;
margin-right: .5em;
}
.elv-header-default .elv-hero img,
.elv-header-default .elv-hero svg {
position: relative;
background-color: transparent;
z-index: 1;
}
.elv-header-docs .elv-hero img,
.elv-header-docs .elv-hero svg {
width: auto;
height: 3em;
}
@media (min-width: 43.75em) { /* 700px */
.elv-header-docs .elv-hero {
margin-right: 1em;
}
.elv-header-docs .elv-hero img,
.elv-header-docs .elv-hero svg {
width: 4.303125em; /* 68.85px /16 */
height: 6em;
}
}
/* Header Possum */
.elv-possum-anchor {
display: block;
}
.elv-possum {
position: absolute;
right: .5rem;
top: 1rem;
transition: .3s opacity ease-out;
}
.elv-header-docs .elv-possum {
width: 15vw;
max-width: 6.25rem; /* 100px /16 */
}
.elv-header-default {
overflow: hidden;
}
.elv-header-default .elv-possum {
pointer-events: none;
width: auto;
height: calc((60vh - 2rem) / 1.6);
top: 36%;
left: 1vw;
right: auto;
animation-duration: 180s;
animation-name: balloonFloat;
}
@media (prefers-reduced-motion: reduce) {
.elv-header-default .elv-possum {
display: none;
}
}
/* Navigation */
.elv-nav {
padding: 0;
margin: 1em 0 0 0;
clear: both;
list-style: none;
}
.elv-nav-item {
float: left;
padding-left: .25em;
padding-right: .25em;
font-size: 0.8125rem; /* 13px /16 */
}
.elv-nav-item:first-child {
padding-left: 0;
}
.elv-nav-item:last-child {
padding-right: 0;
}
.elv-nav-item a {
font-weight: 600;
}
.elv-nav-item .elv-nav-light {
font-weight: 300;
}
@media (min-width: 20em) { /* 320px */
.elv-nav-item {
font-size: 4vw;
}
}
@media (min-width: 25em) { /* 400px */
.elv-nav-item {
font-size: 1rem; /* 16px /16 */
padding-left: .45em;
padding-right: .45em;
}
}
@media (min-width: 35.625em) { /* 570px */
.elv-nav {
clear: none;
width: auto;
margin-top: 0;
}
.elv-nav-item {
float: left;
padding-left: 0;
padding-right: 0;
}
.elv-nav-item a:not(:hover) {
text-decoration: none;
}
.elv-nav-item:not(:first-child):before {
content: "";
border-left: 1px solid #ccc;
padding: 0 0 0 .75em;
margin-left: .75em;
}
}
/* Version */
.latestversion {
font-size: 2em;
margin-top: 0;
}
.latestversion code {
font-size: 0.75em; /* 24px /32 */
}
.latestversion {
font-family: BenchNine, system-ui, sans-serif;
}
.tmpl-docs .latestversion {
position: absolute;
top: 1rem;
right: 1rem;
margin: 0;
}
/* News */
.news {
text-align: center;
}
/* Direct Links / Markdown Headers */
.direct-link {
font-family: sans-serif;
text-decoration: none;
font-style: normal;
margin-left: .1em;
}
a[href].direct-link,
a[href].direct-link:visited {
color: transparent;
}
a[href].direct-link:focus,
a[href].direct-link:focus:visited,
:hover > a[href].direct-link,
:hover > a[href].direct-link:visited,
:focus > a[href].direct-link,
:focus > a[href].direct-link:visited {
color: #aaa;
}
/* dont use a direct link, should be a link to the page */
main .elv-toc + h1 .direct-link {
display: none;
}
/* Style Guide */
.elv-sg-component {
background-color: #f9f9f9;
border-top: 1px dotted #ddd;
border-bottom: 1px dotted #ddd;
margin: 2rem 0;
}
/* Screen readers only */
.sr-only {
position: absolute;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
/* Language List */
.elv-langlist {
font-size: 0.8333333333333em; /* 15px /18 */
background-color: #f7f7f7;
padding: .5rem;
margin: 2em 0;
}
.elv-langlist-hed {
margin: 0;
float: left;
border: none;
font-size: 1.4em; /* 21px /15 */
}
.elv-langlist > .inlinelist {
display: inline;
margin-left: 1em;
}
@media (min-width: 37.5em) { /* 600px */
.quicktipstoc {
margin: 0 0 3% 3%;
float: right;
width: 32%;
border-radius: .25em;
font-size: 0.8125em; /* 13px /16 */
}
}
/* Breakpoint Overrides */
@media (max-width: 37.4375em) { /* 599px */
.bp-notsm.bp-notsm.bp-notsm.bp-notsm {
display: none;
}
}
@media (min-width: 37.5em) { /* 600px */
.bp-sm.bp-sm.bp-sm.bp-sm {
display: none ;
}
}