From 29103c08abc47343238bcba53a908192376effe3 Mon Sep 17 00:00:00 2001 From: Josh Date: Tue, 30 Jun 2020 09:47:15 +1000 Subject: [matrix] Display navbar links on mobile --- docs/_static/icons.css | 10 ++++++++++ docs/_static/icons.woff | Bin 0 -> 2608 bytes docs/_static/style.css | 38 +++++++++++++++++--------------------- docs/_templates/layout.html | 8 +++++--- docs/images/snake.svg | 18 +++++++++--------- docs/images/snake_dark.svg | 18 +++++++++--------- 6 files changed, 50 insertions(+), 42 deletions(-) create mode 100644 docs/_static/icons.css create mode 100644 docs/_static/icons.woff (limited to 'docs') diff --git a/docs/_static/icons.css b/docs/_static/icons.css new file mode 100644 index 00000000..b237f109 --- /dev/null +++ b/docs/_static/icons.css @@ -0,0 +1,10 @@ +@font-face { + font-family: 'Custom Icons'; + font-style: normal; + font-weight: 400; + src: url('icons.woff') format('woff2'); +} + +.custom-icons { + font-family: 'Custom Icons' !important; +} diff --git a/docs/_static/icons.woff b/docs/_static/icons.woff new file mode 100644 index 00000000..50a340c4 Binary files /dev/null and b/docs/_static/icons.woff differ diff --git a/docs/_static/style.css b/docs/_static/style.css index 424d9089..d74db200 100644 --- a/docs/_static/style.css +++ b/docs/_static/style.css @@ -212,9 +212,9 @@ body { grid-auto-rows: min-content auto min-content; grid-template-areas: "s" + "h" "n" "c" - "h" "f"; } @@ -238,33 +238,38 @@ a:hover { header { grid-area: h; - background-color: var(--main-background); + background-color: var(--grey-6); color: var(--main-text); } header > nav { display: flex; flex-direction: row; - justify-content: space-evenly; + justify-content: flex-end; } header > nav > a { color: var(--white); } +.main-heading { + margin-right: auto; +} + +header > nav a:not(.main-heading) { + margin: 0 0.5em; +} + header > nav > a:hover { color: var(--white); text-decoration: underline; } -.main-heading { - display: none; -} - .sub-header { grid-area: n; background-color: var(--grey-6); color: var(--white); + display: none; } /* these aren't shown on mobile */ @@ -1007,21 +1012,12 @@ div.code-block-caption { "s f f f f f"; } - header { - background-color: var(--black); - } - - header > nav { - justify-content: flex-end; - } - - .main-heading { - margin-right: auto; - display: unset; + .mobile-only { + display: none; } - header > nav a:not(.main-heading) { - margin: 0 0.5em; + header { + background-color: var(--black); } .sub-header { @@ -1060,7 +1056,7 @@ div.code-block-caption { display: inline-block; position: sticky; top: 1em; - height: calc(100vh - 1em); + max-height: calc(100vh - 1em); overflow-y: auto; margin: 1em; } diff --git a/docs/_templates/layout.html b/docs/_templates/layout.html index 13452e08..ef5a81d2 100644 --- a/docs/_templates/layout.html +++ b/docs/_templates/layout.html @@ -9,6 +9,7 @@ + {%- block css %} {%- for css in css_files %} {%- if css|attr("filename") %} @@ -58,9 +59,10 @@
diff --git a/docs/images/snake.svg b/docs/images/snake.svg index 1f3521b5..aa741440 100644 --- a/docs/images/snake.svg +++ b/docs/images/snake.svg @@ -1,17 +1,17 @@ - - - - - - - - + + + + + + + + - + diff --git a/docs/images/snake_dark.svg b/docs/images/snake_dark.svg index 1517d60d..12022af4 100644 --- a/docs/images/snake_dark.svg +++ b/docs/images/snake_dark.svg @@ -1,17 +1,17 @@ - - - - - - - - + + + + + + + + - + -- cgit v1.2.3