From 360f7ecd96d5846ee856f121c386fb3e86f20c87 Mon Sep 17 00:00:00 2001 From: Gregory Trolliet Date: Mon, 27 Apr 2020 16:49:21 +0200 Subject: [PATCH] First commit of the theme --- LICENSE | 20 +++ archetypes/default.md | 10 ++ archetypes/page.md | 8 + archetypes/section.md | 6 + layouts/404.html | 5 + layouts/_default/baseof.html | 11 ++ layouts/_default/list.html | 0 layouts/_default/single.html | 14 ++ layouts/index.html | 4 + layouts/partials/footer.html | 33 +++++ layouts/partials/front.html | 6 + layouts/partials/head.html | 18 +++ layouts/partials/header.html | 28 ++++ layouts/partials/section.html | 6 + layouts/partials/sections.html | 14 ++ static/css/base.css | 259 +++++++++++++++++++++++++++++++++ static/css/media-queries.css | 62 ++++++++ static/svg/bars.svg | 1 + static/svg/circle.svg | 1 + static/svg/copyright.svg | 1 + static/svg/envelope.svg | 1 + static/svg/map-marker.svg | 1 + static/svg/phone.svg | 1 + theme.toml | 15 ++ 24 files changed, 525 insertions(+) create mode 100644 LICENSE create mode 100644 archetypes/default.md create mode 100644 archetypes/page.md create mode 100644 archetypes/section.md create mode 100644 layouts/404.html create mode 100644 layouts/_default/baseof.html create mode 100644 layouts/_default/list.html create mode 100644 layouts/_default/single.html create mode 100644 layouts/index.html create mode 100644 layouts/partials/footer.html create mode 100644 layouts/partials/front.html create mode 100644 layouts/partials/head.html create mode 100644 layouts/partials/header.html create mode 100644 layouts/partials/section.html create mode 100644 layouts/partials/sections.html create mode 100644 static/css/base.css create mode 100644 static/css/media-queries.css create mode 100644 static/svg/bars.svg create mode 100644 static/svg/circle.svg create mode 100644 static/svg/copyright.svg create mode 100644 static/svg/envelope.svg create mode 100644 static/svg/map-marker.svg create mode 100644 static/svg/phone.svg create mode 100644 theme.toml diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..9f8e80f --- /dev/null +++ b/LICENSE @@ -0,0 +1,20 @@ +The MIT License (MIT) + +Copyright (c) 2020 Gregory Trolliet + +Permission is hereby granted, free of charge, to any person obtaining a copy of +this software and associated documentation files (the "Software"), to deal in +the Software without restriction, including without limitation the rights to +use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of +the Software, and to permit persons to whom the Software is furnished to do so, +subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS +FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER +IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN +CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..33b7e3d --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,10 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +description: "" +date: {{ .Date }} +publishDate: {{ .Date }} +author: "John Doe" +images: [] +draft: true +tags: [] +--- \ No newline at end of file diff --git a/archetypes/page.md b/archetypes/page.md new file mode 100644 index 0000000..2789892 --- /dev/null +++ b/archetypes/page.md @@ -0,0 +1,8 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +description: "" +images: [] +draft: true +menu: main +weight: 0 +--- \ No newline at end of file diff --git a/archetypes/section.md b/archetypes/section.md new file mode 100644 index 0000000..efe83a1 --- /dev/null +++ b/archetypes/section.md @@ -0,0 +1,6 @@ +--- +title : "{{ replace .Name "-" " " | title }}" +description: "" +draft: true +weight: 0 +--- \ No newline at end of file diff --git a/layouts/404.html b/layouts/404.html new file mode 100644 index 0000000..2384d5a --- /dev/null +++ b/layouts/404.html @@ -0,0 +1,5 @@ +{{ define "main" }} +
+

404

+
+{{ end }} \ No newline at end of file diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..006eb53 --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,11 @@ + + +{{- partial "head.html" . -}} + + + {{- partial "header.html" . -}} + {{- block "main" . }}{{- end }} + {{- partial "footer.html" . -}} + + + diff --git a/layouts/_default/list.html b/layouts/_default/list.html new file mode 100644 index 0000000..e69de29 diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..cd1923c --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,14 @@ +{{ define "main" }} +
+
+

{{ .Title }}

+ {{ if .Description }} +

{{ .Description }}

