From 77909f4cd1be0f01cc39d1c04207dec34a5dcf64 Mon Sep 17 00:00:00 2001
From: Sebastian Stehle <sebastian@squidex.io>
Date: Thu, 14 Mar 2024 11:27:24 +0100
Subject: [PATCH] Fix button positioning.

---
 .../content/shared/forms/content-field.component.scss    | 9 ++++++---
 .../content/shared/forms/field-editor.component.html     | 6 +++---
 .../content/shared/forms/field-editor.component.scss     | 4 ++--
 3 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/frontend/src/app/features/content/shared/forms/content-field.component.scss b/frontend/src/app/features/content/shared/forms/content-field.component.scss
index 2d1052149..a6221050e 100644
--- a/frontend/src/app/features/content/shared/forms/content-field.component.scss
+++ b/frontend/src/app/features/content/shared/forms/content-field.component.scss
@@ -27,16 +27,19 @@
 
     &-inner {
         background: $color-white;
-        height: 2.125rem;
     }
 
     &-buttons {
-        @include absolute(-.75rem, 6.5rem, null, 0);
+        @include absolute(100%, 0);
+        margin: 0;
+        margin-top: -8px;
         overflow: hidden;
     }
 
     &-buttons-compare {
-        @include absolute(-.75rem, 0, null, 0);
+        @include absolute(100%, 0);
+        margin: 0;
+        margin-top: -9px;
         overflow: hidden;
     }
 }
diff --git a/frontend/src/app/features/content/shared/forms/field-editor.component.html b/frontend/src/app/features/content/shared/forms/field-editor.component.html
index d3cd0c073..608b560b0 100644
--- a/frontend/src/app/features/content/shared/forms/field-editor.component.html
+++ b/frontend/src/app/features/content/shared/forms/field-editor.component.html
@@ -1,7 +1,7 @@
 <div class="field" [class.expanded]="isExpanded" *ngIf="formModel">
-    <div class="buttons-container" *ngIf="!(isDisabled | async)">
+    <fieldset class="buttons-container" [disabled]="isDisabled | async">
         <div class="buttons">
-            <button *ngIf="hasChatBot" type="button" class="btn btn-sm btn-outline-secondary force no-focus-shadow" (click)="chatDialog.show()" tabindex="-1">
+            <button type="button" class="btn btn-sm btn-outline-secondary force no-focus-shadow" (click)="chatDialog.show()" [disabled]="!hasChatBot" tabindex="-1">
                 AI
             </button>
 
@@ -18,7 +18,7 @@
                 <i class="icon-close"></i>
             </button>
         </div>
-    </div>
+    </fieldset>
 
     <label>
         {{field.displayName}} {{displaySuffix}} <span class="field-required" [class.hidden]="!field.properties.isRequired">*</span>
diff --git a/frontend/src/app/features/content/shared/forms/field-editor.component.scss b/frontend/src/app/features/content/shared/forms/field-editor.component.scss
index fe992d934..8b232c78f 100644
--- a/frontend/src/app/features/content/shared/forms/field-editor.component.scss
+++ b/frontend/src/app/features/content/shared/forms/field-editor.component.scss
@@ -27,9 +27,9 @@
 
 .buttons {
     & {
-        @include absolute(-.75rem, 0);
+        @include absolute(100%, 0);
         margin: 0;
-        margin-top: -1px;
+        margin-top: -9px;
     }
 
     &-container {