Improve action buttons behaviour in the menu

changelog.d/action-button-extra-counter.add

@@ -0,0 +1 @@
+Display counter for status action buttons when they are on the menu

changelog.d/bookmark-button-align.fix

@@ -0,0 +1 @@
+Fix bookmark button alignment in the extra actions menu

src/components/popover/popover.scss

@@ -60,11 +60,14 @@
     }
 
     .extra-button {
-      border-left: 1px solid var(--icon);
+      border-left: 1px solid;
+      border-image-source: linear-gradient(to bottom, transparent 0%, var(--icon) var(--__horizontal-gap) calc(100% - var(--__horizontal-gap)), transparent 100%);
+      border-image-slice: 1;
       padding-left: calc(var(--__horizontal-gap) - 1px);
-      border-right: var(--__horizontal-gap) solid transparent;
+      padding-right: var(--__horizontal-gap);
-      border-top: var(--__horizontal-gap) solid transparent;
+      padding-top: var(--__horizontal-gap);
-      border-bottom: var(--__horizontal-gap) solid transparent;
+      padding-bottom: var(--__horizontal-gap);
+      max-width: fit-content;
     }
 
     .main-button {

src/components/status_action_buttons/action_button.scss

@@ -102,4 +102,20 @@
       }
     }
   }
+
+  &.-extra {
+    .action-counter {
+      justify-self: end;
+      margin-right: 1em;
+    }
+
+    .chevron-icon {
+      justify-self: end;
+    }
+
+    .extra-button {
+      justify-self: end;
+      justify-content: end;
+    }
+  }
 }

src/components/status_action_buttons/action_button.vue

@@ -60,7 +60,7 @@
       />
     </component>
     <span
-      v-if="!extra && button.counter?.(funcArg) > 0"
+      v-if="button.counter?.(funcArg) > 0"
       class="action-counter"
     >
       {{ button.counter?.(funcArg) }}