alchemy_cms 7.0.8 → 7.1.0.pre.b2

data/app/views/alchemy/admin/pages/_toolbar.html.erb

@@ -2,61 +2,66 @@
   <%= render "alchemy/admin/partials/site_select" %>
   <%= render "alchemy/admin/partials/language_tree_select" %>
   <%= toolbar_button(
-    icon: :plus,
+    icon: "file-add",
     url: alchemy.new_admin_page_path(language: @current_language),
     hotkey: 'alt+n',
+    tooltip_placement: "top-start",
     dialog_options: {
       title: Alchemy.t('Add a page'),
       size: '340x215',
       overflow: true
     },
-    title: Alchemy.t('Add a page'),
     label: Alchemy.t('Add a page'),
     if_permitted_to: [:create, Alchemy::Page]
   ) %>
   <div class="toolbar_spacer"></div>
   <% if can?(:flush, Alchemy::Page) %>
-    <div class="button_with_label">
-      <%= link_to(
-        render_icon(:eraser),
-        alchemy.flush_admin_pages_path,
-        remote: true,
-        method: :post,
-        class: "icon_button please_wait",
-        title: Alchemy.t("Flush page cache")
-      ) %>
-      <label><%= Alchemy.t("Flush page cache") %></label>
+    <div class="toolbar_button">
+      <sl-tooltip content="<%= Alchemy.t("Flush page cache") %>">
+        <%= link_to(
+          render_icon(:eraser),
+          alchemy.flush_admin_pages_path,
+          remote: true,
+          method: :post,
+          class: "icon_button please_wait",
+          title: Alchemy.t("Flush page cache")
+        ) %>
+      </sl-tooltip>
     </div>
   <% end %>
-  <div class="button_with_label" id="clipboard_button">
-    <%= link_to_dialog(
-      render_icon(clipboard_empty?("pages") ? :clipboard : :paste),
-      alchemy.admin_clipboard_path(remarkable_type: "pages"),
-      {
-        title: Alchemy.t("Clipboard"),
-        size: "380x305"
-      },
-      class: "icon_button",
-      title: Alchemy.t("Show clipboard")
-    ) %>
-    <label><%= Alchemy.t("Show clipboard") %></label>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t("Show clipboard") %>">
+      <%= link_to_dialog(
+        render_icon(:clipboard, style: clipboard_empty?("pages") ? "line" : "fill"),
+        alchemy.admin_clipboard_path(remarkable_type: "pages"),
+        {
+          title: Alchemy.t("Clipboard"),
+          size: "380x305"
+        },
+        class: "icon_button",
+        title: Alchemy.t("Show clipboard"),
+        id: "clipboard_button"
+      ) %>
+    </sl-tooltip>
   </div>
   <div class="toolbar_spacer"></div>
-  <div class="button_with_label<%= @view != "list" ? " active" : nil %>">
-    <%= link_to(
-      render_icon(:stream),
-      alchemy.admin_pages_path(view: "tree"),
-      class: "icon_button"
-    ) %>
-    <label><%= Alchemy.t("Hierarchical") %></label>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t("Hierarchical") %>">
+      <%= link_to(
+        render_icon(:"menu-2"),
+        alchemy.admin_pages_path(view: "tree"),
+        class: ["icon_button", @view != "list" && "active"].compact
+      ) %>
+    </sl-tooltip>
   </div>
-  <div class="button_with_label<%= @view == "list" ? " active" : nil %>">
-    <%= link_to(
-      render_icon("sort-amount-down-alt"),
-      alchemy.admin_pages_path(view: "list"),
-      class: "icon_button"
-    ) %>
-    <label><%= Alchemy.t("Sortable List") %></label>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t("Sortable List") %>">
+      <%= link_to(
+        render_icon("sort-desc", style: nil),
+        alchemy.admin_pages_path(view: "list"),
+        class: ["icon_button", @view == "list" && "active"].compact
+      ) %>
+    </sl-tooltip>
   </div>
 </div>
 <% search_filter_params[:view] = "list" %>

