content: improve verses layout for small screens

* Improves the line-height globally.
* Adds the verse class to the content block according to the layout key
  of the front matter.
* Styles the verses.

Co-Authored-by: iGor milhit <igor@milhit.ch>
merge-requests/4/head
iGor milhit 2021-04-01 21:50:06 +02:00
parent 0190c233e9
commit 029a3ac174
Signed by: igor
GPG Key ID: 692D97C3D0228A99
6 changed files with 31 additions and 7 deletions

View File

@ -1,3 +1,8 @@
# portfoliGor # portfoliGor
Yet another HUGO portfolio theme, that I will use for igor.milhit.ch. Yet another HUGO portfolio theme, that I will use for igor.milhit.ch.
## Configuration
- Add `layout: verse` to improve format for text in verse. Verse should be
separated by a line break, strophes are paragraphs.

View File

@ -26,8 +26,8 @@ nav,
} }
} }
.content { .container {
line-height: 1.4; // TODO: fix homepage line-height: $line-height-base; // TODO: fix homepage
} }
.smallcaps { .smallcaps {

View File

@ -0,0 +1,17 @@
////////////////////
// //
// Textes //
// //
////////////////////
.verse {
line-height: $line-height-verse;
p {
margin-bottom: 1rem;
}
br {
margin-bottom: .5rem;
}
}

View File

@ -1,11 +1,10 @@
/////////////////// /////////////////// // FONT // //
// //
// FONT //
// //
/////////////////// ///////////////////
$font-size-base: 1.25rem !default; // 25 px $font-size-base: 1.25rem !default; // 25 px
$font-size-small: .9rem; // 18 px $font-size-small: .9rem; // 18 px
$line-height-base: 1.4;
$line-height-verse: 1.3;
///////////////////// /////////////////////

View File

@ -15,6 +15,7 @@
@import 'main_body'; @import 'main_body';
@import 'medias'; @import 'medias';
@import 'post'; @import 'post';
@import 'texts';
//////////////////// ////////////////////

View File

@ -3,7 +3,9 @@
<h1 id="title">{{ .Title }}</h1> <h1 id="title">{{ .Title }}</h1>
{{- partial "post-info.html" . -}} {{- partial "post-info.html" . -}}
</header> </header>
<article class="content"> <article {{ if eq .Layout "verse" }} class="content, {{ .Layout }}"
{{ else }} class="content"
{{ end }}>
{{ .Content }} {{ .Content }}
</article> </article>
{{ end }} {{ end }}