From bf0b6ce554ce02f335fb5410a29483529442c966 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Sat, 22 Feb 2025 02:05:19 +0200
Subject: [PATCH] style(next): promoted attributes widget: improve appearance

---
 src/public/stylesheets/theme-next/shell.css | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/public/stylesheets/theme-next/shell.css b/src/public/stylesheets/theme-next/shell.css
index 30a6ad318..898593a66 100644
--- a/src/public/stylesheets/theme-next/shell.css
+++ b/src/public/stylesheets/theme-next/shell.css
@@ -1848,17 +1848,24 @@ div.promoted-attributes-container {
 }
 
 div.promoted-attribute-cell {
+    --pa-card-padding-left: 16px;
+    --pa-card-padding-right: 4px;
     --input-background-color: transparent;
 
     box-shadow: 1px 1px 2px rgba(0, 0, 0, .2);
     display: inline-flex;
     margin: 0;
     border-radius: 8px;
-    padding: 4px 16px;
+    padding: 4px var(--pa-card-padding-right) 4px var(--pa-card-padding-left);
     background: var(--card-background-color);
     overflow-y: visible;
 }
 
+div.promoted-attribute-cell:has(input[type="checkbox"]):not(:has(.multiplicity > span)) {
+    /* Checbox attribute, without multiplicity */
+    padding-right: var(--pa-card-padding-left);
+}
+
 div.promoted-attribute-cell > * {
     display: inline-block;
 }
@@ -1871,7 +1878,7 @@ div.promoted-attribute-cell label {
 
 div.promoted-attribute-cell div.input-group {
     min-height: auto;
-    padding: 2px 6px;
+    padding: 1px 6px;
 }
 
 div.promoted-attribute-cell input {
@@ -1883,12 +1890,17 @@ div.promoted-attribute-cell .tn-checkbox {
     --box-label-gap: 0;
 
     height: 1cap;
-    margin: 0 1em;
 }
 
-div.promoted-attribute-cell .multiplicity {
+div.promoted-attribute-cell div:has(input[type="checkbox"]) {
+    order: -1;    
+    margin-right: 1.5em;
+}
+
+div.promoted-attribute-cell .multiplicity:has(span) {
     --icon-button-size: 28px;
 
     margin-left: 8px;
+    margin-right: calc(var(--pa-card-padding-left) - var(--pa-card-padding-right));
     font-size: 0; /* Prevent whitespaces creating a gap between buttons */
 }
\ No newline at end of file