theme: apply user supplied content footer below content #229

exampleSite/content/basics/customization/_index.en.md

@@ -9,21 +9,21 @@ In `themes/hugo-theme-relearn/layouts/partials/`, you will find all the partials
 
 This theme defines the following partials :
 
-- `content.html`: the content page itself. This can be overridden if you wan't to display page's meta data above or below the content.
+- `header.html`: the header of the page. _Not meant to be overwritten_
-- `header.html`: the header of the content page (contains the breadcrumbs). _Not meant to be overwritten_
+- `footer.html`: the footer of the page._Not meant to be overwritten_
-- `custom-header.html`: custom headers in page. Meant to be overwritten when adding CSS imports. Don't forget to include `style` HTML tag directive in your file
+- `menu.html`: left menu. _Not meant to be overwritten_
-- `footer.html`: the footer of the content page (contains the arrows). _Not meant to be overwritten_
+- `search.html`: search box. _Not meant to be overwritten_
-- `custom-footer.html`:  custom footer in page. Meant to be overwritten when adding Javacript. Don't forget to include `javascript` HTML tag directive in your file
+- `custom-header.html`: custom headers in page. Meant to be overwritten when adding CSS imports. Don't forget to include `style` HTML tag directive in your file.
+- `custom-footer.html`:  custom footer in page. Meant to be overwritten when adding Javacript. Don't forget to include `javascript` HTML tag directive in your file.
 - `favicon.html`: the favicon
 - `logo.html`: the logo, on top left hand corner
 - `meta.html`: HTML meta tags, if you want to change default behavior
-- `menu.html`: left menu. _Not meant to be overwritten_
 - `menu-pre.html`: side-wide configuration to prepend to menu items. If you override this, it is your responsiblity to take the page's `pre` setting into account.
 - `menu-post.html`: side-wide configuration to append to menu items. If you override this, it is your responsiblity to take the page's `post` setting into account.
 - `menu-footer.html`: footer of the the left menu
-- `search.html`: search box. _Not meant to be overwritten_
 - `toc.html`: table of contents
-
+- `content.html`: the content page itself. This can be overridden if you wan't to display page's meta data above or below the content.
+- `content-footer`: footer below the content, has a default implementation but you can overwrite it if you don't like it.
 ## Change the logo
 
 Create a new file in `layouts/partials/` named `logo.html`. Then write any HTML you want.

exampleSite/content/basics/migration/_index.en.md

@@ -14,6 +14,12 @@ This document shows you what's new in the latest release. For a detailed list of
 
 ---
 
+## 3.4.0
+
+- **Breaking**: If you had previously overwritten the `custom-footer.html` partial to add visual elements below the content of your page, you have to move this content to the new partial `content-footer.html`. `custom-footer.html` was never meant to contain HTML other than additional styles and JavaScript.
+
+---
+
 ## 3.3.0
 
 - **New**: Introduction of new CSS variables to set the font. The theme distinguishs between `--MAIN-font` for all content text and `--CODE-font` for inline or block code. There are additional overrides for all headings. See the [theme variant generator]({{%relref "basics/generator" %}}) of the exampleSite for all available variables.

layouts/partials/content-footer.html

@@ -0,0 +1,6 @@
+{{- with .Params.LastModifierDisplayName }}
+            <i class='fas fa-user'></i> {{ with $.Params.LastModifierEmail }}<a href="mailto:{{ . }}">{{ end }}{{ . }}{{ with $.Params.LastModifierEmail }}</a>{{ end }}
+  {{- with $.Date }}
+            <i class='fas fa-calendar'></i> {{ . | time.Format ":date_medium" }}
+  {{- end }}
+{{- end }}

layouts/partials/footer.html

@@ -1,7 +1,5 @@
           <footer class="footline">
-        {{- with .Params.LastModifierDisplayName }}
+{{- partial "content-footer.html" . }}
-            <i class='fas fa-user'></i> <a href="mailto:{{ $.Params.LastModifierEmail }}">{{ . }}</a> {{ with $.Date }} <i class='fas fa-calendar'></i> {{ .Format "02/01/2006" }}{{ end }}
-        {{- end }}
           </footer>
         </div>
       </main><!-- #body-inner -->

static/css/print.css

@@ -89,6 +89,9 @@ body,
     margin-top: 1.5rem;
     padding-top: .75rem;
 }
+#body #body-inner .footline a {
+    text-decoration: none;
+}
 #body #body-inner a {
     /* in print we want to distinguish links in our content from
     normal text even if printed black/white;

static/css/theme.css

@@ -1196,6 +1196,13 @@ option {
     margin-top: 2rem;
 }
 
+.footline i{
+    margin-left: .5rem;
+}
+.footline i:first-child{
+    margin-left: 0;
+}
+
 .mermaid {
     margin-bottom: 1.7rem;
     margin-top: 1.7rem;