mirror of
https://gh.wpcy.net/https://github.com/discourse/discourse.git
synced 2026-05-26 17:48:30 +08:00
Fixes an issue where the admin search modal had bottom padding that was very cut off, and other padding was quite big
126 lines
2.3 KiB
SCSS
Vendored
126 lines
2.3 KiB
SCSS
Vendored
.d-modal.admin-search-modal .d-modal__body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--space-2);
|
|
padding: 0 var(--space-2) var(--space-2) var(--space-2);
|
|
}
|
|
|
|
// Search field
|
|
.admin-search {
|
|
&__input-container {
|
|
display: flex;
|
|
}
|
|
|
|
&__input-group {
|
|
display: flex;
|
|
align-items: center;
|
|
border: 1px solid var(--primary-400);
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
height: 42px;
|
|
padding: 0 var(--space-2);
|
|
border-radius: var(--d-input-border-radius);
|
|
|
|
&:focus,
|
|
&:focus-within {
|
|
border-color: var(--tertiary);
|
|
outline: 2px solid var(--tertiary);
|
|
outline-offset: -2px;
|
|
}
|
|
}
|
|
|
|
&__input-icon {
|
|
background: none !important;
|
|
color: var(--primary-medium);
|
|
}
|
|
|
|
&__input-field {
|
|
margin: 0 !important;
|
|
border: 0 !important;
|
|
appearance: none !important;
|
|
outline: none !important;
|
|
background: none !important;
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
// Results
|
|
.admin-search__result {
|
|
border-top: 1px solid var(--content-border-color);
|
|
display: block;
|
|
|
|
&:first-child {
|
|
border-top: none;
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
&:hover {
|
|
background-color: var(--d-hover);
|
|
}
|
|
|
|
&-name {
|
|
color: var(--primary);
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
align-items: baseline;
|
|
gap: var(--space-3);
|
|
|
|
.d-icon {
|
|
color: var(--primary-high);
|
|
font-size: var(--font-down-1);
|
|
}
|
|
}
|
|
|
|
&-name-label {
|
|
flex: 1;
|
|
}
|
|
|
|
&-description {
|
|
font-size: var(--font-down-1);
|
|
color: var(--primary-high);
|
|
margin-top: var(--space-1);
|
|
}
|
|
|
|
&-link {
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
width: 100%;
|
|
padding: var(--space-3) var(--space-4);
|
|
|
|
&:focus-visible {
|
|
outline: none;
|
|
}
|
|
}
|
|
|
|
&:focus-within {
|
|
background: var(--d-hover);
|
|
}
|
|
}
|
|
|
|
.admin-search-modal {
|
|
--modal-max-width: 700px;
|
|
|
|
.admin-search__no-results,
|
|
.admin-search__input-container {
|
|
padding-inline: var(--space-2);
|
|
}
|
|
|
|
.admin-search__no-results {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.admin-search__input-container {
|
|
position: sticky;
|
|
top: 0;
|
|
background: var(--secondary);
|
|
z-index: z("modal", "content"); // above title icons
|
|
|
|
&.--has-results {
|
|
padding-bottom: var(--space-2);
|
|
}
|
|
}
|
|
}
|