diff --git a/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx b/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx index 6601e2800e1..ed97f30c8df 100644 --- a/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx +++ b/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx @@ -25,6 +25,7 @@ export default class DisabledPermissionListItem extends Component { handlePicked={() => {}} value={item.permission} disabled={true} + className={'gf-form-input--form-dropdown-right'} /> diff --git a/public/app/core/components/Permissions/PermissionsListItem.tsx b/public/app/core/components/Permissions/PermissionsListItem.tsx index 57e438d663a..dfb855ed682 100644 --- a/public/app/core/components/Permissions/PermissionsListItem.tsx +++ b/public/app/core/components/Permissions/PermissionsListItem.tsx @@ -32,6 +32,7 @@ export default observer(({ item, removeItem, permissionChanged, itemIndex, folde handlePicked={handleChangePermission} value={item.permission} disabled={item.inherited} + className={'gf-form-input--form-dropdown-right'} /> diff --git a/public/app/core/components/Picker/DescriptionPicker.tsx b/public/app/core/components/Picker/DescriptionPicker.tsx index 174a04861be..498c0df7ab2 100644 --- a/public/app/core/components/Picker/DescriptionPicker.tsx +++ b/public/app/core/components/Picker/DescriptionPicker.tsx @@ -7,6 +7,7 @@ export interface IProps { handlePicked: (permission) => void; value: number; disabled: boolean; + className?: string; } export interface OptionWithDescription { @@ -22,7 +23,7 @@ class DescriptionPicker extends Component { } render() { - const { optionsWithDesc, handlePicked, value, disabled } = this.props; + const { optionsWithDesc, handlePicked, value, disabled, className } = this.props; return (
@@ -34,7 +35,7 @@ class DescriptionPicker extends Component { labelKey="label" options={optionsWithDesc} onChange={handlePicked} - className="width-7 gf-form-input gf-form-input--form-dropdown" + className={`width-7 gf-form-input gf-form-input--form-dropdown ${className || ''}`} optionComponent={DescriptionOption} placeholder="Choose" disabled={disabled} diff --git a/public/sass/components/_form_select_box.scss b/public/sass/components/_form_select_box.scss index b0c1f96336e..beee2db15ab 100644 --- a/public/sass/components/_form_select_box.scss +++ b/public/sass/components/_form_select_box.scss @@ -39,10 +39,6 @@ $select-option-selected-bg: $dropdownLinkBackgroundActive; color: $input-color-placeholder; } - .Select-menu-outer { - right: 0; - } - > .Select-control { @include select-control(); border-color: $dark-3; @@ -102,3 +98,9 @@ $select-option-selected-bg: $dropdownLinkBackgroundActive; } } } + +.gf-form-input--form-dropdown-right { + .Select-menu-outer { + right: 0; + } +}