[FIX] mail: style mention without @extend

Follow-up of https://github.com/odoo/odoo/pull/132701

`@extend` was used to reuse classnames intended for styling,
such as `.btn`. However, this has the side-effect to increase
specificity on these classnames, which results in breaking style
on the website where the specificity on `.btn` must not change.

This commit fixes the issue by using a mixin rather than
`@extend`. Since using these mixins are not equivalent, we took
the opportunity to slightly improve the constrast of text color
and background.

closes odoo/odoo#138108

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
Alexandre Kühn
2023-10-10 12:35:05 +00:00
parent d38fd353f9
commit b42bcb25b2
2 changed files with 7 additions and 8 deletions
@@ -1,3 +1,7 @@
.o-discuss-badge {
--o-discuss-badge-bg: #{$primary}; // sync with --o-navbar-badge-bg
}
a.o_mail_redirect, a.o_channel_redirect {
@include button-variant(rgba($primary, .2), rgba($primary, .2), lighten($link-color, 5%), rgba($primary, .3), rgba($primary, .3), lighten($link-color, 10%));
}
+3 -8
View File
@@ -43,12 +43,7 @@
}
a.o_mail_redirect, a.o_channel_redirect {
background: rgba($primary, .2) !important;
@extend .btn;
@extend .btn-sm;
@extend .btn-link;
@extend .align-baseline;
@extend .fw-normal;
@extend .px-1;
@extend .py-0;
@include button-variant(rgba($primary, .2), rgba($primary, .2), darken($link-color, 5%), rgba($primary, .3), rgba($primary, .3), darken($link-color, 10%));
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);
padding: map-get($spacers, 1);
}