rework btn-fab classes; introduce new fab size; rework btn-fab style …

…in attribute lists; rework system-separator ui Signed-off-by: Vinzenz Rosenkranz <[email protected]>
DH-Center-Tuebingen · Dec 13, 2024 · 2878385 · 2878385
1 parent 55fb812
commit 2878385
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 11 deletions.
diff --git a/resources/js/components/AttributeList.vue b/resources/js/components/AttributeList.vue
@@ -31,7 +31,7 @@
                     >
                         <div
                             v-show="!!state.hoverStates[index]"
-                            class="btn-fab-list"
+                            class="btn-fab-list btn-fab-list-md position-absolute"
                         >
                             <button
                                 v-show="hasEmitter('onReorderList')"
@@ -86,12 +86,16 @@
                                 />
                             </button>
                         </div>
-                        <span
-                            v-if="!element.is_system"
+                        <div
                             class="text-end col"
                         >
-                            {{ translateConcept(element.thesaurus_url) }}
-                        </span>
+                            <span v-if="element.is_system">
+                                &nbsp;
+                            </span>
+                            <span v-else>
+                                {{ translateConcept(element.thesaurus_url) }}
+                            </span>
+                        </div>
                         <sup
                             v-if="hasEmitter('onMetadata')"
                             class="clickable d-flex flex-row align-items-start top-0"

diff --git a/resources/js/components/EntityTypeList.vue b/resources/js/components/EntityTypeList.vue
@@ -27,12 +27,12 @@
                 <div
                     v-if="state.hasOnHoverListener"
                     v-show="state.hoverStates[i]"
-                    class="ms-auto btn-fab-list bg-white position-absolute z-1 end-0 me-2"
+                    class="ms-auto btn-fab-list btn-fab-list-sm bg-white position-absolute z-1 end-0 me-2"
                     :class="activeClasses(entry)"
                 >
                     <button
                         v-if="state.hasEditListener"
-                        class="btn btn-outline-info btn-fab-sm rounded-circle"
+                        class="btn btn-outline-info btn-fab rounded-circle"
                         data-bs-toggle="popover"
                         :data-content="t('global.edit')"
                         data-trigger="hover"
@@ -46,7 +46,7 @@
                     </button>
                     <button
                         v-if="state.hasDuplicateListener"
-                        class="btn btn-outline-primary btn-fab-sm rounded-circle"
+                        class="btn btn-outline-primary btn-fab rounded-circle"
                         data-bs-toggle="popover"
                         :data-content="t('global.duplicate')"
                         data-trigger="hover"
@@ -60,7 +60,7 @@
                     </button>
                     <button
                         v-if="state.hasDeleteListener"
-                        class="btn btn-outline-danger btn-fab-sm rounded-circle"
+                        class="btn btn-outline-danger btn-fab rounded-circle"
                         data-bs-toggle="popover"
                         :data-content="t('global.delete')"
                         data-trigger="hover"

diff --git a/resources/js/components/attribute/SystemSeparator.vue b/resources/js/components/attribute/SystemSeparator.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="d-flex flex-row align-items-center gap-2">
+    <div class="d-flex flex-row align-items-center gap-2 form-control">
         <div
             class="bg-secondary flex-grow-1 rounded-5"
             style="height: 3px;"

diff --git a/resources/sass/_style.scss b/resources/sass/_style.scss
@@ -97,14 +97,22 @@ dl.dl-0-mb > dd:last-child {
     width: 1.8rem;
 }
 
-.btn-fab-sm {
+.btn-fab-list-sm > .btn-fab, .btn-fab-sm {
     padding: 0;
     height: 1.25rem;
     width: 1.25rem;
     font-size: 0.8rem;
     line-height: normal;
 }
 
+.btn-fab-list-md > .btn-fab {
+    padding: 0;
+    height: 1.5rem;
+    width: 1.5rem;
+    font-size: 0.9rem;
+    line-height: normal;
+}
+
 .btn-fab-list > .btn-fab, .btn-fab-list > .btn-fab-sm {
     margin-right: 0.25rem;
 }