From c275812ffa1382f350c24cf3967aa3fc5cdebcdb Mon Sep 17 00:00:00 2001 From: Matthias Andreas Benkard Date: Sun, 9 Feb 2020 06:46:33 +0100 Subject: Create a base design. Change-Id: Idf90f0e4b1c411edb72d468d9b4c10daac6c67a3 --- .../resources/META-INF/resources/cms2/base.css | 113 ++++++++++++++++++++- src/main/resources/templates/base.html | 20 +++- .../resources/templates/benki/wiki/wikiPage.html | 8 +- .../templates/benki/wiki/wikiPageRevisionList.html | 2 + 4 files changed, 138 insertions(+), 5 deletions(-) (limited to 'src/main') diff --git a/src/main/resources/META-INF/resources/cms2/base.css b/src/main/resources/META-INF/resources/cms2/base.css index e525a23..6e3b1b6 100644 --- a/src/main/resources/META-INF/resources/cms2/base.css +++ b/src/main/resources/META-INF/resources/cms2/base.css @@ -11,5 +11,116 @@ /* Sanitize.css */ @import "../web_modules/sanitize.css/sanitize.css"; @import "../web_modules/sanitize.css/forms.css"; -@import "../web_modules/sanitize.css/page.css"; @import "../web_modules/sanitize.css/typography.css"; +/* */ + +html { + --main-bg-color: #f8f8f8; + --header-bg-color: #ffffff; + --nav-bg-color: #ffffff; + --footer-bg-color: #ffffff; +} + +body { + display: grid; +} + +body { + grid-template-columns: 1fr; + grid-gap: 0; + + grid-template-areas: + "header" + "navbar" + "main" + "footer"; +} + +@media (max-width: 30em) { + body > main { + border-top: 1px solid lightgray + } +} + +@media (min-width: 30em) { + body { + grid-template-columns: 1fr 3fr; + grid-template-rows: auto 1fr auto; + grid-gap: 0; + + grid-template-areas: + "header main" + "navbar main" + "footer footer"; + } + + body > nav > ol > li.this-page { + width: calc(100% + 1px); + } +} + +body > header { + grid-area: header; + flex: min-content; + + text-align: center; + horiz-align: center; + background-color: var(--main-bg-color); + border-bottom: 1px solid lightgray; +} + +body > header a { + text-decoration: none; +} + +body > header h1 { + font-size: 1em; +} + +body > nav { + grid-area: navbar; + + background-color: var(--nav-bg-color); +} + +body > nav > ol { + display: flex; + flex-direction: column; +} + +body > nav > ol > li { + flex: auto; + + padding: 5px; + padding-left: 1em; +} + +body > nav > ol > li.this-page { + background-color: var(--main-bg-color); + border: 1px solid lightgray; + border-right: 1px solid var(--main-bg-color); + z-index: 1; +} + +body > nav > ol > li > a { + text-decoration: none; +} + +body > main { + grid-area: main; + + background-color: var(--main-bg-color); + padding: 10px; + border-left: 1px solid lightgray; +} + +body > footer { + grid-area: footer; + + background-color: var(--footer-bg-color); + horiz-align: right; + text-align: right; + + padding: 0.5em 0.5em; + border-top: lightgray solid 1px; +} \ No newline at end of file diff --git a/src/main/resources/templates/base.html b/src/main/resources/templates/base.html index 6b1ad42..8619f3e 100644 --- a/src/main/resources/templates/base.html +++ b/src/main/resources/templates/base.html @@ -13,6 +13,24 @@ -{#insert body}{/} +
+

Benki → {#insert siteSection}{/}

+
+ + + +
+ {#insert body}{/} +
+ + diff --git a/src/main/resources/templates/benki/wiki/wikiPage.html b/src/main/resources/templates/benki/wiki/wikiPage.html index e4a7d58..6ebf7c2 100644 --- a/src/main/resources/templates/benki/wiki/wikiPage.html +++ b/src/main/resources/templates/benki/wiki/wikiPage.html @@ -4,6 +4,8 @@ {#title}{page.title} — Benki Wiki{/title} +{#siteSection}Wiki{/siteSection} + {#head} @@ -75,14 +77,14 @@

{page.title}

-
+
-
+
{#with page}{enrichedContent.raw}{/}
-
+
diff --git a/src/main/resources/templates/benki/wiki/wikiPageRevisionList.html b/src/main/resources/templates/benki/wiki/wikiPageRevisionList.html index f4a3d95..eb64ff9 100644 --- a/src/main/resources/templates/benki/wiki/wikiPageRevisionList.html +++ b/src/main/resources/templates/benki/wiki/wikiPageRevisionList.html @@ -5,6 +5,8 @@ {#title}Revisions — {title} — Benki Wiki{/title} +{#siteSection}Wiki{/siteSection} + {#body}

Revisions — {title}

-- cgit v1.2.3