remove col padding in mobile & fix start gap in tab line

Author: anish-work

daras_ai_v2/base.py

@@ -385,6 +385,10 @@ def render(self):
                     display: block !important;
                 }
 
+                & button:has(#run-tab) {
+                    margin-left: 0 !important;
+                }
+
                 & ul.nav-tabs {
                     overflow-x: auto;
                     overflow-y: hidden;
@@ -1211,7 +1215,10 @@ def render_selected_tab(self):
                     return
 
                 with gui.styled(OUTPUT_TABS_CSS):
-                    input_col, output_col = gui.columns([3, 2], gap="medium")
+                    input_col, output_col = gui.columns(
+                        [3, 2],
+                        gap="medium",
+                    )
                     with input_col:
                         submitted = self._render_input_col()
                     with output_col:
@@ -2550,10 +2557,21 @@ class TitleValidationError(Exception):
         margin: -1rem 0 1rem 0;
         padding-top: 1rem;
     }
+    
+    /* reset col padding in mobile */
+    & > div {
+        padding: 0; 
+    }
+
     @media (min-width: 768px) {
         & {
             background-color: #f9f9f9;
         }
+        /* set col padding in mobile */
+        & > div {
+            padding-left: calc(var(--bs-gutter-x) * .5);
+            padding-right: calc(var(--bs-gutter-x) * .5);
+        }
     }
 
 """

routers/root.py

@@ -839,7 +839,7 @@ class RecipeTabs(TabData, Enum):
         route=preview_route,
     )
     run = TabData(
-        title=f"{icons.run} Run",
+        title=f"<span id='run-tab'>{icons.run} Run</span>",
         label="",
         route=recipe_or_handle_or_static,
     )