Enhancement: more v3 ui tweaks (#13774)

src-ui/src/app/components/app-frame/toasts-dropdown/toasts-dropdown.component.scss

@@ -11,11 +11,47 @@
   display: none;
 }
 
+.notification-count {
+  top: -.2rem;
+  right: -.2rem;
+  min-width: 1.15rem;
+  height: 1.15rem;
+  padding: .18rem .32rem;
+  font-size: .68rem;
+  line-height: 1;
+}
+
+.nav-item > .btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2.5rem;
+  min-height: 2.5rem;
+  padding: .45rem .55rem;
+  border-radius: .6rem;
+
+  &:hover,
+  &:focus-visible {
+    background-color: rgba(0, 0, 0, .14);
+  }
+}
+
 .dropdown-item {
   white-space: initial;
 }
 
 @media screen and (max-width: 400px) {
+  .nav-item {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .nav-item > .btn {
+    min-width: 2.25rem;
+    padding-right: .4rem;
+    padding-left: .4rem;
+  }
+
   :host ::ng-deep .dropdown-menu-end {
     right: -3rem;
   }