Refactor issue filter (labels, poster, assignee) (#32771)

Rewrite a lot of legacy strange code, remove duplicate code, remove
jquery, and make these filters reusable.

Let's forget the old code, new code affects: 

* issue list open/close switch
* issue list filter (label, author, assignee)
* milestone list open/close switch
* milestone issue list filter (label, author, assignee)
* project view (label, assignee)

3 files changed, 23 insertions, 24 deletions

diff --git a/web_src/css/base.css b/web_src/css/base.css
index 8f5ef51c4a..04f3678f3a 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -1390,8 +1390,9 @@ table th[data-sortt-desc] .svg {
   min-width: 0;
 }
 
-/* to override Fomantic's default display: block for ".menu .item", and use a slightly larger gap for menu item content */
-.ui.dropdown .menu.flex-items-menu > .item {
+/* to override Fomantic's default display: block for ".menu .item", and use a slightly larger gap for menu item content
+the "!important" is necessary to override Fomantic UI menu item styles, meanwhile we should keep the "hidden" items still hidden */
+.ui.dropdown .menu.flex-items-menu > .item:not(.hidden, .filtered, .tw-hidden) {
   display: flex !important;
   align-items: center;
   gap: .5rem;
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 14bdc43474..9e1def87a7 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -74,24 +74,6 @@
   }
 }
 
-.repository .filter.menu.labels .label-filter .menu .info {
-  display: inline-block;
-  padding: 0.5rem 0;
-  font-size: 12px;
-  width: 100%;
-  white-space: nowrap;
-  margin-left: 10px;
-  margin-right: 8px;
-  text-align: left;
-}
-
-.repository .filter.menu.labels .label-filter .menu .info code {
-  border: 1px solid var(--color-secondary);
-  border-radius: var(--border-radius);
-  padding: 1px 2px;
-  font-size: 11px;
-}
-
 /* make all issue filter dropdown menus popup leftward, to avoid go out the viewport (right side) */
 .repository .filter.menu .ui.dropdown .menu {
   max-height: 500px;
@@ -108,6 +90,24 @@
   left: 0;
 }
 
+.repository .filter.menu .ui.dropdown.label-filter .menu .info {
+  display: inline-block;
+  padding: 0.5rem 0;
+  font-size: 12px;
+  width: 100%;
+  white-space: nowrap;
+  margin-left: 10px;
+  margin-right: 8px;
+  text-align: left;
+}
+
+.repository .filter.menu .ui.dropdown.label-filter .menu .info code {
+  border: 1px solid var(--color-secondary);
+  border-radius: var(--border-radius);
+  padding: 1px 2px;
+  font-size: 11px;
+}
+
 /* For the secondary pointing menu, respect its own border-bottom */
 /* style reference: https://semantic-ui.com/collections/menu.html#pointing */
 .repository .ui.tabs.container .ui.menu:not(.secondary.pointing) {
diff --git a/web_src/css/repo/issue-list.css b/web_src/css/repo/issue-list.css
index 1e0f82ce27..4fafc7d6f8 100644
--- a/web_src/css/repo/issue-list.css
+++ b/web_src/css/repo/issue-list.css
@@ -68,10 +68,8 @@
   background-color: var(--color-secondary-dark-4);
 }
 
-.archived-label-filter {
-  margin-left: 10px;
+.label-filter-archived-toggle {
+  margin: 8px 10px;
   font-size: 12px;
-  display: flex !important;
-  margin-bottom: 8px;
   min-width: fit-content;
 }