+ {{ end }} +
+ +
+ {{ .Content }} +
+
+{{ end }} diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..23e439d --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,4 @@ +{{ define "main" }} +{{ partial "front.html" . }} +{{ partial "sections.html" . }} +{{ end }} diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html new file mode 100644 index 0000000..9e9f9db --- /dev/null +++ b/layouts/partials/footer.html @@ -0,0 +1,33 @@ + diff --git a/layouts/partials/front.html b/layouts/partials/front.html new file mode 100644 index 0000000..9103a6d --- /dev/null +++ b/layouts/partials/front.html @@ -0,0 +1,6 @@ +
+
+ {{ .Content }} +
+
diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..48ff235 --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,18 @@ + + + {{ $.Site.Title }} - {{ .Title }} + + + + {{ hugo.Generator }} + + {{ template "_internal/twitter_cards.html" . }} + {{ template "_internal/opengraph.html" . }} + + + + + {{ range .Site.Params.custom_css }} + + {{ end }} + diff --git a/layouts/partials/header.html b/layouts/partials/header.html new file mode 100644 index 0000000..802c467 --- /dev/null +++ b/layouts/partials/header.html @@ -0,0 +1,28 @@ +
+ +
diff --git a/layouts/partials/section.html b/layouts/partials/section.html new file mode 100644 index 0000000..748fa5a --- /dev/null +++ b/layouts/partials/section.html @@ -0,0 +1,6 @@ +
+

{{ .Title }}