data/app/views/alchemy/admin/pages/configure.html.erb

@@ -1,16 +1,14 @@
-<div id="overlay_tabs">
-  <ul>
-    <li><a href="#page_properties"><%= Alchemy.t('Properties') %></a></li>
-    <li>
-      <a href="#legacy_urls" id="legacy_urls_label">
-        <%= render 'alchemy/admin/legacy_page_urls/label', count: @page.legacy_urls.size %>
-      </a>
-    </li>
-  </ul>
-  <div id="page_properties">
+<sl-tab-group id="overlay_tabs">
+  <sl-tab slot="nav" panel="page_properties">
+    <%= Alchemy.t('Properties') %>
+  </sl-tab>
+  <sl-tab slot="nav" panel="legacy_urls" id="legacy_urls_label">
+    <%= render 'alchemy/admin/legacy_page_urls/label', count: @page.legacy_urls.size %>
+  </sl-tab>
+  <sl-tab-panel name="page_properties">
     <%= render 'form' %>
-  </div>
-  <div id="legacy_urls">
+  </sl-tab-panel>
+  <sl-tab-panel name="legacy_urls">
     <%= render 'legacy_urls' %>
-  </div>
-</div>
+  </sl-tab-panel>
+</sl-tab-group>

data/app/views/alchemy/admin/pages/edit.html.erb

@@ -4,109 +4,98 @@
 
 <% content_for(:toolbar) do %>
 <div class="toolbar_buttons">
-  <div class="button_with_label">
-    <%= form_tag alchemy.unlock_admin_page_path(@page, redirect_to: @layoutpage ? alchemy.admin_layoutpages_path : alchemy.admin_pages_path), id: 'unlock_page_form' do %>
-      <button class="icon_button" title="<%= Alchemy.t(:explain_unlocking) %>" data-alchemy-hotkey="alt+x">
-        <%= render_icon('sign-out-alt', transform: 'flip-horizontal') %>
-      </button>
-      <label><%= Alchemy.t(:unlock_page) %></label>
-    <% end %>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t(:explain_unlocking) %>" placement="top-start">
+      <%= form_tag alchemy.unlock_admin_page_path(@page, redirect_to: @layoutpage ? alchemy.admin_layoutpages_path : alchemy.admin_pages_path), id: 'unlock_page_form' do %>
+        <button class="icon_button" data-alchemy-hotkey="alt+x">
+          <%= render_icon('expand-left') %>
+        </button>
+      <% end %>
+    </sl-tooltip>
   </div>
   <div class="toolbar_spacer"></div>
-  <div class="button_with_label">
-    <%= link_to_dialog(
-      render_icon('info-circle'),
-      alchemy.info_admin_page_path(@page),
-      {
-        title: Alchemy.t(:page_infos),
-        size: '520x320'
-      },
-      {
-        class: 'icon_button',
-        'data-alchemy-hotkey' => 'alt+i'
-      }
-    ) %>
-    <label><%= Alchemy.t(:page_infos) %></label>
-  </div>
-  <div class="button_with_label">
-    <% if @page.layoutpage? %>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t(:page_infos) %>">
       <%= link_to_dialog(
-        render_icon(:cog),
-        alchemy.edit_admin_layoutpage_path(@page),
+        render_icon(:information),
+        alchemy.info_admin_page_path(@page),
         {
-          title: Alchemy.t(:edit_page_properties),
-          size: '450x170'
+          title: Alchemy.t(:page_infos),
+          size: '520x320'
         },
-        class: :icon_button,
-        title: Alchemy.t(:edit_page_properties),
-        'data-alchemy-hotkey' => 'alt+e'
-      ) %>
-    <% else %>
-      <%= link_to_dialog(
-        render_icon(:cog),
-        alchemy.configure_admin_page_path(@page),
         {
-          title: Alchemy.t(:edit_page_properties),
-          size: '450x680'
-        },
-        class: :icon_button,
-        title: Alchemy.t(:edit_page_properties),
-        'data-alchemy-hotkey' => 'alt+e'
+          class: 'icon_button',
+          'data-alchemy-hotkey' => 'alt+i'
+        }
       ) %>
