diff --git a/packages/ui/src/ui/dropdown/dropdown.jsx b/packages/ui/src/ui/dropdown/dropdown.jsx
index b71ad06ed5..b2fa874a2a 100644
--- a/packages/ui/src/ui/dropdown/dropdown.jsx
+++ b/packages/ui/src/ui/dropdown/dropdown.jsx
@@ -8,17 +8,17 @@ import { Icon } from '../icon';
import css from './dropdown.module.css';
export const Dropdown = (props) => {
- const { className, label, ariaLabel, glyph, activeLabel, children } = props;
- const rootClassName = cx(css.root, activeLabel && css.activeLabel, className);
+ const { className, label, ariaLabel, glyph, children } = props;
+ const rootClassName = cx(css.root, className);
const menuState = useMenuState();
const baseId = process.env.NODE_ENV === 'test' && 'id-test';
return (
- <>
+
@@ -42,7 +42,7 @@ export const Dropdown = (props) => {
})
: children}
- >
+
);
};
@@ -51,7 +51,6 @@ Dropdown.defaultProps = {
label: null,
ariaLabel: '',
glyph: null,
- activeLabel: false,
};
Dropdown.propTypes = {
@@ -70,9 +69,6 @@ Dropdown.propTypes = {
/** Dropdown open state */
open: PropTypes.bool.isRequired,
- /** Active label flag */
- activeLabel: PropTypes.bool,
-
/** Content */
children: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.func]).isRequired,
};
diff --git a/packages/ui/src/ui/dropdown/dropdown.module.css b/packages/ui/src/ui/dropdown/dropdown.module.css
index 0e3111eaf7..2fae07b6f9 100644
--- a/packages/ui/src/ui/dropdown/dropdown.module.css
+++ b/packages/ui/src/ui/dropdown/dropdown.module.css
@@ -1,4 +1,8 @@
.root {
+ display: inline-block;
+}
+
+.button {
background: none;
border: none;
padding: 0;
@@ -18,9 +22,9 @@
color: var(--color-text-light);
}
-.root:hover,
-.root:focus,
-.root:active {
+.button:hover,
+.button:focus,
+.button:active {
outline: none;
box-shadow: 0 0 var(--space-xxxsmall) var(--color-shadow);
border-color: var(--color-outline-dark);
@@ -44,10 +48,6 @@
box-shadow: 0 2px var(--space-xsmall) var(--color-shadow);
}
-.activeLabel .label {
- color: var(--color-text);
-}
-
.menuItem {
display: block;
appearance: none;