Add mobile reachability header

This commit is contained in:
Svilen Markov 2024-05-08 01:21:55 +01:00
parent 976fb02bd3
commit 2389415071
3 changed files with 19 additions and 5 deletions

View File

@ -497,7 +497,7 @@ body {
animation-delay: 150ms; animation-delay: 150ms;
} }
.mobile-navigation { .mobile-navigation, .mobile-reachability-header {
display: none; display: none;
} }
@ -1027,6 +1027,15 @@ body {
.hide-on-mobile { .hide-on-mobile {
display: none display: none
} }
.mobile-reachability-header {
display: block;
font-size: 3rem;
padding: 10vh 1rem;
text-align: center;
color: var(--color-text-highlight);
animation: pageColumnsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
}
} }
.size-h1 { font-size: var(--font-size-h1); } .size-h1 { font-size: var(--font-size-h1); }

View File

@ -1,3 +1,7 @@
{{ if .Page.ShowMobileHeader }}
<div class="mobile-reachability-header">{{ .Page.Title }}</div>
{{ end }}
<div class="page-columns"> <div class="page-columns">
{{ range .Page.Columns }} {{ range .Page.Columns }}
<div class="page-column page-column-{{ .Size }}"> <div class="page-column page-column-{{ .Size }}">

View File

@ -57,6 +57,7 @@ type templateData struct {
type Page struct { type Page struct {
Title string `yaml:"name"` Title string `yaml:"name"`
Slug string `yaml:"slug"` Slug string `yaml:"slug"`
ShowMobileHeader bool `yaml:"show-mobile-header"`
Columns []Column `yaml:"columns"` Columns []Column `yaml:"columns"`
mu sync.Mutex mu sync.Mutex
} }