diff --git a/issues/templates/issues/issue_list.html b/issues/templates/issues/issue_list.html
index 7b615a2..c87f5a1 100644
--- a/issues/templates/issues/issue_list.html
+++ b/issues/templates/issues/issue_list.html
@@ -69,20 +69,25 @@ https://flowbite.com/docs/forms/floating-label/
 
                 {% endspaceless %}
 
-                <button name="action" value="mute_bar" class="font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 ml-1 border-2 hover:bg-slate-200 active:ring rounded-s-md">Mute</button><button class="font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-r-2 border-b-2 border-t-2 hover:bg-slate-200 active:ring rounded-e-md">...</button>
+                {% spaceless %}{# needed to avoid whitespace between the looks-like-one-buttons #}
+                <button name="action" value="mute_bar" class="font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 ml-1 border-2 hover:bg-slate-200 active:ring rounded-s-md">Mute</button>
+
+                <div class="dropdown">
+                    <button class="font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-r-2 border-b-2 border-t-2 hover:bg-slate-200 active:ring rounded-e-md">Mute for/until&nbsp;&nbsp;&nbsp;🞃</button>
+
+                    <div class="dropdown-content flex-col">
+                        <button name="action" value="mute_bar" class="block self-stretch font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-l-2 border-r-2 border-b-2 bg-white hover:bg-slate-200 active:ring text-left whitespace-nowrap">1 day</button>
+                        <button name="action" value="mute_bar" class="block self-stretch font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-l-2 border-r-2 border-b-2 bg-white hover:bg-slate-200 active:ring text-left whitespace-nowrap">1 week</button>
+                        <button name="action" value="mute_bar" class="block self-stretch font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-l-2 border-r-2 border-b-2 bg-white hover:bg-slate-200 active:ring text-left whitespace-nowrap">1 month</button>
+                        <button name="action" value="mute_bar" class="block self-stretch font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-l-2 border-r-2 border-b-2 bg-white hover:bg-slate-200 active:ring text-left whitespace-nowrap">5 events per day</button>
+                        <button name="action" value="mute_bar" class="block self-stretch font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 border-l-2 border-r-2 border-b-2 bg-white hover:bg-slate-200 active:ring text-left whitespace-nowrap">100 events per day</button>
+                    </div>
+                </div> 
+                {% endspaceless %}
 
                 {# TODO "reopen" ... we don't do that currently, see notes in issue_detail #}
                 {# only for resolved/muted items <button class="font-bold text-slate-500 border-slate-300 pl-4 pr-4 pb-2 pt-2 ml-1 border-2 hover:bg-slate-200 active:ring rounded-md">Reopen</button> #}
 
-                <div class="dropdown">
-                   <button class="dropbtn">Dropdown</button>
-                       <div class="dropdown-content">
-                           <a href="#">Link 1</a>
-                           <a href="#">Link 2</a>
-                           <a href="#">Link 3</a>
-                       </div>
-                 </div> 
-
             </td>
 
             <td class="text-right font-bold p-4">
diff --git a/theme/static/css/dist/styles.css b/theme/static/css/dist/styles.css
index 595ace9..10f2d88 100644
--- a/theme/static/css/dist/styles.css
+++ b/theme/static/css/dist/styles.css
@@ -958,6 +958,10 @@ select {
           appearance: none;
 }
 
+.flex-col {
+  flex-direction: column;
+}
+
 .place-content-end {
   place-content: end;
 }
@@ -978,10 +982,18 @@ select {
   justify-content: center;
 }
 
+.self-stretch {
+  align-self: stretch;
+}
+
 .overflow-hidden {
   overflow: hidden;
 }
 
+.whitespace-nowrap {
+  white-space: nowrap;
+}
+
 .whitespace-pre {
   white-space: pre;
 }
@@ -1158,6 +1170,10 @@ select {
   padding-top: 1rem;
 }
 
+.text-left {
+  text-align: left;
+}
+
 .text-center {
   text-align: center;
 }
@@ -1412,16 +1428,6 @@ select {
   /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
 }
 
-/* Dropdown Button */
-
-.dropbtn {
-  background-color: #04AA6D;
-  color: white;
-  padding: 16px;
-  font-size: 16px;
-  border: none;
-}
-
 /* The container <div> - needed to position the dropdown content */
 
 .dropdown {
@@ -1434,37 +1440,14 @@ select {
 .dropdown-content {
   display: none;
   position: absolute;
-  background-color: #f1f1f1;
-  min-width: 160px;
-  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  left: -2px;
   z-index: 1;
 }
 
-/* Links inside the dropdown */
-
-.dropdown-content a {
-  color: black;
-  padding: 12px 16px;
-  text-decoration: none;
-  display: block;
-}
-
-/* Change color of dropdown links on hover */
-
-.dropdown-content a:hover {
-  background-color: #ddd;
-}
-
 /* Show the dropdown menu on hover */
 
 .dropdown:hover .dropdown-content {
-  display: block;
-}
-
-/* Change the background color of the dropdown button when the dropdown content is shown */
-
-.dropdown:hover .dropbtn {
-  background-color: #3e8e41;
+  display: flex;
 }
 
 .hover\:border-b-4:hover {
@@ -1632,4 +1615,4 @@ select {
   .xl\:w-1\/2 {
     width: 50%;
   }
-} 
+}
diff --git a/theme/static_src/src/styles.css b/theme/static_src/src/styles.css
index 1e56820..2080187 100644
--- a/theme/static_src/src/styles.css
+++ b/theme/static_src/src/styles.css
@@ -74,15 +74,6 @@
   src: url('../../fonts/ibm-plex-mono-v19-cyrillic_cyrillic-ext_latin_latin-ext_vietnamese-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
 }
 
- /* Dropdown Button */
-.dropbtn {
-  background-color: #04AA6D;
-  color: white;
-  padding: 16px;
-  font-size: 16px;
-  border: none;
-}
-
 /* The container <div> - needed to position the dropdown content */
 .dropdown {
   position: relative;
@@ -93,25 +84,11 @@
 .dropdown-content {
   display: none;
   position: absolute;
-  background-color: #f1f1f1;
-  min-width: 160px;
-  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  left: -2px;
   z-index: 1;
 }
 
-/* Links inside the dropdown */
-.dropdown-content a {
-  color: black;
-  padding: 12px 16px;
-  text-decoration: none;
-  display: block;
-}
-
-/* Change color of dropdown links on hover */
-.dropdown-content a:hover {background-color: #ddd;}
-
 /* Show the dropdown menu on hover */
-.dropdown:hover .dropdown-content {display: block;}
-
-/* Change the background color of the dropdown button when the dropdown content is shown */
-.dropdown:hover .dropbtn {background-color: #3e8e41;} 
+.dropdown:hover .dropdown-content {
+    display: flex;
+}