Theme the shit out of wofi

hyprland/.config/hypr/config.d/00-basic.conf

@@ -37,7 +37,8 @@ animations {
 	bezier = snappy, 0.05, 0.9, 0.1, 1.05
 	animation = windows, 1, 2, snappy
 	animation = windowsIn, 1, 1, default
-	animation = windowsOut, 1, 3, default, popin 80%
+	animation = windowsOut, 1, 2, default, popin 80%
+	animation = layers, 1, 1, default
 	animation = border, 1, 3, default
 	animation = borderangle, 1, 8, default
 	animation = fade, 1, 3, default

hyprland/.config/hypr/config.d/50-window-rules.conf

@@ -5,3 +5,5 @@
 # windowrulev2 = float,class:^(kitty)$,title:^(kitty)$
 # See https://wiki.hyprland.org/Configuring/Window-Rules/ for more
 windowrulev2 = suppressevent maximize, class:.* # You'll probably like this.
+
+#windowrulev2 = animation windowOut,class:^(wofi)$

hyprland/.config/wofi/config

@@ -1,2 +1,4 @@
 # vim: set ft=config:
+# wofi(5)
 insensitive=true
+allow_images=true

hyprland/.config/wofi/style.css

@@ -7,46 +7,51 @@
 /*     --white: white; */
 /* } */
 
+/* The whole window */
 window {
-    background-color: #7C818C;
-}
-
-#input {
-    margin: 5px;
-    border-radius: 0px;
-    border: none;
-    border-bottom: 3px solid black;
-    background-color: #383C4A;
-    color: white;
-}
-
-#inner-box {
-    background-color: #383C4A;
-
+	background-color: transparent;
+	border-radius: 8px;
+	color: #ebdbb2;
 }
 
+/* The outermost box that contains everything */
 #outer-box {
-    margin: 5px;
-    padding:20px;
-    background-color: #383C4A;
+	border-radius: 8px;
+	padding: 1em;
+	background-color: rgba(40,40,40,0.8);
 }
 
+/* The box that contains all the search results */
+#inner-box {
+	background: transparent
+	margin: 5px;
+}
+
+/* The search bar */
+#input {
+	margin: 5px;
+	border-radius: 8px;
+	border: none;
+	background-color: #32302f;
+	color: #ebdbb2;
+}
+
+/* The scrollbar */
 #scroll {
 }
 
+/* The text for every search result entry */
 #text {
-padding: 5px;
-color: white;
+	padding: 5px;
+	color: #ebdbb2;
 }
 
-#entry:nth-child(even){
-    background-color: #404552;
+/* The container for every entry */
+#entry {
+	background-color: transparent;
+	border: 4px solid transparent;
+	border-radius: 8px;
 }
-
 #entry:selected {
-    background-color: #5291e2;
+	border: 4px solid #83a598;
 }
-
-#text:selected {
-}
-