-    <% end %>
-    <label><%= Alchemy.t(:page_properties) %></label>
+    </sl-tooltip>
   </div>
-  <div class="button_with_label">
-    <%= form_tag alchemy.publish_admin_page_path(@page), id: 'publish_page_form' do %>
-      <%= button_tag class: 'icon_button', disabled: cannot?(:publish, @page) do %>
-        <%= render_icon('cloud-upload-alt') %>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t(:edit_page_properties) %>">
+      <% if @page.layoutpage? %>
+        <%= link_to_dialog(
+          render_icon("settings-3"),
+          alchemy.edit_admin_layoutpage_path(@page),
+          {
+            title: Alchemy.t(:page_properties),
+            size: '450x170'
+          },
+          class: :icon_button,
+          'data-alchemy-hotkey' => 'alt+e'
+        ) %>
+      <% else %>
+        <%= link_to_dialog(
+          render_icon("settings-3"),
+          alchemy.configure_admin_page_path(@page),
+          {
+            title: Alchemy.t(:page_properties),
+            size: '450x680'
+          },
+          class: :icon_button,
+          'data-alchemy-hotkey' => 'alt+e'
+        ) %>
       <% end %>
-      <label>
-        <% if @page.language.public? %>
-          <%= Alchemy.t(:explain_publishing) %>
-        <% elsif @page.editable_by?(current_alchemy_user) %>
-          <%= Alchemy.t(:publish_page_language_not_public) %>
-        <% else %>
-          <%= Alchemy.t(:publish_page_not_allowed) %>
+    </sl-tooltip>
+  </div>
+  <div class="toolbar_button">
+    <%= content_tag "sl-tooltip", content: @page.language.public? ? Alchemy.t(:explain_publishing) : @page.editable_by?(current_alchemy_user) ? Alchemy.t(:publish_page_language_not_public) : Alchemy.t(:publish_page_not_allowed) do %>
+      <%= form_tag alchemy.publish_admin_page_path(@page), id: 'publish_page_form' do %>
+        <%= button_tag class: 'icon_button please_wait', disabled: cannot?(:publish, @page) do %>
+          <%= render_icon('upload-cloud-2') %>
         <% end %>
-      </label>
+      <% end %>
     <% end %>
   </div>
   <% unless @page.layoutpage? %>
-    <div class="button_with_label">
+    <div class="toolbar_button">
       <% if @page.public? %>
