clean up css and spacing generally for select apps list on apps screen

small-hack · Apr 26, 2024 · 405ae91 · 405ae91
1 parent 9437ddc
commit 405ae91
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 20 deletions.
diff --git a/smol_k8s_lab/tui/apps_screen.py b/smol_k8s_lab/tui/apps_screen.py
@@ -116,7 +116,7 @@ def on_mount(self) -> None:
         self.sub_title = sub_title
 
         # select-apps styling - select apps container - top left
-        select_apps_widget = self.get_widget_by_id("select-add-apps")
+        select_apps_widget = self.get_widget_by_id("selection-list-of-apps")
         select_apps_widget.border_title = "[#ffaff9]♥[/] [i]select[/] [#C1FF87]apps"
         select_apps_widget.border_subtitle = "[@click=screen.launch_new_app_modal]✨ [i]new[/] [#C1FF87]app[/][/]"
 

diff --git a/smol_k8s_lab/tui/css/apps_config.tcss b/smol_k8s_lab/tui/css/apps_config.tcss
@@ -41,6 +41,16 @@ $navy: rgb(35,35,54);
     scrollbar-color-active: $sky_blue;
     scrollbar-color-hover: $light_cornflower;
     scrollbar-color: $cornflower;
+    padding-top: 1;
+    padding-bottom: 1;
+    padding-left: 0;
+    padding-right: 0;
+    border: round $cornflower;
+    border-title-color: $sky_blue;
+    border-subtitle-color: $sky_blue;
+    link-background-hover: $navy;
+    link-color-hover: $orange;
+    background: $navy 60%;
 }
 
 #selection-list-of-apps:focus {
@@ -49,33 +59,14 @@ $navy: rgb(35,35,54);
 
 /* matches only the left hand side of top half of screen */
 #select-add-apps {
-    border: round $cornflower;
-    border-title-color: $sky_blue;
-    border-subtitle-color: $sky_blue;
-    link-background-hover: $navy;
-    link-color-hover: $orange;
-    background: $navy 60%;
-    align: center top;
     height: auto;
-    scrollbar-background: $dark_gray;
-    scrollbar-background-active: $dark_gray;
-    scrollbar-background-hover: $dark_gray;
-    scrollbar-color-active: $sky_blue;
-    scrollbar-color-hover: $light_cornflower;
-    scrollbar-color: $cornflower;
 }
 
 /* matches the app selection list, the left button container */
 #left-apps-container {
     grid-rows: 1fr 0.2fr;
     align: center top;
     grid-gutter: 1;
-    scrollbar-background: $dark_gray;
-    scrollbar-background-active: $dark_gray;
-    scrollbar-background-hover: $dark_gray;
-    scrollbar-color-active: $sky_blue;
-    scrollbar-color-hover: $light_cornflower;
-    scrollbar-color: $cornflower;
 }
 
 /* new app and modify globals buttons boxes below the app selection list */