From 4dad40b8060be2d70b18b37e42140aa6669e8e7f Mon Sep 17 00:00:00 2001 From: Dominik George <dominik.george@teckids.org> Date: Sun, 11 Jun 2023 18:17:43 +0200 Subject: [PATCH] Implement basic menu styling for project menu --- config.toml | 6 ++++-- content/hack-n-fun/_index.md | 4 ++++ .../{hacknfun => hack-n-fun}/freizeiten.md | 0 content/indiedact/_index.md | 4 ++++ content/schul-frei/_index.md | 4 ++++ sass/{menu.scss => _menu.scss} | 6 +++++- sass/_teckids.scss | 19 +++++++++++++++++++ sass/style.scss | 4 +++- templates/menu.html | 6 +++--- templates/menu/projects.html | 13 +++++++++++++ 10 files changed, 59 insertions(+), 7 deletions(-) create mode 100644 content/hack-n-fun/_index.md rename content/{hacknfun => hack-n-fun}/freizeiten.md (100%) create mode 100644 content/indiedact/_index.md create mode 100644 content/schul-frei/_index.md rename sass/{menu.scss => _menu.scss} (92%) create mode 100644 sass/_teckids.scss create mode 100644 templates/menu/projects.html diff --git a/config.toml b/config.toml index 0da76a34..73df49ac 100644 --- a/config.toml +++ b/config.toml @@ -3,6 +3,8 @@ base_url = "https://teckids.org" title = "Teckids" description = "Eine verstehbare (digitale) Welt – Gemeinsam, für Alle" +default_language = "de" + output_dir = "public" compile_sass = true build_search_index = true @@ -11,8 +13,8 @@ hard_link_static = true #minify_html = true taxonomies = [ - { name = "Projekt", render = false }, - { name = "Zielgruppe", render = false }, + { name = "projekt", render = false }, + { name = "zielgruppe", render = false }, ] [markdown] diff --git a/content/hack-n-fun/_index.md b/content/hack-n-fun/_index.md new file mode 100644 index 00000000..44ad8a75 --- /dev/null +++ b/content/hack-n-fun/_index.md @@ -0,0 +1,4 @@ ++++ +title = "Hack'n'Fun" +description = "Technik gemeinsam ausprobieren und verstehen" ++++ diff --git a/content/hacknfun/freizeiten.md b/content/hack-n-fun/freizeiten.md similarity index 100% rename from content/hacknfun/freizeiten.md rename to content/hack-n-fun/freizeiten.md diff --git a/content/indiedact/_index.md b/content/indiedact/_index.md new file mode 100644 index 00000000..3bc45624 --- /dev/null +++ b/content/indiedact/_index.md @@ -0,0 +1,4 @@ ++++ +title = "Indiedact" +description = "Partizipatives Lernen für alle" ++++ diff --git a/content/schul-frei/_index.md b/content/schul-frei/_index.md new file mode 100644 index 00000000..96706a20 --- /dev/null +++ b/content/schul-frei/_index.md @@ -0,0 +1,4 @@ ++++ +title = "schul-frei" +description = "Verstehbare digitale Werkzeuge für Bildungseinrichtungen" ++++ diff --git a/sass/menu.scss b/sass/_menu.scss similarity index 92% rename from sass/menu.scss rename to sass/_menu.scss index 4ba4c68e..61f55717 100644 --- a/sass/menu.scss +++ b/sass/_menu.scss @@ -27,4 +27,8 @@ display: block; } } -} \ No newline at end of file +} + +.navbar-dropdown.wide-dropdown { + width: 100%; +} diff --git a/sass/_teckids.scss b/sass/_teckids.scss new file mode 100644 index 00000000..df551f98 --- /dev/null +++ b/sass/_teckids.scss @@ -0,0 +1,19 @@ +$teckids-orange: #ff6600; +$teckids-blue: #0084ff; + +$projects: hack-n-fun, schul-frei, indiedact; +$project-colors: ( + hack-n-fun: #51cb20, + schul-frei: #750d37, + indiedact: #ffcb47, +); + +.menu-project-section { + border-left: 0.5em solid; +} + +@each $project in $projects { + #menu-project-section-#{$project} { + border-color: map-get($project-colors, $project); + } +} diff --git a/sass/style.scss b/sass/style.scss index fff72710..16508b12 100644 --- a/sass/style.scss +++ b/sass/style.scss @@ -2,6 +2,8 @@ $family-sans-serif: "Roboto", sans-serif; +@import "./_teckids.scss"; + @import "../node_modules/bulma/bulma.sass"; -@import "./menu.scss" +@import "./_menu.scss"; diff --git a/templates/menu.html b/templates/menu.html index 01b36d9b..d9fee475 100644 --- a/templates/menu.html +++ b/templates/menu.html @@ -16,14 +16,14 @@ <div class="navbar-start"> <div class="navbar-item has-dropdown is-hoverable"> <a href="#" class="navbar-item">Projekte</a> - <div class="navbar-dropdown"> - TBA + <div class="navbar-dropdown wide-dropdown"> + {% include "menu/projects.html" %} </div> </div> <div class="navbar-item has-dropdown is-hoverable"> <a href="#" class="navbar-item">Informationen für…</a> - <div class="navbar-dropdown"> + <div class="navbar-dropdown wide-dropdown"> TBA </div> </div> diff --git a/templates/menu/projects.html b/templates/menu/projects.html new file mode 100644 index 00000000..3bcbe6d6 --- /dev/null +++ b/templates/menu/projects.html @@ -0,0 +1,13 @@ +{% set projects = get_taxonomy(kind = "projekt") %} + +{% for project in projects.items %} +<section class="section menu-project-section" id="menu-project-section-{{ project.slug }}"> + {% set section = get_section(path = project.slug ~ "/_index.md") %} + <h1 class="title">{{ section.title }}</h1> + <h2 class="subtitle">{{ section.description }}</h2> + + {% for page in project.pages %} + <a href="{{ page.permalink }}">{{ page.title }}</a> + {% endfor %} +</section> +{% endfor %} \ No newline at end of file -- GitLab