Reduce the space between buttons

src/display/css_html_js.py

@@ -112,6 +112,113 @@ custom_css = """
     font-size: 20px;
 }
 
+
+
+
+
+
+/* === FIX PER SPAZIATURA TAB - MINIMO SPAZIO === */
+
+/* Elimina completamente lo spazio tra i bottoni dei tab */
+.tab-nav {
+    gap: 0 !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    display: flex !important;
+    flex-wrap: nowrap !important;
+}
+
+/* Compatta al massimo i bottoni dei tab */
+.tab-nav button {
+    margin: 0 !important;
+    padding: 4px 6px !important;
+    min-width: auto !important;
+    border: none !important; /* Rimuove il bordo tra i bottoni */
+}
+
+/* Rimuove la separazione fra il primo e l'ultimo bottone */
+.tab-nav button:first-child {
+    border-left: none !important;  /* Rimuove il bordo sinistro del primo bottone */
+}
+
+.tab-nav button:last-child {
+    border-right: none !important;  /* Rimuove il bordo destro dell'ultimo bottone */
+}
+
+/* Per la classe specifica che usi */
+.tab-buttons .tab-nav {
+    gap: 0 !important;
+    margin: 0 !important;
+}
+
+.tab-buttons .tab-nav button {
+    margin: 0 !important;
+    padding: 3px 5px !important;
+    border-radius: 0 !important;
+    font-size: 16px !important;
+}
+
+/* Riduce spazio tra tab e contenuto */
+.tabitem {
+    padding-top: 10px !important;
+    margin-top: 0 !important;
+}
+
+/* Compatta i container dei tab */
+.tabs {
+    margin: 0 !important;
+    padding: 0 !important;
+}
+
+/* Riduce altezza della barra dei tab */
+.tab-nav {
+    min-height: auto !important;
+    height: auto !important;
+}
+
+/* Per i separatori speciali (║ e │), rimuove visibilità senza separazione tra i tab */
+.tab-nav button[data-tab="║"],
+.tab-nav button[data-tab="│"] {
+    width: 0px !important;  /* Rimuove la larghezza */
+    padding: 0 !important;
+    margin: 0 !important;
+    opacity: 0 !important;  /* Rende invisibile */
+    pointer-events: none !important;
+    background: transparent !important;
+    border: none !important;
+    min-width: 0px !important;
+}
+
+/* Rimuovi spazi extra attorno ai container delle tab */
+.gradio-tabs {
+    margin: 0 !important;
+    padding: 0 !important;
+}
+
+/* Compatta ulteriormente se necessario */
+.tab-buttons {
+    margin: 0 !important;
+    padding: 0 !important;
+}
+
+/* Allinea meglio i tab con icone e testo */
+.tab-nav button span {
+    white-space: nowrap !important;
+    display: inline-flex !important;
+    align-items: center !important;
+    gap: 4px !important;
+}
+
+
+/* ========================================================== */
+
+
+
+
+
+
+
+
 #scale-logo {
     border-style: none !important;
     box-shadow: none;