diff options
| -rw-r--r-- | app/views/admin/_menu.html.erb | 5 | ||||
| -rw-r--r-- | app/views/layouts/_nav_controls.html.erb | 36 | ||||
| -rw-r--r-- | app/views/layouts/_nav_switchers.html.erb | 23 | ||||
| -rw-r--r-- | app/views/layouts/admin.html.erb | 3 | ||||
| -rw-r--r-- | config/locales/de.yml | 11 | ||||
| -rw-r--r-- | config/locales/en.yml | 11 | ||||
| -rw-r--r-- | public/stylesheets/admin.css | 27 |
7 files changed, 74 insertions, 42 deletions
diff --git a/app/views/admin/_menu.html.erb b/app/views/admin/_menu.html.erb deleted file mode 100644 index b0e310e9..00000000 --- a/app/views/admin/_menu.html.erb +++ /dev/null | |||
| @@ -1,5 +0,0 @@ | |||
| 1 | <%= link_to icon("home", library: "tabler", "aria-hidden": true), admin_path, "aria-label": t(".dashboard"), title: t(".dashboard") %> | ||
| 2 | <a href="#" onclick="admin_search.display_toggle(); return false;" aria-label="<%= t(".search") %>" title="<%= t(".search") %>"><%= icon("search", library: "tabler", "aria-hidden": true) %></a> | ||
| 3 | <%= button_to logout_path, method: :delete, aria: { label: t(".log_out") }, title: t(".log_out") do %> | ||
| 4 | <%= icon("logout", library: "tabler", "aria-hidden": true) %> | ||
| 5 | <% end %> | ||
diff --git a/app/views/layouts/_nav_controls.html.erb b/app/views/layouts/_nav_controls.html.erb new file mode 100644 index 00000000..d6053dab --- /dev/null +++ b/app/views/layouts/_nav_controls.html.erb | |||
| @@ -0,0 +1,36 @@ | |||
| 1 | <% if current_user %> | ||
| 2 | <%= link_to icon("home", library: "tabler", "aria-hidden": true), admin_path, "aria-label": t(".dashboard"), title: t(".dashboard") %> | ||
| 3 | <a href="#" onclick="admin_search.display_toggle(); return false;" aria-label="<%= t(".search") %>" title="<%= t(".search") %>"><%= icon("search", library: "tabler", "aria-hidden": true) %></a> | ||
| 4 | <% end %> | ||
| 5 | |||
| 6 | <span class="nav_group"> | ||
| 7 | <%= link_to url_for(locale: (:en unless I18n.locale == :en)), | ||
| 8 | class: "nav_toggle nav_locale", | ||
| 9 | "aria-label" => t(".switch_locale"), title: t(".switch_locale") do %> | ||
| 10 | <%= I18n.locale == :en ? "DE" : "EN" %> | ||
| 11 | <% end %> | ||
| 12 | <%= check_box_tag "scheme_override", 1, false, class: "nav_toggle_input" %> | ||
| 13 | <%= label_tag "scheme_override", class: "nav_toggle", | ||
| 14 | "aria-label" => t(".scheme_override"), title: t(".scheme_override") do %> | ||
| 15 | <%= icon("contrast", library: "tabler", "aria-hidden": true) %> | ||
| 16 | <% end %> | ||
| 17 | </span> | ||
| 18 | |||
| 19 | <%= javascript_tag nonce: true do %> | ||
| 20 | (function () { | ||
| 21 | var box = document.getElementById("scheme_override"); | ||
| 22 | try { | ||
| 23 | if (localStorage.getItem("override-prefers-color-scheme")) box.checked = true; | ||
| 24 | box.addEventListener("change", function () { | ||
| 25 | if (box.checked) localStorage.setItem("override-prefers-color-scheme", 1); | ||
| 26 | else localStorage.removeItem("override-prefers-color-scheme"); | ||
| 27 | }); | ||
| 28 | } catch (e) { /* storage unavailable: the toggle still works per page */ } | ||
| 29 | })(); | ||
| 30 | <% end %> | ||
| 31 | |||
| 32 | <% if current_user %> | ||
| 33 | <%= button_to logout_path, method: :delete, aria: { label: t(".log_out") }, title: t(".log_out") do %> | ||
| 34 | <%= icon("logout", library: "tabler", "aria-hidden": true) %> | ||
| 35 | <% end %> | ||
| 36 | <% end %> | ||
diff --git a/app/views/layouts/_nav_switchers.html.erb b/app/views/layouts/_nav_switchers.html.erb deleted file mode 100644 index 9c3b222e..00000000 --- a/app/views/layouts/_nav_switchers.html.erb +++ /dev/null | |||
| @@ -1,23 +0,0 @@ | |||
| 1 | <%= link_to url_for(locale: (:en unless I18n.locale == :en)), | ||
| 2 | class: "nav_toggle", | ||
| 3 | "aria-label" => t(".switch_locale"), title: t(".switch_locale") do %> | ||
| 4 | <%= I18n.locale == :en ? "DE" : "EN" %> | ||
| 5 | <% end %> | ||
| 6 | <%= check_box_tag "scheme_override", 1, false, class: "nav_toggle_input" %> | ||
| 7 | <%= label_tag "scheme_override", class: "nav_toggle", | ||
| 8 | "aria-label" => t(".scheme_override"), title: t(".scheme_override") do %> | ||
| 9 | <%= icon("contrast", library: "tabler", "aria-hidden": true) %> | ||
| 10 | <% end %> | ||
| 11 | |||
| 12 | <%= javascript_tag nonce: true do %> | ||
| 13 | (function () { | ||
| 14 | var box = document.getElementById("scheme_override"); | ||
| 15 | try { | ||
| 16 | if (localStorage.getItem("override-prefers-color-scheme")) box.checked = true; | ||
| 17 | box.addEventListener("change", function () { | ||
| 18 | if (box.checked) localStorage.setItem("override-prefers-color-scheme", 1); | ||
| 19 | else localStorage.removeItem("override-prefers-color-scheme"); | ||
| 20 | }); | ||
| 21 | } catch (e) { /* storage unavailable: the toggle still works per page */ } | ||
| 22 | })(); | ||
| 23 | <% end %> | ||
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb index 6ac9b756..04cc40ac 100644 --- a/app/views/layouts/admin.html.erb +++ b/app/views/layouts/admin.html.erb | |||
| @@ -26,8 +26,7 @@ | |||
| 26 | <div id="wrapper"> | 26 | <div id="wrapper"> |
| 27 | <div id="navigation"> | 27 | <div id="navigation"> |
| 28 | <div id="main_navigation"> | 28 | <div id="main_navigation"> |
| 29 | <%= render :partial => 'admin/menu' if current_user %> | 29 | <%= render :partial => 'layouts/nav_controls' %> |
| 30 | <%= render :partial => 'layouts/nav_switchers' %> | ||
| 31 | </div> | 30 | </div> |
| 32 | <div id="search_widget" style="display: none;"> | 31 | <div id="search_widget" style="display: none;"> |
| 33 | <div> | 32 | <div> |
diff --git a/config/locales/de.yml b/config/locales/de.yml index 8af3d46b..cfdae95c 100644 --- a/config/locales/de.yml +++ b/config/locales/de.yml | |||
| @@ -278,10 +278,6 @@ de: | |||
| 278 | date: "Datum" | 278 | date: "Datum" |
| 279 | author: "Autor" | 279 | author: "Autor" |
| 280 | type: "Typ" | 280 | type: "Typ" |
| 281 | menu: | ||
| 282 | dashboard: "Dashboard" | ||
| 283 | search: "Suche" | ||
| 284 | log_out: "Abmelden" | ||
| 285 | index: | 281 | index: |
| 286 | title: "cccms Dashboard" | 282 | title: "cccms Dashboard" |
| 287 | search_placeholder: "Nodes und Tags durchsuchen…" | 283 | search_placeholder: "Nodes und Tags durchsuchen…" |
| @@ -669,6 +665,9 @@ de: | |||
| 669 | lock_lost_link: "zurück zur veröffentlichten Seite" | 665 | lock_lost_link: "zurück zur veröffentlichten Seite" |
| 670 | insert_image: "Bild einfügen" | 666 | insert_image: "Bild einfügen" |
| 671 | insert_image_tooltip: "Eines der angehängten Bilder dieser Seite einfügen" | 667 | insert_image_tooltip: "Eines der angehängten Bilder dieser Seite einfügen" |
| 672 | nav_switchers: | 668 | nav_controls: |
| 673 | scheme_override: "Hell/Dunkel umschalten" | 669 | dashboard: "Dashboard" |
| 670 | search: "Suche" | ||
| 674 | switch_locale: "Sprache umschalten" | 671 | switch_locale: "Sprache umschalten" |
| 672 | scheme_override: "Hell/Dunkel umschalten" | ||
| 673 | log_out: "Abmelden" | ||
diff --git a/config/locales/en.yml b/config/locales/en.yml index fc3ad216..3c4ea1c8 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml | |||
| @@ -231,10 +231,6 @@ en: | |||
| 231 | editor: "Editor" | 231 | editor: "Editor" |
| 232 | date: "Date" | 232 | date: "Date" |
| 233 | type: "Type" | 233 | type: "Type" |
| 234 | menu: | ||
| 235 | dashboard: "Dashboard" | ||
| 236 | search: "Search" | ||
| 237 | log_out: "Log out" | ||
| 238 | index: | 234 | index: |
| 239 | title: "cccms dashboard" | 235 | title: "cccms dashboard" |
| 240 | search_placeholder: "Search nodes and tags…" | 236 | search_placeholder: "Search nodes and tags…" |
| @@ -621,6 +617,9 @@ en: | |||
| 621 | lock_lost_link: "return to the published page" | 617 | lock_lost_link: "return to the published page" |
| 622 | insert_image: "Insert image" | 618 | insert_image: "Insert image" |
| 623 | insert_image_tooltip: "Insert one of this page's attached images" | 619 | insert_image_tooltip: "Insert one of this page's attached images" |
| 624 | nav_switchers: | 620 | nav_controls: |
| 625 | scheme_override: "Toggle light/dark" | 621 | dashboard: "Dashboard" |
| 622 | search: "Search" | ||
| 626 | switch_locale: "Toggle language" | 623 | switch_locale: "Toggle language" |
| 624 | scheme_override: "Toggle light/dark" | ||
| 625 | log_out: "Log out" | ||
diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css index f697c4e2..4bcbf153 100644 --- a/public/stylesheets/admin.css +++ b/public/stylesheets/admin.css | |||
| @@ -459,6 +459,21 @@ form.button_to svg { | |||
| 459 | height: 1.25rem; | 459 | height: 1.25rem; |
| 460 | } | 460 | } |
| 461 | 461 | ||
| 462 | #main_navigation .nav_group { | ||
| 463 | display: flex; | ||
| 464 | align-items: center; | ||
| 465 | gap: 0.5rem; | ||
| 466 | margin-left: 1.25rem; | ||
| 467 | } | ||
| 468 | |||
| 469 | #main_navigation .nav_group:first-child { | ||
| 470 | margin-left: 0; | ||
| 471 | } | ||
| 472 | |||
| 473 | #main_navigation form.button_to { | ||
| 474 | margin-left: auto; | ||
| 475 | } | ||
| 476 | |||
| 462 | #main_navigation input.nav_toggle_input { | 477 | #main_navigation input.nav_toggle_input { |
| 463 | position: absolute; | 478 | position: absolute; |
| 464 | width: 1px; | 479 | width: 1px; |
| @@ -477,6 +492,18 @@ form.button_to svg { | |||
| 477 | background-color: var(--accent-surface); | 492 | background-color: var(--accent-surface); |
| 478 | } | 493 | } |
| 479 | 494 | ||
| 495 | #main_navigation form.button_to button:hover { | ||
| 496 | color: var(--on-solid); | ||
| 497 | background-color: var(--danger-solid); | ||
| 498 | } | ||
| 499 | |||
| 500 | #main_navigation a.nav_locale { | ||
| 501 | font-size: 0.8125rem; | ||
| 502 | font-weight: 700; | ||
| 503 | letter-spacing: 0.04em; | ||
| 504 | line-height: 1; | ||
| 505 | } | ||
| 506 | |||
| 480 | #dashboard_search { | 507 | #dashboard_search { |
| 481 | margin-bottom: 1.5rem; | 508 | margin-bottom: 1.5rem; |
| 482 | } | 509 | } |
