diff --git a/.gitignore b/.gitignore deleted file mode 100644 index b367870..0000000 --- a/.gitignore +++ /dev/null @@ -1,2 +0,0 @@ -/public/ -/static/processed_images/ diff --git a/.gitmodules b/.gitmodules index 2669f73..5ba7570 100644 --- a/.gitmodules +++ b/.gitmodules @@ -1,6 +1,3 @@ -[submodule "vendor/normalize.css"] - path = vendor/normalize.css - url = https://github.com/necolas/normalize.css -[submodule "vendor/milligram"] - path = vendor/milligram - url = https://github.com/milligram/milligram +[submodule "vendor/bulma"] + path = vendor/bulma + url = https://github.com/jgthms/bulma.git diff --git a/README.md b/README.md index 340dc58..9ddc5b0 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,3 @@ # onders.org Zola theme -Before using it make sure you update init the submodules. +Before using it make sure you update init the Bulma submodule. diff --git a/content/credits.md b/content/credits.md index 87ac122..f070b83 100644 --- a/content/credits.md +++ b/content/credits.md @@ -1,13 +1,12 @@ +++ title = "Credits" +template = "credits.html" +++ -This website uses the +This webiste uses the [onders.org](https://git.onders.org/finga/onders.org_zola_theme.git) Zola theme. ### Technology * Websitegenerator: [zola](https://www.getzola.org/) -* CSS Frameworks - * [normalize.css](https://necolas.github.io/normalize.css/) - * [milligram.io](https://milligram.io/) +* CSS Framework: [bulma](https://www.bulma.io/) diff --git a/sass/normalize.scss b/sass/normalize.scss deleted file mode 100644 index dd7febd..0000000 --- a/sass/normalize.scss +++ /dev/null @@ -1 +0,0 @@ -@import "../vendor/normalize.css/normalize"; diff --git a/sass/onders.org.scss b/sass/onders.org.scss deleted file mode 100644 index 39500c7..0000000 --- a/sass/onders.org.scss +++ /dev/null @@ -1,22 +0,0 @@ -@import "onders.org/color"; - -@import "../vendor/milligram/src/Base"; -@import "../vendor/milligram/src/Blockquote"; -@import "../vendor/milligram/src/Button"; -@import "../vendor/milligram/src/Code"; -@import "../vendor/milligram/src/Divider"; -@import "../vendor/milligram/src/Form"; -@import "../vendor/milligram/src/Grid"; -@import "../vendor/milligram/src/Image"; -@import "../vendor/milligram/src/Link"; -@import "../vendor/milligram/src/List"; -@import "../vendor/milligram/src/Spacing"; -@import "../vendor/milligram/src/Table"; -@import "../vendor/milligram/src/Typography"; -@import "../vendor/milligram/src/Utility"; - -@import "onders.org/layout"; -@import "onders.org/modal"; -@import "onders.org/gallery"; -@import "onders.org/util"; -@import "onders.org/dark"; diff --git a/sass/onders.org/_color.scss b/sass/onders.org/_color.scss deleted file mode 100644 index b4a5b2a..0000000 --- a/sass/onders.org/_color.scss +++ /dev/null @@ -1,13 +0,0 @@ -$color-initial: #eee !default; -$color-primary: #4d4dff !default; -$color-secondary: #606c76 !default; -$color-tertiary: #f4f5f6 !default; -$color-quaternary: #9b4dca !default; -$color-quinary: #505a62 !default; -$color-black: #000 !default; - -$color-dark-initial: #333 !default; -$color-dark-primary: #7777ff !default; -$color-dark-secondary: #d5d9dd !default; -$color-dark-tertiary: #5c6670 !default; -$color-dark-quaternary: #a662d0 !default; diff --git a/sass/onders.org/_dark.scss b/sass/onders.org/_dark.scss deleted file mode 100644 index fdc0a9d..0000000 --- a/sass/onders.org/_dark.scss +++ /dev/null @@ -1,18 +0,0 @@ -@media (prefers-color-scheme: dark) { - html, body { - background-color: $color-dark-initial; - color: $color-dark-secondary; - } - - a { - color: $color-dark-primary; - } - - a:visited { - color: $color-dark-quaternary; - } - - a:hover { - color: $color-dark-tertiary; - } -} diff --git a/sass/onders.org/_gallery.scss b/sass/onders.org/_gallery.scss deleted file mode 100644 index 6ebbe5e..0000000 --- a/sass/onders.org/_gallery.scss +++ /dev/null @@ -1,131 +0,0 @@ -div.gallery { - width: calc(100% + 10px); - margin-left: -5px; - line-height: 0; - margin-bottom: 2.5rem; -} - -div.gallery img.thumbnail { - padding: 5px; -} - -div.gallery a img.thumbnail:hover { - box-shadow: 0 0 0px $color-tertiary !important; - transform: scale(1.1); - transition: transform .2s; -} - -div.lightbox { - opacity: 0; - z-index: 700; - transition: opacity 0.2s linear; - position: fixed; - width: 100%; - height: 100%; - left: 0; - top: 0; - background-color: rgba($color-black, 0.7); - overflow: auto; - display: flex; - justify-content: center; - align-items: center; - pointer-events: none; - @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - -webkit-backdrop-filter: blur(5px); - backdrop-filter: blur(5px); - } -} - -div.lightbox:target { - opacity: 1; - pointer-events: auto; -} - -div.lightbox a.full { - height: 100%; - width: 100%; - display: flex; - justify-content: center; - align-items: center; -} - -div.lightbox span { - font-size: 2em; - line-height: normal; - position: absolute; - color: $color-tertiary; - cursor: pointer; -} - -div.lightbox span:hover { - color: $color-secondary; -} - - -div.lightbox span.close { - z-index: 900; - top: 0; - right: 0; - padding: .7em 1em; -} - -div.lightbox span.close:before { - content: "✖"; - font-size: 1.2em; -} - -div.lightbox span.prev { - z-index: 800; - top: 0; - left: 0; - display: inline-flex; - align-items: center; - font-size: 6em; - height: 100%; - padding: 0 .3em; -} - -div.lightbox span.prev:before { - content: "‹"; -} - -div.lightbox span.end:before { - content: "⟳"; - font-size: .7em; -} - -div.lightbox span.next { - z-index: 800; - top: 0; - right: 0; - display: inline-flex; - align-items: center; - font-size: 6em; - height: 100%; - padding: 0 .3em; -} - -div.lightbox span.next:before { - content: "›"; -} - -div.lightbox span.start:before { - content: "⟲"; - font-size: .7em; -} - -div.lightbox div.image { - display: flex; - justify-content: center; - width: 80%; - height: 80%; -} - -div.lightbox div.image img { - filter: drop-shadow(0 0 10px $color-black); - object-fit: contain; - max-height: 100%; - max-width: 100%; - width: 100%; - height: auto; -} diff --git a/sass/onders.org/_layout.scss b/sass/onders.org/_layout.scss deleted file mode 100644 index c5c9002..0000000 --- a/sass/onders.org/_layout.scss +++ /dev/null @@ -1,30 +0,0 @@ -html { - background-color: $color-initial; -} - -header { - padding-top: 7rem; -} - -nav { - margin-bottom: 2rem; -} - -ul { - line-height: 2rem -} - -footer ul { - list-style: none; - font-size: 1.2rem; - text-align: center; - line-height: 1rem -} - -a:visited { - color: $color-quaternary; -} - -a:hover { - color: $color-quinary; -} diff --git a/sass/onders.org/_modal.scss b/sass/onders.org/_modal.scss deleted file mode 100644 index 72792e7..0000000 --- a/sass/onders.org/_modal.scss +++ /dev/null @@ -1,46 +0,0 @@ -div.modal-thumbnail { - margin-bottom: 2.5rem; -} - -div.modal { - opacity: 0; - z-index: 900; - position: fixed; - transition: opacity 0.2s linear; - height: 100%; - width: 100%; - background-color: rgba($color-black, 0.5); - top: 0; - left: 0; - pointer-events: none; - text-align: center; - @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - -webkit-backdrop-filter: blur(5px); - backdrop-filter: blur(5px); - } -} - -div.modal a { - height: 100%; - width: 100%; - display: inline-block; -} - -div.modal a img { - display: inline-block; - box-shadow: 0 0 20px $color-black; - max-width: 90%; - max-height: 90%; - vertical-align: middle; -} - -span.spacer { - display: inline-block; - height: 100%; - vertical-align: middle; -} - -div.modal:target { - opacity: 1; - pointer-events: auto; -} diff --git a/sass/onders.org/_util.scss b/sass/onders.org/_util.scss deleted file mode 100644 index f6cd83c..0000000 --- a/sass/onders.org/_util.scss +++ /dev/null @@ -1,3 +0,0 @@ -.align-right { - text-align: right; -} diff --git a/sass/style.scss b/sass/style.scss new file mode 100644 index 0000000..4c5d133 --- /dev/null +++ b/sass/style.scss @@ -0,0 +1,147 @@ +@charset "utf-8"; +@import "../vendor/bulma/bulma.sass"; + +html, .navbar, .footer { + background-color: $light; +} + +.footer { + padding-bottom: 0; +} + +a:visited { + color: hsl(280, 100%, 50%); +} + +@media (prefers-color-scheme: dark) { + html, .navbar, .footer, p, strong, .title, li { + background-color: $dark; + color: $white; + } + + .subtitle, a:hover { + color: $light; + } + + a { + color: hsl(217, 71%, 70%); + } +} + +.lightbox { + opacity: 0; + z-index: 900; + position: fixed; + transition: opacity 0.2s linear; + height: 100%; + width: 100%; + background-color: rgba($black, 0.5); + top: 0; + left: 0; + pointer-events: none; + @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + -webkit-backdrop-filter: blur(5px); + backdrop-filter: blur(5px); + } +} + +.lightbox span.spacer { + display: inline-block; + height: 100%; + vertical-align: middle; +} + +.lightbox img { + display: inline-block; + box-shadow: 0 0 20px $black; + max-width: 90%; + max-height: 90%; + width: auto; + vertical-align: middle; + @include touch { + margin-top: 35px; + max-height: 80%; + } +} + +.lightbox a { + font-size: $size-1; + color: $light; + z-index: 900; + @include touch { + height: 100%; + width: 50%; + font-size: $size-3; + } +} + +.lightbox a.lightbox-nav-previous { + z-index: 900; + @include touch { + position: absolute; + left: 0%; + font-size: $size-3; + } +} + +.lightbox a.lightbox-nav-next { + z-index: 900; + @include touch { + position: absolute; + left: 50%; + } +} + +.lightbox a.close { + display: block; + height: 100%; + width: 100%; + z-index: 999; +} + +.lightbox a.delete { + z-index: 999; + position: fixed; + top: 1%; + right: 1%; +} + +.lightbox:target { + opacity: 1; + pointer-events: auto; +} + +.lightbox-previous { + position: absolute; + height: 100%; + width: 50%; + top: 0%; + left: 0%; +} + +.lightbox-next { + position: absolute; + height: 100%; + width: 50%; + top: 0%; + left: 50%; +} + +.gallery { + gap: $gap / 4; +} + +.thumbnail { + width: 120px; + height: 120px; + vertical-align: middle; + transition: transform .2s; +} + +.thumbnail:hover { + transform: scale(1.1); +} + +.isso-postbox .form-wrapper .textarea-wrapper .textarea { + overflow-y: auto; +} diff --git a/templates/404.html b/templates/404.html index b5c9ed4..6bd0988 100644 --- a/templates/404.html +++ b/templates/404.html @@ -1,13 +1,11 @@ {% extends "base.html" %} -{% block title %} -404 -{% endblock title %} - -{% block subtitle %} -

