[ACA-4634] Folder Rules style fix: Edit and Delete Rule buttons disap…

…pear if rules have long description or name (#2842) * [ACS-4146] - unit tests * [ACS-4146] - removed console.log() * ACS-3961 - style fixes * ACS-3961 - removed calculated width
Alfresco · Dec 11, 2022 · 088eac5 · 088eac5
1 parent 86178c3
commit 088eac5
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/projects/aca-folder-rules/src/lib/manage-rules/manage-rules.smart-component.scss b/projects/aca-folder-rules/src/lib/manage-rules/manage-rules.smart-component.scss
@@ -51,16 +51,20 @@
         z-index: 1;
         display: flex;
         flex-direction: row;
-        align-items: center;
+        align-items: flex-start;
+        overflow-x: auto;
         justify-content: space-between;
         padding: 12px 20px;
         border-bottom: 1px solid var(--theme-border-color);
         background-color: var(--theme-background-color);
+        column-gap: 20px;
 
         &__title {
           display: flex;
           flex-direction: column;
           gap: 4px;
+          word-wrap: break-word;
+          min-width: 100px;
 
           &__name {
             font-size: 1.2em;

diff --git a/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss b/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss
@@ -22,12 +22,16 @@
     &__name {
       font-size: 1.2em;
       font-weight: bold;
+      overflow: hidden;
+      text-overflow: ellipsis;
     }
   }
 
   &__description {
     font-size: 0.8em;
     font-style: italic;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 
   &.selected {