github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-20 12:27:32 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: improve search result consistency (#27289)

Browse Source
This commit is contained in:
Kris 2024-06-04 01:34:21 -04:00 committed by GitHub
parent eebf332025
commit 30f55cd64b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 23 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
app/assets/stylesheets/common/base/search-menu.scss
View File

@ -124,6 +124,9 @@ $search-pad-horizontal: 0.5em;
} }
.search-result-category { .search-result-category {
.badge-category__wrapper {
font-size: var(--font-0);
}
.widget-link { .widget-link {
margin-bottom: 0; margin-bottom: 0;
} }
@ -167,25 +170,31 @@ $search-pad-horizontal: 0.5em;
.search-result-group .group-result { .search-result-group .group-result {
display: flex; display: flex;
gap: 0.5em; gap: 0.5em;
&.--with-flair {
align-items: center; align-items: center;
&:not(.--with-flair) {
svg {
padding: 0.43em; // matching avatar-flair width
background: var(--primary-200);
border-radius: 50%;
}
} }
.avatar-flair__wrapper, .d-icon {
.d-icon-users { font-size: var(--font-down-1);
margin-top: 0.1em; // vertical alignment
} }
.avatar-flair { .avatar-flair {
width: 1.58em; width: 1.62em;
height: 1.6em; height: 1.6em;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: var(--primary-200);
color: var(--primary-medium);
.d-icon { .d-icon {
font-size: var(--font-down-1); font-size: var(--font-down-2);
color: currentColor; color: currentColor;
} }
} }
@ -242,12 +251,14 @@ $search-pad-horizontal: 0.5em;
margin-right: 0.33em; margin-right: 0.33em;
} }
.badge-category__wrapper + .search-item-tag {
display: flex;
align-items: baseline;
margin-left: 0.33em;
}
.search-item-tag { .search-item-tag {
color: var(--primary-high); color: var(--primary-high);
.d-icon {
margin-right: 0 !important;
}
} }
.extra-hint { .extra-hint {
@ -296,9 +307,8 @@ $search-pad-horizontal: 0.5em;
vertical-align: middle; vertical-align: middle;
} }
.d-icon-tag { .d-icon-tag {
font-size: var(--font-down-2); font-size: 0.7em;
} }
.d-icon-search { .d-icon-search {
font-size: var(--font-down-1); font-size: var(--font-down-1);
} }