[FIX] web, mail: systray 'disabled' state vs 'no-notification' design

Prior to this commit the 'disabled' state (eg. studio icon in a
not-editable view) and the 'no-notification' state (eg. messaging icon
without badge) shared the same design.

While the disabled state should be used for not-clickable elements only,
available systray items should always appear clickable, even
when there are no new notifications.

This commit moves the `o_disabled` class outside the burger_menu
component, making it generic and available for other components too.

Systray items without notification are now styled normally.
The simple presence of the badge communicates the user that a new
notification has been sent.

This commit is part of v16 overall restyle (task-2704984).

task-2712151

Part-of: odoo/odoo#82434

addons/mail/static/src/components/messaging_menu/messaging_menu.scss

@@ -131,6 +131,3 @@
     }
 }
 
-.o_MessagingMenu_toggler.o-no-notification {
-    @include o-mail-systray-no-notification-style();
-}

addons/mail/static/src/scss/systray.scss

@@ -1,11 +1,7 @@
 // Systray icon and dropdown
 .o_mail_systray_item {
-    &.o_no_notification > a {
-        @include o-mail-systray-no-notification-style();
-
-        .o_notification_counter {
-            display: none;
-        }
+    &.o_no_notification .o_notification_counter {
+        display: none;
     }
     &.show .o_mail_systray_dropdown {
         display: flex;

addons/mail/static/src/scss/variables/primary_variables.scss

@@ -26,7 +26,3 @@ $o-mail-discuss-sidebar-category-item-avatar-size: 30px !default;
 $o-mail-discuss-sidebar-scrollbar-width: 15px !default;
 
 $o-mail-message-sidebar-width: 50px;
-
-@mixin o-mail-systray-no-notification-style {
-    opacity: 0.5;
-}

addons/web/static/src/legacy/scss/primary_variables.scss

@@ -46,8 +46,11 @@ $o-theme-text-colors: (
     "danger": #d23f3a,
 )!default;
 
+$o-opacity-disabled: .5 !default;
+$o-opacity-muted: .76 !default;
+
 $o-main-text-color: $o-gray-700 !default;
-$o-main-color-muted: rgba($o-main-text-color, .76) !default;
+$o-main-color-muted: rgba($o-main-text-color, $o-opacity-muted) !default;
 $o-main-headings-color: $o-gray-900 !default;
 $o-main-link-color: darken($o-brand-primary, 5%) !default;
 $o-main-favorite-color: #f3cc00 !default;

addons/web/static/src/legacy/scss/ui.scss

@@ -7,6 +7,11 @@
     display: none!important;
 }
 
+.o_disabled {
+    pointer-events: none;
+    opacity: $o-opacity-disabled;
+}
+
 .o_text_overflow {
     @include o-text-overflow;
 }

addons/web/static/src/webclient/burger_menu/burger_menu.scss

@@ -166,11 +166,6 @@
 //------------------------------------------------------------------------------
 
 .o_web_client .o_main_navbar {
-  .o_disabled {
-    pointer-events: none;
-    opacity: 0.4;
-  }
-
   .o_mobile_menu_toggle {
     @extend %-main-navbar-entry-base;
     @extend %-main-navbar-entry-spacing;