schulischer-schabernack/site
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Make navbar handle longer descriptions better

Browse source 
This is achieved by using a smaller font and enabling hyphenation (where
possible) and justification.
This commit is contained in:
Simon Bruder 2021-11-30 20:29:40 +01:00
parent bf5565cd76
commit 4817f92495
Signed by: simon
GPG key ID: 8D3C82F9F309F8EC
2 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
sass/style.scss
View file

@ -11,6 +11,7 @@ $navbar-breakpoint: 640px;
@import "../vendor/bulma/sass/grid/columns"; @import "../vendor/bulma/sass/grid/columns";
@import "../vendor/bulma/sass/helpers/color"; @import "../vendor/bulma/sass/helpers/color";
@import "../vendor/bulma/sass/helpers/spacing"; @import "../vendor/bulma/sass/helpers/spacing";
@import "../vendor/bulma/sass/helpers/typography";
@import "../vendor/bulma/sass/layout/footer"; @import "../vendor/bulma/sass/layout/footer";
#page-wrapper { #page-wrapper {
@ -29,6 +30,13 @@ $navbar-breakpoint: 640px;
padding: 2rem 7.6%; padding: 2rem 7.6%;
} }
#navbar-description {
// Better layout (small column)
// only works with Firefox, though
hyphens: auto;
text-align: justify;
}
nav { nav {
padding: 0 7.6%; padding: 0 7.6%;
} }

2
templates/base.html
View file

@ -60,7 +60,7 @@
<aside class="column" aria-label="Sekundärer Inhalt"> <aside class="column" aria-label="Sekundärer Inhalt">
<h3>{{ config.title }}</h3> <h3>{{ config.title }}</h3>
{{ macros::podlove_subscribe_button(size="big") }} {{ macros::podlove_subscribe_button(size="big") }}
<p>{{ config.description }}</p> <p id="navbar-description" class="is-size-7">{{ config.description }}</p>
</aside> </aside>
</div> </div>
</div> </div>