Remove hardcoded width from dropdown overlays (#23062)

* Remove hardcoded width from dropdown overlays

* Fix emoji picker position
main
Claire 2 years ago committed by GitHub
parent ebe2c10932
commit f4a6365f55
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -307,7 +307,7 @@ class LanguageDropdown extends React.PureComponent {
<Overlay show={open} placement={'bottom'} flip target={this.findTarget} popperConfig={{ strategy: 'fixed', onFirstUpdate: this.handleOverlayEnter }}> <Overlay show={open} placement={'bottom'} flip target={this.findTarget} popperConfig={{ strategy: 'fixed', onFirstUpdate: this.handleOverlayEnter }}>
{({ props, placement }) => ( {({ props, placement }) => (
<div {...props} style={{ ...props.style, width: 280 }}> <div {...props}>
<div className={`dropdown-animation language-dropdown__dropdown ${placement}`} > <div className={`dropdown-animation language-dropdown__dropdown ${placement}`} >
<LanguageDropdownMenu <LanguageDropdownMenu
value={value} value={value}

@ -268,7 +268,7 @@ class PrivacyDropdown extends React.PureComponent {
<Overlay show={open} placement={'bottom'} flip target={this.findTarget} container={container} popperConfig={{ strategy: 'fixed', onFirstUpdate: this.handleOverlayEnter }}> <Overlay show={open} placement={'bottom'} flip target={this.findTarget} container={container} popperConfig={{ strategy: 'fixed', onFirstUpdate: this.handleOverlayEnter }}>
{({ props, placement }) => ( {({ props, placement }) => (
<div {...props} style={{ ...props.style, width: 350, maxWidth: '100vw' }}> <div {...props}>
<div className={`dropdown-animation privacy-dropdown__dropdown ${placement}`}> <div className={`dropdown-animation privacy-dropdown__dropdown ${placement}`}>
<PrivacyDropdownMenu <PrivacyDropdownMenu
items={this.options} items={this.options}

@ -4380,7 +4380,7 @@ a.status-card.compact:hover {
.emoji-picker-dropdown__menu { .emoji-picker-dropdown__menu {
background: $simple-background-color; background: $simple-background-color;
position: absolute; position: relative;
box-shadow: 4px 4px 6px rgba($base-shadow-color, 0.4); box-shadow: 4px 4px 6px rgba($base-shadow-color, 0.4);
border-radius: 4px; border-radius: 4px;
margin-top: 5px; margin-top: 5px;

Loading…
Cancel
Save