Merge pull request #3096 from tvdeyen/element-hint-in-header-again

Move element hint into header (again)
AlchemyCMS · Nov 28, 2024 · e6523b8 · e6523b8
2 parents 0b6402e + b3e8fb3
commit e6523b8
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 12 deletions.
diff --git a/app/assets/builds/alchemy/admin.css b/app/assets/builds/alchemy/admin.css
diff --git a/app/assets/builds/alchemy/admin.css.map b/app/assets/builds/alchemy/admin.css.map
diff --git a/app/stylesheets/alchemy/admin/elements.scss b/app/stylesheets/alchemy/admin/elements.scss
@@ -77,19 +77,17 @@ alchemy-tinymce {
 }
 
 .element-title {
+  display: inline-flex;
+  align-items: center;
   flex-grow: 1;
-  overflow: hidden;
   white-space: nowrap;
-  text-overflow: ellipsis;
   transition: color vars.$transition-duration;
   line-height: 1;
   max-width: 85%;
 
-  .element-hidden > & {
-    max-width: 65%;
-  }
-
   .preview_text_quote {
+    overflow: hidden;
+    text-overflow: ellipsis;
     font-size: var(--font-size_small);
     margin-left: var(--spacing-0);
   }
@@ -99,6 +97,7 @@ alchemy-tinymce {
   font-size: var(--font-size_small);
   font-weight: bold;
   line-height: 15px;
+  margin-right: var(--spacing-0);
 }
 
 .element-handle {
@@ -160,6 +159,14 @@ alchemy-tinymce {
     > .element-header {
       background-color: transparent;
 
+      .element-title {
+        max-width: 65%;
+      }
+
+      .element-toggle {
+        margin-left: var(--spacing-1);
+      }
+
       .element-hidden-icon {
         display: inline-flex;
         align-items: center;

diff --git a/app/views/alchemy/admin/elements/_element.html.erb b/app/views/alchemy/admin/elements/_element.html.erb
@@ -13,10 +13,6 @@
 
   <%= render 'alchemy/admin/elements/toolbar', element: element %>
 
-  <% if element.has_hint? %>
-    <%= render_message(:hint, sanitize(element.hint)) %>
-  <% end %>
-
   <% element.definition[:message].tap do |message| %>
     <%= render_message(:info, sanitize(message)) if message %>
   <% end %>

diff --git a/app/views/alchemy/admin/elements/_header.html.erb b/app/views/alchemy/admin/elements/_header.html.erb
@@ -10,6 +10,7 @@
   </span>
   <span class="element-title">
     <span class="preview_text_element_name"><%= element.display_name %></span>
+    <%= render_hint_for(element, size: "1x", fixed_width: false) %>
     <span class="preview_text_quote">
       <%= sanitize(element.preview_text.presence || '&nbsp;') %>
     </span>