diff --git a/packages/remix/lib/src/themes/fortaleza/components.dart b/packages/remix/lib/src/themes/fortaleza/components.dart index b24fc6a80..f131f0208 100644 --- a/packages/remix/lib/src/themes/fortaleza/components.dart +++ b/packages/remix/lib/src/themes/fortaleza/components.dart @@ -1,4 +1,3 @@ -import '../../components/dropdown_menu/dropdown_menu.dart'; import '../../core/theme/component.dart'; import 'components/accordion_theme.dart'; import 'components/avatar_theme.dart'; @@ -10,6 +9,7 @@ import 'components/checkbox_theme.dart'; import 'components/chip_theme.dart'; import 'components/dialog_theme.dart'; import 'components/divider_theme.dart'; +import 'components/dropdown.dart'; import 'components/icon_button_theme.dart'; import 'components/menu_item_theme.dart'; import 'components/progress_theme.dart'; @@ -74,7 +74,7 @@ class FortalezaComponentTheme extends RemixComponentTheme { textField: FortalezaTextFieldStyle(), toast: FortalezaToastStyle(), slider: FortalezaSliderStyle(), - dropdownMenu: DropdownMenuStyle(), + dropdownMenu: FortalezaDropdownMenuStyle(), ); } diff --git a/packages/remix/lib/src/themes/fortaleza/components/dropdown_theme.dart b/packages/remix/lib/src/themes/fortaleza/components/dropdown_theme.dart new file mode 100644 index 000000000..992d4fad0 --- /dev/null +++ b/packages/remix/lib/src/themes/fortaleza/components/dropdown_theme.dart @@ -0,0 +1,29 @@ +import 'package:mix/mix.dart'; + +import '../../../components/dropdown_menu/dropdown_menu.dart'; +import '../tokens.dart'; + +class FortalezaDropdownMenuStyle extends DropdownMenuStyle { + const FortalezaDropdownMenuStyle(); + + @override + Style makeStyle(SpecConfiguration spec) { + final $ = spec.utilities; + + final baseStyle = super.makeStyle(spec); + + final baseThemeOverrides = Style( + $.menu.container.chain + ..color.$neutral(1) + ..border.all.color.$neutral(6) + ..wrap.intrinsicWidth() + ..padding.all.$space2(), + $.item.container.padding.horizontal.$space3(), + $.item.text.style.color.$neutral(12), + spec.on.hover($.item.container.color.$neutral(4)), + ); + + return Style.create([baseStyle(), baseThemeOverrides()]) + .animate(duration: const Duration(milliseconds: 100)); + } +}