From 7cf54db0dbe723e602bfefbd66818f510c0c0561 Mon Sep 17 00:00:00 2001
From: Thomas von Deyen <thomas@vondeyen.com>
Date: Tue, 16 Apr 2024 20:49:37 +0200
Subject: [PATCH] UI fixes for picture css class display

The css_class is shown as overlay on the picture ingredient
editor. Since the toolbar has raised the height we need to
adopt the position
---
 app/assets/stylesheets/alchemy/elements.scss | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/alchemy/elements.scss b/app/assets/stylesheets/alchemy/elements.scss
index 551d001b59..22b39a6367 100644
--- a/app/assets/stylesheets/alchemy/elements.scss
+++ b/app/assets/stylesheets/alchemy/elements.scss
@@ -641,15 +641,13 @@ alchemy-publish-element-button {
   .picture_ingredient_css_class {
     position: absolute;
     z-index: 1;
-    bottom: 24px;
-    width: 99px;
-    background-color: white;
+    bottom: 34px;
     background-color: rgba(255, 254, 255, 0.7);
     padding: 4px 8px;
     font-size: $small-font-size;
-    text-align: right;
-    height: 12px;
     overflow: hidden;
+    max-width: 100%;
+    text-overflow: ellipsis;
   }
 }