From 42f9bb9781b79a988aceec90f329bc865473dd2f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=93scar?= Date: Mon, 11 Nov 2024 18:51:16 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20style:=20improve=20navigation=20?= =?UTF-8?q?bar=20&=20metadata=20wrapping=20(#425)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- sass/parts/_header.scss | 33 ++++++++++++++++++++-------- templates/page.html | 13 +++++------ templates/partials/nav.html | 43 ++++++++++++++++++++----------------- 3 files changed, 54 insertions(+), 35 deletions(-) diff --git a/sass/parts/_header.scss b/sass/parts/_header.scss index fbba0bd..a6ceebb 100644 --- a/sass/parts/_header.scss +++ b/sass/parts/_header.scss @@ -24,12 +24,14 @@ header { .nav-navs { display: flex; flex-wrap: wrap; + align-items: center; ul { display: flex; - flex-wrap: wrap; - justify-content: center; - align-items: center; + flex-wrap: inherit; + justify-content: inherit; + align-items: inherit; + gap: inherit; gap: 1px; margin: 0; padding: 0; @@ -37,6 +39,12 @@ header { } } +#menu-icons-group { + gap: 1px; + margin: 0; + padding: 0; +} + .nav-links { justify-content: right; padding: 0.66rem; @@ -76,11 +84,22 @@ header { ul, li { - display: inline; + display: inline-block; + margin-inline-end: 0.2rem; font-family: var(--sans-serif-font); list-style-type: none; } + + .tag { + margin-inline-end: 0; + } + + .separator { + margin-inline-end: 0.2rem; + user-select: none; + } } + .language-switcher { display: flex; justify-content: center; @@ -147,21 +166,17 @@ header { .nav-navs { display: flex; - justify-content: flex-end; + justify-content: center; } } @media only screen and (max-width: 600px) { .nav-navs { - flex-wrap: wrap; - justify-content: center; margin-top: 0.8rem; - width: 100%; } .navbar { flex-direction: column; - justify-content: center; align-items: center; } } diff --git a/templates/page.html b/templates/page.html index c269531..c2a9b74 100644 --- a/templates/page.html +++ b/templates/page.html @@ -140,24 +140,26 @@ Current section extra: {% if current_section %}{{ current_section.extra | json_e {%- set previous_visible = true -%} {% endif %} + {%- set separator_with_class = ""-%} + {#- Date -#} {% if page.date and macros_settings::evaluate_setting_priority(setting="show_date", page=page, default_global_value=true) == "true" %} - {%- if previous_visible -%} {{ separator }} {%- endif -%}
  • {{ macros_format_date::format_date(date=page.date, short=true, language_strings=language_strings) }}
    • +
  • {%- if previous_visible -%}{{ separator_with_class | safe }}{%- endif -%}{{ macros_format_date::format_date(date=page.date, short=true, language_strings=language_strings) }}
    • {#- Variable to keep track of whether we've shown a section, to avoid separators as the first element -#} {%- set previous_visible = true -%} {% endif %} {#- Reading time -#} {% if macros_settings::evaluate_setting_priority(setting="show_reading_time", page=page, default_global_value=true) == "true" %} - {%- if previous_visible -%} {{ separator }} {%- endif -%}
  • {{ macros_translate::translate(key="min_read", number=page.reading_time, default="$NUMBER min read", language_strings=language_strings) }}
    • +
  • {%- if previous_visible -%}{{ separator_with_class | safe }}{%- endif -%}{{ macros_translate::translate(key="min_read", number=page.reading_time, default="$NUMBER min read", language_strings=language_strings) }}
    • {%- set previous_visible = true -%} {% endif %} {#- Tags -#} {%- if page.taxonomies and page.taxonomies.tags -%} - {%- if previous_visible -%} {{ separator }} {%- endif -%}
  • {{- macros_translate::translate(key="tags", default="tags", language_strings=language_strings) | capitalize -}}: 
    • +
  • {%- if previous_visible -%}{{ separator_with_class | safe }}{%- endif -%}{{- macros_translate::translate(key="tags", default="tags", language_strings=language_strings) | capitalize -}}: 
    • {%- for tag in page.taxonomies.tags -%} -
  • {{ tag }} +
  • {{ tag }} {%- if not loop.last -%} ,  {%- endif -%} @@ -174,8 +176,7 @@ Current section extra: {% if current_section %}{{ current_section.extra | json_e diff --git a/templates/partials/nav.html b/templates/partials/nav.html index e2ea155..ba61dc8 100644 --- a/templates/partials/nav.html +++ b/templates/partials/nav.html @@ -18,28 +18,31 @@ {% endfor %} {%- endif -%} - {# Search #} - {%- if config.build_search_index %} - {%- set search_icon_title = macros_translate::translate(key='search_icon_title', default='Press $SHORTCUT to open search', language_strings=language_strings) -%} -
  • -
    - - - -
    -
    • - {%- endif %} + {#- Wrap the icons in a div to keep them all together -#} + {% endif %}