make a new rofi theme

home-manager/modules/colors.nix

@@ -309,42 +309,7 @@ in {
         # programs.rofi.theme = "${genTheme inputs.base16-rofi}";
         programs.rofi.theme = "${pkgs.writeText "theme.rasi" ''
           ${builtins.readFile (mustache scheme "${inputs.base16-rofi}/templates/colors.mustache")}
-          * {
+          ${builtins.readFile ./rofi.css}
-              background-color:      @background;
-              border-color:          @border-color;
-              text-color:            @foreground;
-          }
-
-          #window {
-              anchor:     north;
-              location:   north;
-              width:      100%;
-              padding:    4px;
-              children:   [ horibox ];
-          }
-
-          #horibox {
-              orientation: horizontal;
-              children:   [ prompt, entry, listview ];
-          }
-
-          #listview {
-              layout:     horizontal;
-              spacing:    5px;
-              lines:      100;
-          }
-
-          #entry {
-              expand:     false;
-              width:      10em;
-          }
-
-          #element {
-              padding: 0px 2px;
-          }
-          #element selected {
-              background-color: @selected-normal-background;
-          }
         ''}";
 
         # Kitty

home-manager/modules/rofi.css

@@ -0,0 +1,60 @@
+* {
+	background-color: transparent;
+	text-color: @foreground;
+	margin: 0;
+	padding: 0;
+	spacing: 0;
+}
+
+window {
+	location: center;
+	width: 700px;
+	background-color: @background;
+	border: 2px solid;
+	border-color: @border-color;
+}
+
+inputbar {
+	padding: 8px;
+	spacing: 4px;
+	background-color: @alternate-normal-background;
+	color: @alternate-normal-foreground;
+}
+
+textbox {
+	padding: 4px 8px;
+	background-color: @alternate-normal-background;
+}
+
+listview {
+	columns: 1;
+	spacing: 8px;
+	fixed-columns: true;
+}
+
+element {
+	spacing: 1em;
+	padding: 4px;
+}
+
+element normal urgent {
+	text-color: @urgent-foreground;
+}
+
+element normal active {
+	text-color: @active-foreground;
+}
+
+element selected {
+	background-color: @selected-normal-background;
+	color: @selected-normal-foreground;
+}
+
+element selected urgent {
+	background-color: @selected-urgent-background;
+	color: @selected-urgent-foreground;
+}
+
+element-text {
+	text-color: inherit;
+}