-        <%= link_to show_page_url(
+        <sl-tooltip content="<%= Alchemy.t("Visit page") %>">
+          <%= link_to show_page_url(
               urlname: @page.urlname,
               locale: prefix_locale? ? @page.language_code : nil,
               host: @page.site.host == "*" ? request.host : @page.site.host,
             ),
-            title: Alchemy.t("Visit page"),
             data: { turbo: false },
             target: "_blank",
             class: 'icon_button' do %>
-          <%= render_icon('external-link-alt') %>
-        <% end %>
-        <label><%= Alchemy.t("Visit page") %></label>
+            <%= render_icon('external-link') %>
+          <% end %>
+        </sl-tooltip>
       <% else %>
-        <%= content_tag "a",
-            title: Alchemy.t(:cannot_visit_unpublic_page),
-            class: 'disabled icon_button' do %>
-          <%= render_icon('external-link-alt') %>
-        <% end %>
-        <label><%= Alchemy.t(:cannot_visit_unpublic_page) %></label>
+        <sl-tooltip content="<%= Alchemy.t(:cannot_visit_unpublic_page) %>">
+          <%= content_tag "a", class: "disabled icon_button" do %>
+            <%= render_icon('external-link') %>
+          <% end %>
+        </sl-tooltip>
       <% end %>
     </div>
   <% end %>
-  <% if @page.has_hint? %>
-    <div class="toolbar_spacer"></div>
-    <%= render_hint_for(@page) %>
-  <% end %>
   <div class="toolbar_spacer"></div>
   <div class="select_with_label">
     <label><%= Alchemy.t(:preview_size) %></label>
     <%= select_tag 'preview_size',
       preview_sizes_for_select,
-      class: 'alchemy_selectbox medium' %>
+      class: 'medium', is: 'alchemy-select' %>
   </div>
   <div class="toolbar_spacer"></div>
   <% if @preview_urls.many? %>
@@ -114,25 +103,26 @@
       <label><%= Alchemy.t(:preview_url) %></label>
       <%= select_tag 'preview_url',
         options_for_select(@preview_urls),
-        class: 'alchemy_selectbox large' %>
+        class: 'large', is: 'alchemy-select' %>
     </div>
   <% end %>
-  <div class="button_with_label">
-    <%= link_to render_icon(:redo), nil, {
-      title: Alchemy.t('Reload Preview'),
-      class: 'icon_button',
-      id: 'reload_preview_button'
-    } %>
-    <label><%= Alchemy.t('Reload Preview') %></label>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t('Reload Preview') %>">
+      <%= link_to render_icon(:refresh), nil, {
+        class: 'icon_button',
+        id: 'reload_preview_button'
+      } %>
+    </sl-tooltip>
   </div>
 </div>
 <div class="toolbar_buttons right">
-  <div class="button_with_label" id="element_window_button">
-    <%= link_to render_icon(:bars), nil, {
-      title: Alchemy.t(:hide_elements),
-      class: 'icon_button'
-    } %>
-    <label><%= Alchemy.t(:hide_elements) %></label>
+  <div class="toolbar_button">
+    <sl-tooltip content="<%= Alchemy.t(:hide_elements) %>">
+      <%= link_to render_icon("menu-unfold"), nil, {
+        id: "element_window_button",
+        class: "icon_button"
+      } %>
+    </sl-tooltip>
   </div>
 </div>
 <% end %>
@@ -164,10 +154,10 @@
       },
       toolbarButtons: [
         {
-          title: '<%= Alchemy.t("New Element") %>',
           label: '<%= Alchemy.t("New Element") %>',
           hotkey: 'alt+n',
-          iconClass: 'plus',
+          iconClass: 'add-line',
+          align: 'start',
           onClick: function() {
             Alchemy.openDialog('<%= alchemy.new_admin_element_path(page_version_id: @page_version.id) %>', {
               title: '<%= Alchemy.t("New Element") %>',
@@ -176,9 +166,8 @@
           }
         },
         {
-          title: '<%= Alchemy.t("Clipboard") %>',
           label: '<%= Alchemy.t("Show clipboard") %>',
-          iconClass: '<%= clipboard_empty?("elements") ? "clipboard" : "paste" %>',
+          iconClass: '<%= clipboard_empty?("elements") ? "clipboard-line" : "clipboard-fill" %>',
           buttonId: 'clipboard_button',
           onClick: function() {
             Alchemy.openDialog('<%= alchemy.admin_clipboard_path(remarkable_type: "elements") %>', {
@@ -189,18 +178,6 @@
         }
       ]
     }, function() {
-      Alchemy.ImageLoader('#element_area');
-      Alchemy.SortableElements(<%= @page.id %>, '<%= form_authenticity_token %>');
-      Alchemy.ElementEditors.init();
-      Alchemy.SelectBox('.element-editor');
-      Alchemy.Tinymce.init(<%= @page.richtext_ingredients_ids.to_json %>);
-      $('#fixed-elements').tabs().tabs('paging', {
-        follow: true,
-        followOnSelect: true,
-        prevButton: '<i class="fas fa-angle-double-left"></i>',
-        nextButton: '<i class="fas fa-angle-double-right"></i>'
-      });
-      Alchemy.ElementDirtyObserver('#element_area');
       if (window.location.hash) {
         $(window.location.hash).trigger('FocusElementEditor.Alchemy');
       }

data/app/views/alchemy/admin/pages/info.html.erb

@@ -1,6 +1,6 @@
 <div class="resource_info">
   <% if @page.has_hint? %>
-  <%= render_message do %>
+  <%= render_message(:hint) do %>
     <%= @page.hint %>
   <% end %>
   <% end %>
@@ -20,13 +20,28 @@
   <div class="value">
     <label><%= Alchemy.t(:page_status) %></label>
     <p>
+      <% if @page.locked? %>
+        <span class="page_status">
+          <%= render_icon(:edit, size: "1x") %>
+          <%= Alchemy.t(:currently_edited_by) %>
+          <%= @page.locker_name %>
+        </span>
+      <% end %>
       <span class="page_status">
-        <%= render_icon(:compass, transform: 'shrink-2', class: @page.public? ? nil : 'disabled') %>
-        <%= @page.status_title(:public) %>
+        <% if @page.public? %>
+          <%= render_icon(:cloud, size: "1x") %>
+        <% else %>
+          <%= render_icon("cloud-off", size: "1x") %>
+        <% end %>
+        <%= @page.status_message(:public) %>
       </span>
       <span class="page_status">
-        <%= render_icon(:lock, transform: 'shrink-2', class: @page.restricted? ? nil : 'disabled') %>
-        <%= @page.status_title(:restricted) %>
+        <% if @page.restricted? %>
+          <%= render_icon(:lock, size: "1x") %>
+        <% else %>
+          <%= render_icon("lock-unlock", size: "1x") %>
+        <% end %>
+        <%= @page.status_message(:restricted) %>
       </span>
     </p>
   </div>
@@ -38,10 +53,4 @@
     <label><%= Alchemy.t(:page_was_updated) %></label>
     <p><%= Alchemy.t(:from_at) % {by: @page.updater_name, at: l(@page.updated_at, format: :'alchemy.page_status')} %></p>
   </div>
-  <% if @page.locked? %>
-  <div class="value">
-    <label><%= Alchemy.t(:currently_edited_by) %></label>
-    <p><%= @page.locker_name %></p>
-  </div>
-  <% end %>
 </div>

data/app/views/alchemy/admin/pages/link.html.erb

@@ -1,20 +1,26 @@
-<div id="overlay_tabs">
-  <ul>
-    <li><a href="#overlay_tab_internal_link"><%= Alchemy.t('link_overlay_tab_label.internal') %></a></li>
-    <li><a href="#overlay_tab_anchor_link"><%= Alchemy.t('link_overlay_tab_label.anchor') %></a></li>
-    <li><a href="#overlay_tab_external_link"><%= Alchemy.t('link_overlay_tab_label.external') %></a></li>
-    <li><a href="#overlay_tab_file_link"><%= Alchemy.t('link_overlay_tab_label.file') %></a></li>
-  </ul>
-  <div id="overlay_tab_internal_link">
+<sl-tab-group id="overlay_tabs">
+  <sl-tab slot="nav" panel="overlay_tab_internal_link">
+    <%= Alchemy.t('link_overlay_tab_label.internal') %>
+  </sl-tab>
+  <sl-tab slot="nav" panel="overlay_tab_anchor_link">
+    <%= Alchemy.t('link_overlay_tab_label.anchor') %>
+  </sl-tab>
+  <sl-tab slot="nav" panel="overlay_tab_external_link">
+    <%= Alchemy.t('link_overlay_tab_label.external') %>
+  </sl-tab>
+  <sl-tab slot="nav" panel="overlay_tab_file_link">
+    <%= Alchemy.t('link_overlay_tab_label.file') %>
+  </sl-tab>
+  <sl-tab-panel name="overlay_tab_internal_link">
     <%= render partial: 'internal_link' %>
-  </div>
-  <div id="overlay_tab_anchor_link">
+  </sl-tab-panel>
+  <sl-tab-panel name="overlay_tab_anchor_link">
     <%= render partial: 'anchor_link' %>
-  </div>
-  <div id="overlay_tab_external_link">
+  </sl-tab-panel>
+  <sl-tab-panel name="overlay_tab_external_link">
     <%= render partial: 'external_link' %>
-  </div>
-  <div id="overlay_tab_file_link">
+  </sl-tab-panel>
+  <sl-tab-panel name="overlay_tab_file_link">
     <%= render partial: 'file_link' %>
-  </div>
-</div>
+  </sl-tab-panel>
+</sl-tab-group>

data/app/views/alchemy/admin/pages/new.html.erb

@@ -1,26 +1,24 @@
 <%- if @clipboard_items.blank? -%>
   <%= render 'new_page_form' %>
 <%- else -%>
-<div id="overlay_tabs">
-  <ul>
-    <li><a href="#create_page_tab"><%= Alchemy.t('New page') %></a></li>
-    <li><a href="#paste_page_tab"><%= Alchemy.t('Paste from clipboard') %></a></li>
-  </ul>
-  <div id="create_page_tab">
+<sl-tab-group id="overlay_tabs">
+  <sl-tab slot="nav" panel="create_page_tab"><%= Alchemy.t('New page') %></sl-tab>
+  <sl-tab slot="nav" panel="paste_page_tab"><%= Alchemy.t('Paste from clipboard') %></sl-tab>
+  <sl-tab-panel name="create_page_tab">
     <%= render 'new_page_form' %>
-  </div>
-  <div id="paste_page_tab">
+  </sl-tab-panel>
+  <sl-tab-panel name="paste_page_tab">
     <%= alchemy_form_for [:admin, @page] do |f| %>
       <%= f.hidden_field(:parent_id) %>
       <div class="input select">
         <label for="paste_from_clipboard" class="control-label"><%= Alchemy.t("Page") %></label>
         <%= select_tag 'paste_from_clipboard',
           clipboard_select_tag_options(@clipboard_items),
-          class: 'alchemy_selectbox' %>
+          is: 'alchemy-select' %>
       </div>
       <%= f.input :name %>
       <%= f.submit Alchemy.t(:paste) %>
     <% end %>
-  </div>
-</div>
+  </sl-tab-panel>
+</sl-tab-group>
 <%- end -%>

data/app/views/alchemy/admin/pages/unlock.js.erb

@@ -1,13 +1,20 @@
 (function() {
+  var locked_page_icon_content
   var locked_page_tab = document.querySelector('#locked_page_<%= @page.id -%>')
   var locked_page_icon = document.querySelector(
-    '#page_<%= @page.id -%> > .sitemap_page > .sitemap_left_images .with-hint'
-  ) || document.querySelector('[data-page-id="<%= @page.id -%>"] > .icon')
+    '#page_<%= @page.id -%> > .sitemap_page > .sitemap_left_images .like-hint-tooltip'
+  ) || document.querySelector('[data-page-id="<%= @page.id -%>"] i.icon')
   if (locked_page_tab) {
     locked_page_tab.remove()
   }
   if (locked_page_icon) {
-    locked_page_icon.innerHTML = '<i class="icon far fa-file fa-lg"></i>'
+    if (locked_page_icon.parentElement.classList.contains("handle")) {
+      locked_page_icon_content = '<span class="handle"><i class="icon ri-file-line ri-fw ri-xl"></i></span>'
+    } else {
+      locked_page_icon_content = '<i class="icon ri-file-line ri-fw ri-xl"></i>'
+    }
+    locked_page_icon.outerHTML = locked_page_icon_content
   }
+  document.querySelector("#page_<%= @page.id -%> .page_status.locked").remove()
   Alchemy.growl('<%= flash[:notice] -%>')
 })()

data/app/views/alchemy/admin/partials/_language_tree_select.html.erb

@@ -1,18 +1,20 @@
 <% languages = Alchemy::Language.on_current_site %>
 <% if can?(:switch_language, Alchemy::Page) && languages.many? %>
-<div class="button_with_label">
-  <%= form_tag switch_admin_languages_path, method: 'get' do %>
-    <%= select_tag(
-      'language_id',
-      options_for_select(
-        languages.map { |l| [l.name, l.id] },
-        Alchemy::Language.current.id
-      ),
-      class: 'alchemy_selectbox short',
-      data: {'auto-submit' => true}
-    ) %>
-  <% end %>
-  <label><%= Alchemy.t("Language tree") %></label>
+<div class="toolbar_button">
+  <sl-tooltip content="<%= Alchemy.t("Language tree") %>">
+    <%= form_tag switch_admin_languages_path, method: 'get' do %>
+      <%= select_tag(
+        'language_id',
+        options_for_select(
+          languages.map { |l| [l.name, l.id] },
+          Alchemy::Language.current.id
+        ),
+        class: 'short',
+        is: 'alchemy-select',
+        data: {'auto-submit' => true}
+      ) %>
+    <% end %>
+  </sl-tooltip>
 </div>
 <div class="toolbar_spacer"></div>
 <% end %>

data/app/views/alchemy/admin/partials/_main_navigation_entry.html.erb

@@ -4,13 +4,11 @@
       <% if navigation["image"] %>
         <%= image_tag(navigation["image"]) %>
       <% elsif navigation["inline_image"] %>
-        <span class="icon fa-fw">
-          <%== navigation["inline_image"] %>
-        </span>
+        <%== navigation["inline_image"] %>
       <% elsif navigation["icon"] %>
-        <i class="module icon fas fa-<%= navigation["icon"] %> fa-lg fa-fw"></i>
+        <i class="icon ri-<%= navigation["icon"] %>"></i>
       <% else %>
-        <i class="module icon fas fa-table fa-lg fa-fw"></i>
+        <i class="icon ri-table-line"></i>
       <% end %>
       <label><%= Alchemy.t(navigation['name']) %></label>
     <% end %>

data/app/views/alchemy/admin/partials/_routes.html.erb

@@ -9,8 +9,16 @@
       return '<%= alchemy.url_admin_picture_path(id: 1) %>'.replace(/1/, id);
     },
 
-    fold_admin_element_path: function(id) {
-      return '<%= alchemy.fold_admin_element_path(id: 1) %>'.replace(/1/, id);
+    collapse_admin_element_path: function(id) {
+      return '<%= alchemy.collapse_admin_element_path(id: 1) %>'.replace(/1/, id);
+    },
+
+    expand_admin_element_path: function(id) {
+      return '<%= alchemy.expand_admin_element_path(id: 1) %>'.replace(/1/, id);
+    },
+
+    publish_admin_element_path: function(id) {
+      return '<%= alchemy.publish_admin_element_path(id: 1) %>'.replace(/1/, id);
     },
 
     node: {

data/app/views/alchemy/admin/partials/_site_select.html.erb

@@ -1,9 +1,10 @@
 <%- if multi_site? -%>
-<div class="button_with_label">
-  <%= select_tag 'change_site',
-    options_for_select(sites_for_select, Alchemy::Site.current.id),
-    class: 'alchemy_selectbox' %>
-  <label><%= Alchemy.t("Current site") %></label>
+<div class="toolbar_button">
+  <sl-tooltip content="<%= Alchemy.t("Current site") %>">
+    <%= select_tag 'change_site',
+      options_for_select(sites_for_select, Alchemy::Site.current.id),
+      is: 'alchemy-select' %>
+  </sl-tooltip>
 </div>
 <div class="toolbar_spacer"></div>
 <%- end -%>