UX: Convert mention style to inline (#26317)

Works around a webkit bug (?) and makes more sense for elements that are mostly text and displayed _inline_ with text content.

Tested on Chromium and in macOS Safari, with 3 different text sizes in the Interface settings
This commit is contained in:
Jarek Radosz 2024-03-25 09:55:29 +01:00 committed by GitHub
parent 8a6e43a3d4
commit 9c7b1b16dd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 4 additions and 2 deletions

View File

@ -33,6 +33,7 @@ a.hashtag {
.hashtag-icon-placeholder {
font-size: var(--font-down-2);
margin: 0 0.33em 0 0.1em;
vertical-align: inherit;
}
img.emoji {

View File

@ -253,12 +253,13 @@ $hpad: 0.65em;
}
@mixin mention() {
display: inline-block; // https://bugzilla.mozilla.org/show_bug.cgi?id=1656119
display: inline;
font-size: 0.93em;
font-weight: normal;
color: var(--primary);
padding: 0 0.4em 0.07em;
padding: 0.16em 0.4em 0.2em;
background: var(--primary-low);
border-radius: 0.6em;
text-decoration: none;
text-wrap: nowrap;
}