feat(app): style filters

hpi-dhc · Sep 18, 2024 · de05b3a · de05b3a
1 parent e64c4d1
commit de05b3a
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/app/lib/common/widgets/drug_search/drug_filters.dart b/app/lib/common/widgets/drug_search/drug_filters.dart
@@ -181,15 +181,26 @@ class DrugFilters extends StatelessWidget {
     FilterState filter,
   ) {
     Widget buildWarningLevelItem(WarningLevel warningLevel) =>
-      _WarningLevelFilterChip(
-        warningLevel: warningLevel,
-        cubit: cubit,
-        drugs: drugs,
-        filter: filter,
-        activeDrugs: activeDrugs,
-        searchForDrugClass: searchForDrugClass,
+      Padding(
+        padding: EdgeInsets.only(
+          bottom: PharMeTheme.smallSpace,
+          left: PharMeTheme.smallToMediumSpace,
+          right: PharMeTheme.smallToMediumSpace,
+        ),
+        child: _WarningLevelFilterChip(
+          warningLevel: warningLevel,
+          cubit: cubit,
+          drugs: drugs,
+          filter: filter,
+          activeDrugs: activeDrugs,
+          searchForDrugClass: searchForDrugClass,
+        ),
       );
-    return WarningLevel.values.map(buildWarningLevelItem).toList();
+    return [
+      ...WarningLevel.values.map(buildWarningLevelItem),
+      // General padding minus applied bottom padding 
+      SizedBox(height: PharMeTheme.mediumSpace - PharMeTheme.smallSpace),
+    ];
   }
 
   IconButton _buildButton({
@@ -223,11 +234,11 @@ class DrugFilters extends StatelessWidget {
           context: context,
           bodyBuilder: (context) => Padding(
             padding: EdgeInsets.symmetric(
-              horizontal: PharMeTheme.smallToMediumSpace
+              horizontal: PharMeTheme.mediumSpace,
             ),
             child: Container(
               decoration: BoxDecoration(
-                color: PharMeTheme.onSurfaceColor,
+                color: PharMeTheme.surfaceColor,
                 borderRadius: BorderRadius.circular(8),
               ),
               child: IntrinsicWidth(
@@ -238,6 +249,7 @@ class DrugFilters extends StatelessWidget {
                     SubheaderDivider(
                       text: context.l10n.search_page_filter_label,
                       useLine: false,
+                      padding: PharMeTheme.smallToMediumSpace,
                     ),
                     ..._buildWarningLevelFilters(allDrugs, filter),
                   ],

diff --git a/app/lib/faq/pages/faq.dart b/app/lib/faq/pages/faq.dart
@@ -19,7 +19,7 @@ class FaqPage extends StatelessWidget {
               key: Key('questionsColumn'),
               crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                SizedBox(height: 8),
+                SizedBox(height: PharMeTheme.smallSpace),
                 ...faqContent.flatMap((faqSection) =>
                   _buildTopic(context, faqSection)),
                 ..._buildTopicHeader(