404

-{% endblock subtitle %} - {% block content %} -Diese URL führt zu nichts! + +
+ home +
+ +

404

+

Diese URL führt zu nichts!

{% endblock content %} diff --git a/templates/base.html b/templates/base.html index 0be8872..a2c2939 100644 --- a/templates/base.html +++ b/templates/base.html @@ -1,12 +1,11 @@ - + {% block title %}{% endblock title %} - - + {% if config.generate_feed %} @@ -15,24 +14,11 @@ {% endblock js %} -
-
-

{{ config.title }}

- {% block subtitle %}{% endblock subtitle %} -
- {% include "navbar.html" %} - {% block content %} {% endblock content %} - {% include "navbar.html" %} - -
+
+
+ {% block content %} {% endblock content %} +
+ {% include "footer.html" %} +
diff --git a/templates/comments.html b/templates/comments.html index e4c98ce..0600e3b 100644 --- a/templates/comments.html +++ b/templates/comments.html @@ -1,6 +1,5 @@ {% block js %} - + {% endblock js %} -{# #} -
+
diff --git a/templates/credits.html b/templates/credits.html new file mode 100644 index 0000000..35fa3d7 --- /dev/null +++ b/templates/credits.html @@ -0,0 +1,25 @@ +{% extends "base.html" %} + +{% block title %} +{{ config.title }} - {{ page.title }} +{% endblock title %} + +{% block content %} +

{{ config.title }}

+

{{ page.title }}

+ +
+ home +
+ +
+
+ {{ page.content | safe }} +
+
+ +
+ home +
+ +{% endblock content %} diff --git a/templates/footer.html b/templates/footer.html new file mode 100644 index 0000000..fba31da --- /dev/null +++ b/templates/footer.html @@ -0,0 +1,10 @@ + diff --git a/templates/header.html b/templates/header.html new file mode 100644 index 0000000..e623825 --- /dev/null +++ b/templates/header.html @@ -0,0 +1,12 @@ +
+

{{ config.title }}

+ {% if section.title %} +

{{ section.title }}

+ {% endif %} + {% if page.title %} +

{{ page.title }}

+ {% endif %} + + home + +
diff --git a/templates/index.html b/templates/index.html index 452c053..d059f77 100644 --- a/templates/index.html +++ b/templates/index.html @@ -5,6 +5,7 @@ {% endblock title %} {% block content %} +

{{ config.title }}

{{ section.content | safe }} diff --git a/templates/navbar.html b/templates/navbar.html index ae106ce..c4d7e68 100644 --- a/templates/navbar.html +++ b/templates/navbar.html @@ -1,31 +1,19 @@ -{% if page.ancestors %} -{% set ancestor = get_section(path=page.ancestors | last) %} -{% endif %} - -{% if current_path and current_path == "/" %} -{% else %} - -{% endif %} + diff --git a/templates/page.html b/templates/page.html index 42f98fc..6c54f04 100644 --- a/templates/page.html +++ b/templates/page.html @@ -1,33 +1,23 @@ {% extends "base.html" %} {% block title %} -{% if page.ancestors %} -{% set ancestor = get_section(path=page.ancestors | last) %} -{% if ancestor.extra %} -{{ config.title }} | {{ page.date }} - {{ page.title }} ({{ ancestor.title }}) -{% else %} -{{ config.title }} | {{ page.title }} -{% endif %} -{% endif %} +{% set section = get_section(path=page.ancestors | last) %} +{{ config.title }} - {{ section.title }} - {{ page.title }}: {{ page.date }} {% endblock title %} -{% block subtitle %} -{% if page.ancestors %} -{% set ancestor = get_section(path=page.ancestors | last) %} -{% if ancestor.extra %} -

{{ ancestor.extra.start }} - {{ ancestor.extra.end }}: {{ ancestor.title }}

-{% else %} -

{{ page.title }}

-{% endif %} -{% endif %} -{% endblock subtitle %} - {% block content %} -{% if page.date %} -

{{ page.title }} ({{ page.date }})

-{% endif %} -{{ page.content | safe }} -{% if page.date %} -{% include "comments.html" %} -{% endif %} +{% set section = get_section(path=page.ancestors | last) %} +

{{ config.title }}

+

{{ section.title }}

+{% include "navbar.html" %} +

{{ page.title }} ({{ page.date }})

+
+
+ {{ page.content | safe }} +
+
+ {% include "comments.html" %} +
+
+{% include "navbar.html" %} {% endblock content %} diff --git a/templates/section.html b/templates/section.html index 9a53c36..56edc0a 100644 --- a/templates/section.html +++ b/templates/section.html @@ -1,24 +1,32 @@ {% extends "base.html" %} {% block title %} -{% if section.extra.start %} -{{ config.title }} | {{ section.extra.start }} - {{ section.extra.end }}: {{ section.title }} -{% else %} -{{ config.title }} -{% endif %} +{{ config.title }} - {{ section.title }} {% endblock title %} -{% block subtitle %} -{% if section.extra.start %} -

{{ section.extra.start }} - {{ section.extra.end }}: {{ section.title }}

-{% endif %} -{% endblock subtitle %} - {% block content %} -{{ section.content | safe }} - +

{{ config.title }}

+

{{ section.title }}

+ +
+ home +
+ +
+
+ {{ section.content | safe }} +
+
+ +
+
+ +
+ home +
+ {% endblock content %} diff --git a/templates/shortcodes/gallery.html b/templates/shortcodes/gallery.html index 6d2c1cc..134fb2b 100644 --- a/templates/shortcodes/gallery.html +++ b/templates/shortcodes/gallery.html @@ -1,4 +1,4 @@ -
+
{% for path in images %} {% if section %} {% set full_path = section.path ~ path %} @@ -7,31 +7,61 @@ {% set full_path = page.path ~ path %} {% endif %} {% set thumb = resize_image(path=full_path, width=120, height=120) %} - -