gnh1201/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2025-10-05 16:42:47 +00:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

Visibility dialog: Add visual dropdown indicator to Dropdown component (#36052)

Browse Source
This commit is contained in:
diondiondion 2025-09-08 14:53:23 +02:00 committed by GitHub
parent 0153b49ef7
commit c0af4581aa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 18 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/javascript/mastodon/components/dropdown/index.tsx
View File

@ -8,8 +8,11 @@ import classNames from 'classnames';
import Overlay from 'react-overlays/Overlay';
import UnfoldMoreIcon from '@/material-icons/400-24px/unfold_more.svg?react';
import type { SelectItem } from '../dropdown_selector';
import { DropdownSelector } from '../dropdown_selector';
import { Icon } from '../icon';
import { matchWidth } from './utils';
@ -77,11 +80,16 @@ export const Dropdown: FC<
defaultMessage='Select an option'
/>
)}
<Icon
id='unfold-icon'
icon={UnfoldMoreIcon}
className={`${classPrefix}__icon`}
/>
</button>
<Overlay
show={open}
offset={[0, 4]}
offset={[0, 0]}
placement='bottom-start'
onHide={handleClose}
flip

9
app/javascript/styles/mastodon/components.scss
View File

@ -5711,6 +5711,8 @@ a.status-card {
}
&__button {
display: flex;
align-items: center;
color: $primary-text-color;
background: var(--dropdown-background-color);
border: 1px solid var(--dropdown-border-color);
@ -5726,6 +5728,13 @@ a.status-card {
}
}
&__icon {
margin-inline: auto -4px;
width: 18px;
height: 18px;
opacity: 0.5;
}
&__helper {
margin-top: 4px;
font-size: 0.8em;