From 74523adee087a7d48aa31dd0128ff067680a594c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nil=C3=A9ane?= <nileanedorffer@gmail.com>
Date: Thu, 29 Feb 2024 15:13:05 +0100
Subject: [PATCH] Added secondary background color to search options in search
 dropdown

---
 TangerineUI-cherry.css | 25 +++++++++++++++++++++++++
 TangerineUI-purple.css | 25 +++++++++++++++++++++++++
 TangerineUI.css        | 25 +++++++++++++++++++++++++
 3 files changed, 75 insertions(+)

diff --git a/TangerineUI-cherry.css b/TangerineUI-cherry.css
index 7a52ae9..a40bc2d 100644
--- a/TangerineUI-cherry.css
+++ b/TangerineUI-cherry.css
@@ -4464,6 +4464,31 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
     color: var(--color-accent-fg);
 }
 
+.app-body .search__popout__menu:nth-child(2):not(:has(.search__popout__menu__message)) {
+    margin-bottom: 10px;
+}
+.app-body .search__popout h4:has(+ .search__popout__menu:last-child) {
+    background-color: var(--color-content-secondary-bg);
+    padding-top: 15px;
+    padding-left: 15px;
+    padding-right: 15px;
+    margin: 0;
+    border-radius: 6px 6px 0 0;
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child {
+    margin: 0 0 -10px;
+    background-color: var(--color-content-secondary-bg);
+    border-radius: 0 0 6px 6px;
+    padding: 5px;
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) {
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) mark {
+    color: var(--color-content-fg);
+} 
+
 @media screen and (max-width:1174px) {
     .app-body:not(.layout-multiple-columns) .search {
         margin-bottom: 0;
diff --git a/TangerineUI-purple.css b/TangerineUI-purple.css
index a56a7c0..85c44c0 100644
--- a/TangerineUI-purple.css
+++ b/TangerineUI-purple.css
@@ -4464,6 +4464,31 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
     color: var(--color-accent-fg);
 }
 
+.app-body .search__popout__menu:nth-child(2):not(:has(.search__popout__menu__message)) {
+    margin-bottom: 10px;
+}
+.app-body .search__popout h4:has(+ .search__popout__menu:last-child) {
+    background-color: var(--color-content-secondary-bg);
+    padding-top: 15px;
+    padding-left: 15px;
+    padding-right: 15px;
+    margin: 0;
+    border-radius: 6px 6px 0 0;
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child {
+    margin: 0 0 -10px;
+    background-color: var(--color-content-secondary-bg);
+    border-radius: 0 0 6px 6px;
+    padding: 5px;
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) {
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) mark {
+    color: var(--color-content-fg);
+} 
+
 @media screen and (max-width:1174px) {
     .app-body:not(.layout-multiple-columns) .search {
         margin-bottom: 0;
diff --git a/TangerineUI.css b/TangerineUI.css
index cbe78ce..7b2f832 100644
--- a/TangerineUI.css
+++ b/TangerineUI.css
@@ -4464,6 +4464,31 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
     color: var(--color-accent-fg);
 }
 
+.app-body .search__popout__menu:nth-child(2):not(:has(.search__popout__menu__message)) {
+    margin-bottom: 10px;
+}
+.app-body .search__popout h4:has(+ .search__popout__menu:last-child) {
+    background-color: var(--color-content-secondary-bg);
+    padding-top: 15px;
+    padding-left: 15px;
+    padding-right: 15px;
+    margin: 0;
+    border-radius: 6px 6px 0 0;
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child {
+    margin: 0 0 -10px;
+    background-color: var(--color-content-secondary-bg);
+    border-radius: 0 0 6px 6px;
+    padding: 5px;
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) {
+    color: var(--color-fg-muted);
+}
+.app-body .search__popout__menu:last-child .search__popout__menu__item:not(.selected, :active, :hover, :focus) mark {
+    color: var(--color-content-fg);
+} 
+
 @media screen and (max-width:1174px) {
     .app-body:not(.layout-multiple-columns) .search {
         margin-bottom: 0;