diff --git a/lib/pangea/learning_settings/pages/settings_learning_view.dart b/lib/pangea/learning_settings/pages/settings_learning_view.dart index 615e8c873..b80b3d2f8 100644 --- a/lib/pangea/learning_settings/pages/settings_learning_view.dart +++ b/lib/pangea/learning_settings/pages/settings_learning_view.dart @@ -80,6 +80,9 @@ class SettingsLearningView extends StatelessWidget { } return null; }, + backgroundColor: Theme.of(context) + .colorScheme + .surfaceContainerHigh, ), PLanguageDropdown( onChange: (lang) => diff --git a/lib/pangea/learning_settings/widgets/country_picker_tile.dart b/lib/pangea/learning_settings/widgets/country_picker_tile.dart index de3ae56ae..69d3f215a 100644 --- a/lib/pangea/learning_settings/widgets/country_picker_tile.dart +++ b/lib/pangea/learning_settings/widgets/country_picker_tile.dart @@ -1,3 +1,4 @@ +import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:country_picker/country_picker.dart'; @@ -46,8 +47,12 @@ class CountryPickerDropdownState extends State { decoration: InputDecoration( labelText: L10n.of(context).countryInformation, ), - dropdownStyleData: const DropdownStyleData( - maxHeight: 300, + dropdownStyleData: DropdownStyleData( + maxHeight: kIsWeb ? 500 : null, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(14), + color: Theme.of(context).colorScheme.surfaceContainerHigh, + ), ), items: [ ...countries.map( diff --git a/lib/pangea/learning_settings/widgets/p_language_dropdown.dart b/lib/pangea/learning_settings/widgets/p_language_dropdown.dart index 713ca48ce..59fc6f2c2 100644 --- a/lib/pangea/learning_settings/widgets/p_language_dropdown.dart +++ b/lib/pangea/learning_settings/widgets/p_language_dropdown.dart @@ -1,5 +1,6 @@ // Flutter imports: +import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:dropdown_button2/dropdown_button2.dart'; @@ -18,6 +19,7 @@ class PLanguageDropdown extends StatefulWidget { final String decorationText; final String? error; final String? Function(LanguageModel?)? validator; + final Color? backgroundColor; const PLanguageDropdown({ super.key, @@ -29,6 +31,7 @@ class PLanguageDropdown extends StatefulWidget { this.isL2List = false, this.error, this.validator, + this.backgroundColor, }); @override @@ -90,8 +93,12 @@ class PLanguageDropdownState extends State { : null, decoration: InputDecoration(labelText: widget.decorationText), isExpanded: true, - dropdownStyleData: const DropdownStyleData( - maxHeight: 400, + dropdownStyleData: DropdownStyleData( + maxHeight: kIsWeb ? 500 : null, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(14), + color: widget.backgroundColor, + ), ), items: [ if (widget.showMultilingual)