diff --git a/_layouts/page.html b/_layouts/page.html index 29390fc..73e8802 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -4,5 +4,32 @@ extra_html_headers: > --- -

{{ page.title }}

-{{ content }} + +
+

{{ page.title }}

+ {{ content }} +
diff --git a/_layouts/redirect.html b/_layouts/redirect.html index 5db4f53..2cd0164 100644 --- a/_layouts/redirect.html +++ b/_layouts/redirect.html @@ -4,6 +4,8 @@ extra_html_headers: | --- -

Redirecting

+
+

Redirecting

-

Redirecting you to {{ page.redirect_target }}.

+

Redirecting you to {{ page.redirect_target }}.

+
diff --git a/_layouts/skeleton.html b/_layouts/skeleton.html index b7fd0ad..beaca91 100644 --- a/_layouts/skeleton.html +++ b/_layouts/skeleton.html @@ -3,6 +3,10 @@ {% unless page.no_site_title %}{{ site.title }}: {% endunless %}{{ page.title }} + + + + {{ page.extra_html_headers | liquify }}{{ diff --git a/craiyon_111353.png b/craiyon_111353.png new file mode 100644 index 0000000..136ac19 Binary files /dev/null and b/craiyon_111353.png differ diff --git a/gitlab-logo-200.svg b/gitlab-logo-200.svg new file mode 100644 index 0000000..a4a66c6 --- /dev/null +++ b/gitlab-logo-200.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/gitlab-logo-500.svg b/gitlab-logo-500.svg new file mode 100644 index 0000000..95a22f1 --- /dev/null +++ b/gitlab-logo-500.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/gitlab-logo-700.svg b/gitlab-logo-700.svg new file mode 100644 index 0000000..72e3232 --- /dev/null +++ b/gitlab-logo-700.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/logo-256x256.png b/logo-256x256.png new file mode 100644 index 0000000..4b3a9ca Binary files /dev/null and b/logo-256x256.png differ diff --git a/logo-64x64.png b/logo-64x64.png new file mode 100644 index 0000000..f2c82d6 Binary files /dev/null and b/logo-64x64.png differ diff --git a/preserves.css b/preserves.css index 293099d..f1924e8 100644 --- a/preserves.css +++ b/preserves.css @@ -6,14 +6,87 @@ body { font-family: var(--serif-font); box-sizing: border-box; line-height: 1.414; + margin: 0; + padding: 0; } +body > nav { + display: flex; + background: #4a8fa3; /* #385c87; */ + color: white; + flex-flow: row nowrap; + box-shadow: 0 0 0.2rem #0000001a, 0 0.2rem 0.4rem #00000033; + padding: 0; + position: sticky; + right: 0; + top: 0; + z-index: 4; +} +body > nav > div { + display: flex; + flex-flow: row nowrap; + font-size: 1.2rem; + line-height: 2rem; + margin: 0; + padding: 1rem; +} +body > nav > div * { + margin: 0; + padding: 0; +} + +nav div { + flex-grow: 1; +} +nav div.middle { + justify-content: flex-end; + flex-grow: 0; + flex-basis: 40em; +} +@media screen and (max-width: 420px) { + nav div.middle { + display: none; + } +} + +nav div.right { + justify-content: flex-end; +} + +body > nav > * h1 { + font-size: 1.4rem; + font-weight: normal; + color: white; +} +body > nav > * a { + color: inherit; + text-decoration: none; +} +body > nav span.icon > img { + display: inline-block; + min-height: 48px; + max-height: 48px; + margin: -1.2rem 0; + line-height: 0; +} +body > nav ul { + display: flex; + margin: 0 -0.5rem; +} +body > nav ul > li { + display: block; + padding: 0 0.5rem; +} +@media screen and (max-width: 768px) { .md, .lg, .xl { display: none; } } +@media screen and (max-width: 992px) { .lg, .xl { display: none; } } +@media screen and (max-width: 1200px) { .xl { display: none; } } @media screen { - body { padding-top: 2rem; max-width: 40em; margin: auto; font-size: 120%; } + main { padding-top: 2rem; max-width: 40em; margin: auto; font-size: 120%; } hr { display: none; } } @media print { @page { size: letter; margin: 4rem 0rem 4.333rem 0rem; } - body { margin-left: 4.5rem; margin-right: 4.5rem; font-size: 10.5pt; } + body > nav { display: none; } + main { margin-left: 4.5rem; margin-right: 4.5rem; font-size: 10.5pt; } h1, h2 { page-break-before: always; margin-top: 0; } hr+* { page-break-before: always; margin-top: 0; } hr { display: none; } @@ -29,7 +102,7 @@ p, ul, table { margin: 1em 0; } -body { +main { counter-set: section 0 subsection 0 appendix 0; } h2:before, h3:before { @@ -47,7 +120,7 @@ h2:before, h3:before { } @media screen and (max-width: 53.33em) { - body { + main { margin-left: 2.33em; margin-right: 0.5em; }