0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00

🐛 Fixes dropdowns in Members filters (#22082)

A few of the dropdowns within the Members filter were displaying
incorrectly (wrong background colour, sizing, border radius, and dark
mode styling).

These changes address that. 

Fixes
https://linear.app/ghost/issue/DES-1093/the-filter-for-selecting-an-email-has-a-grey-background-rather-than,
https://linear.app/ghost/issue/DES-1094/the-label-field-is-taller-than-other-fields,
https://linear.app/ghost/issue/DES-1095/the-label-field-changes-border-radius-on-focus,
https://linear.app/ghost/issue/DES-1096/label-and-email-fields-display-incorrectly-in-dark-mode
This commit is contained in:
Daniël van der Winden 2025-01-30 16:52:49 +01:00 committed by GitHub
parent 523b9d47a0
commit 9e439ad601
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 47 additions and 6 deletions

View file

@ -1102,6 +1102,12 @@ input:focus,
border-color: var(--midlightgrey);
}
.ember-power-select-trigger:not(.gh-input-x) {
background: var(--lightgrey);
border-color: var(--lightgrey);
}
kbd {
color: #394047;
}

View file

@ -2,7 +2,7 @@
padding: 0 12px;
border: var(--input-border);
border-radius: var(--border-radius);
background: transparent;
background: var(--main-bg-color);
}
.ember-power-select-trigger.gh-btn {
@ -245,7 +245,7 @@
background: #fff;
padding: 4px;
border: var(--input-border);
border-radius: 3px;
border-radius: var(--border-radius);
outline: none;
}
@ -308,14 +308,26 @@
margin: 2px;
}
.ember-power-select-trigger {
position: relative;
display: flex;
align-items: center;
min-height: 33px;
}
.ember-power-select-status-icon {
position: absolute;
top: 13px;
right: 13px;
right: 12px;
top: 12px;
border: solid var(--midlightgrey);
border-width: 0 1px 1px 0;
padding: 3px;
transform: rotate(45deg);
pointer-events: none;
}
.ember-power-select-trigger:not(.ember-power-select-multiple-trigger) .ember-power-select-status-icon {
top: calc(50% - 4px);
}
.ember-basic-dropdown-trigger[aria-expanded="true"] .ember-power-select-status-icon {
@ -524,3 +536,27 @@
width: 1.2rem;
height: 1.2rem;
}
.ember-power-select-multiple-trigger {
display: flex;
flex-wrap: wrap;
align-items: center;
padding: 2px 28px 2px 2px !important;
min-height: 33px;
}
.ember-power-select-multiple-options {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.ember-power-select-trigger-multiple-input {
width: auto !important;
padding: 0;
margin: 2px;
border: none;
font-size: 1.4rem;
line-height: 1.35em;
background: none;
}

View file

@ -182,7 +182,7 @@ p.gh-members-list-email {
.gh-member-actions-menu {
top: calc(100% + 6px);
left: auto;
right: 10px;
right: 0;
}
.gh-member-actions-menu.fade-out {

View file

@ -307,7 +307,6 @@ textarea.gh-input-x {
.ember-power-select-multiple-trigger {
padding: 4px;
min-height: 38px;
display: grid;
grid-template-columns: 1fr 24px;
position: relative;