+
+ {{ .Content }} +
+
diff --git a/layouts/partials/sections.html b/layouts/partials/sections.html new file mode 100644 index 0000000..1be17d7 --- /dev/null +++ b/layouts/partials/sections.html @@ -0,0 +1,14 @@ +{{ $items := (where $.Site.RegularPages "Type" "sections") }} +{{ $len := (len $items) }} + +{{ range $i, $e := $items }} +{{ partial "section.html" .}} + +{{ if ne (add $i 1) $len }} + +
+ +
+ +{{ end }} +{{ end}} diff --git a/static/css/base.css b/static/css/base.css new file mode 100644 index 0000000..20d0cc7 --- /dev/null +++ b/static/css/base.css @@ -0,0 +1,259 @@ +/******************* Constants *******************/ +:root { + --font-color: #000000; + --background-color: #FFFFFF; + + --max-width: 800px; + --max-width-full: 1000px; + --icon-size: 1em; + + --footer-height-inline: 4em; + --footer-height-block: 8em; +} + +/******************* Base *******************/ +html { + box-sizing: border-box; +} +*, +*::before, +*::after { + box-sizing:inherit +} +a { + color: black; + text-decoration: none; +} +a:visited { + color: black; + text-decoration: none; +} +body { + padding-top: 4em; + font-family: Roboto, Ubuntu, Oxygen, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; + line-height: 1.62; + height: 100vh; + margin: 0; +} +.page-icon { + display: inline-block; + max-width: var(--icon-size); + max-height: var(--icon-size); +} + +/******************* Post *******************/ +.post { + min-height: 100%; + padding-top: 3em; + padding-bottom: 3em; + margin-bottom: calc(-1 * var(--footer-height-inline)); +} +.post:after { + content: ""; + display: block; +} +.post_header { + margin: 0 auto; + width: 80%; + text-align: center; + max-width: var(--max-width); +} +.post_header .post_title { + font-size: 2em; + font-weight: normal; +} +.post_body { + margin: 0 auto; + width: 80%; + max-width: var(--max-width); +} +.post a { + text-decoration: underline dotted; +} +.post a:hover { + text-decoration: underline solid; +} +.post:after { + height: var(--footer-height-inline); +} +/******************* Footer *******************/ +.footer { + height: var(--footer-height-inline); +} +.footer { + background-color: grey; + color: white; +} +.footer .footer_link { + color: white; +} +.footer .footer_link:hover { + color: black; +} +.footer address { + margin: auto; + width: 90%; + max-width: var(--max-width-full); + display: flex; + justify-content: space-between; + line-height: var(--footer-height-inline); +} +.footer p { + margin: 0; +} + +/******************* Navbar *******************/ +.navbar { + position: fixed; + top: 0; + width: 100%; + margin: auto; + padding: 0 5vw; + line-height: 4em; + z-index: 50; + background: white; +} +#navigation { + max-width: var(--max-width-full); + margin: auto; +} +.navigation-item a { + color: var(--primary-text); + padding: 0.5rem 0; + position: relative; +} +.navigation-item a:hover, +.navigation-item a:focus { + color: var(--primary-text); +} +.navigation-item a::before { + bottom: 0; + content: ""; + display: inline-block; + height: 3px; + position: absolute; + transition: all 0.25s ease-in-out; + width: 0%; +} +.navigation-item a::before { + background-color: black; +} +.navigation-item a:hover::before, +.navigation-item a:focus::before { + opacity: 1; + width: 100%; +} +.navigation-item.active a::before { + opacity: 1; + width: 100%; +} +.navbar_title_logo { + max-width: 7rem; + vertical-align: middle; +} + +/******************* Navbar Toggle *******************/ +#menu-toggle { + display: none; +} +#navigation .menu-button { + float: right; + position:relative; + display: none; + width: 4em; + height: 4em; +} +#navigation .menu-button-inner { + width: 3em; + height: 3em; + position:relative; + top: 0.5em; + left: 0.5em; + text-align:center +} +#navigation .menu-button .menu-button-image { + display: inline-block; + position: relative; + height: 20px; + width: 24px; + top: 14px; + background-image: url(../svg/bars.svg); + background-size: contain; + margin: auto; + vertical-align: top; +} +#menu-toggle:checked + .menu-button .menu-button-image { + opacity: 40%; +} +#navigation-list { + position: absolute; + top: 6rem; + right: 0; + visibility: hidden; + opacity: 0; + max-height: 0; + width: 100%; + font-size: 1.5em; + background-color: var(--background-color); + border-top: solid 2px var(--font-color); + border-bottom: solid 2px var(--font-color); + transition: opacity .5s, max-height .35s linear; + padding: 0; +} +#navigation-list .navigation-item { + float: none !important; + text-align: center; + margin: 0; + display: block; +} +#navigation-list .navigation-item, +#navigation-list .navigation-item span { + line-height: 5rem; + margin: 0 1.5rem; +} +#menu-toggle:checked + label + ul { + visibility: visible; + opacity: 1; + max-height: max-content; +} +#navigation .menu-button { + display: block; + cursor: pointer; +} + +/******************* Front-screen *******************/ +.front-screen { + height: 90vh; + position: relative; + padding-left: 3em; + margin: auto; + max-width: var(--max-width-full); +} +.front-screen_caption { + position: absolute; + top: 50%; + transform: translateY(-50%); +} +.front-screen_caption h1 { + font-weight: normal; + font-size: 4rem; +} +.front-screen_caption h2 { + font-weight: normal; + font-size: 1.5rem; +} +/******************* Main - Sections *******************/ +.section, .separator { + width: 60%; + max-width: var(--max-width); + margin: auto; +} +.separator { + text-align: center; +} +.separator img { + width: .5em; +} +.section:last-of-type { + margin-bottom: 3em; +} diff --git a/static/css/media-queries.css b/static/css/media-queries.css new file mode 100644 index 0000000..214b9f9 --- /dev/null +++ b/static/css/media-queries.css @@ -0,0 +1,62 @@ +/******************* Main layout *******************/ +@media screen and (max-width: 768px) { + .post { + margin-bottom: calc(-1 * var(--footer-height-block)); + } + .post_body { + margin: 0 1em; + } + .post:after { + height: var(--footer-height-block); + } + .footer { + height: var(--footer-height-block); + padding: 1em 0; + } + .footer address { + display: block; + } + .footer p { + line-height: 2em; + } + .front-screen { + margin-left: 1em; + padding-left: 0; + } + .section { + width: 100%; + padding: 1em 1em; + } +} + +/******************* Navbar Menu *******************/ +@media only screen and (min-width: 768px) { + #navigation-list { + position: relative; + float: right; + top: 0; + max-height: none; + visibility: visible; + opacity: 100; + width: auto; + border: none; + font-size: 1em; + margin-top: 0; + } + #navigation-list .navigation-item { + display: inline-block; + font-weight: bold; + line-height: 4rem; + } + #navigation-list .navigation-item a, + #navigation-list .navigation-item span { + line-height: 1rem; + } + #menu-toggle:checked + label + ul { + visibility: visible; + opacity: 1; + } + #navigation .menu-button { + display: none; + } +} diff --git a/static/svg/bars.svg b/static/svg/bars.svg new file mode 100644 index 0000000..827454a --- /dev/null +++ b/static/svg/bars.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/circle.svg b/static/svg/circle.svg new file mode 100644 index 0000000..a13cfa4 --- /dev/null +++ b/static/svg/circle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/copyright.svg b/static/svg/copyright.svg new file mode 100644 index 0000000..db2e987 --- /dev/null +++ b/static/svg/copyright.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/envelope.svg b/static/svg/envelope.svg new file mode 100644 index 0000000..f41d4c7 --- /dev/null +++ b/static/svg/envelope.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/map-marker.svg b/static/svg/map-marker.svg new file mode 100644 index 0000000..a2a78ec --- /dev/null +++ b/static/svg/map-marker.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/svg/phone.svg b/static/svg/phone.svg new file mode 100644 index 0000000..d2bf6b3 --- /dev/null +++ b/static/svg/phone.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/theme.toml b/theme.toml new file mode 100644 index 0000000..5bca25b --- /dev/null +++ b/theme.toml @@ -0,0 +1,15 @@ +# theme.toml template for a Hugo theme +# See https://github.com/gohugoio/hugoThemes#themetoml for an example + +name = "Simple Site" +license = "MIT" +licenselink = "https://github.com/yourname/yourtheme/blob/master/LICENSE" +description = "" +homepage = "http://example.com/" +tags = [] +features = [] +min_version = "0.41.0" + +[author] + name = "Gregory Trolliet" + homepage = "https://trolliet.info"