style(recommend): 按截图重做全部短剧筛选区

lib/core/theme/app_colors.dart

@@ -77,7 +77,11 @@ abstract final class AppColors {
   static const contentSurface = Color(0xFF1C1C1E);
   static const contentChip = Color(0xFF2C2C2E);
   static const contentBorder = Color(0x1AFFFFFF);
-  static const filterChipSelected = Color(0xFF4A1E1E);
+  static const filterChipSelected = Color(0xFF21090E);
+  static const filterChipTextSelected = Color(0xFFFF4D6A);
+  static const filterChipTextInactive = Color(0xFF8A8A8A);
+  static const filterMenuButton = Color(0xFF2A2A2A);
+  static const filterMenuIcon = Color(0xFFBDBDBD);
 
   /// 「我的」页卡片与描边。
   static const mineCard = Color(0xFF16161A);

lib/core/theme/app_dimens.dart

@@ -137,17 +137,19 @@ abstract final class AppDimens {
   static const double recommendCardWidth = 122;
 
   /// 全部短剧筛选与追剧双列。
-  static const double filterChipFont = 15;
-  static const double filterChipHeight = 30;
-  static const double filterChipRadius = 15;
-  static const double filterChipHorizontalPadding = 12;
-  static const double filterRowGap = 6;
-  static const double filterItemGap = 12;
+  static const double filterChipFont = 16;
+  static const double filterChipHeight = 32;
+  static const double filterChipRadius = 16;
+  static const double filterChipHorizontalPadding = 14;
+  static const double filterRowGap = 10;
+  static const double filterItemGap = 16;
   static const double allDramasHorizontal = 12;
   static const double allDramasGridGap = 6;
   static const double allDramasGridRowGap = 12;
   static const double allDramasFilterToGridGap = 12;
-  static const double allDramasFilterIcon = 26;
+  static const double allDramasFilterIcon = 22;
+  static const double allDramasFilterButton = 44;
+  static const double allDramasFilterRight = 12;
   static const double followingTabFont = 16;
   static const double followingGridAspectRatio = 0.5;
 

lib/pages/recommend/widgets/all_dramas_filter_grid.dart

@@ -144,7 +144,7 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
       padding: const EdgeInsets.fromLTRB(
         AppDimens.feedPageHorizontal,
         0,
-        AppDimens.feedPageHorizontal,
+        AppDimens.allDramasFilterRight,
         AppDimens.allDramasFilterToGridGap,
       ),
       child: Column(
@@ -254,7 +254,9 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
         child: Text(
           label,
           style: TextStyle(
-            color: selected ? AppColors.textPrimary : AppColors.textTabInactive,
+            color: selected
+                ? AppColors.filterChipTextSelected
+                : AppColors.filterChipTextInactive,
             fontSize: AppDimens.filterChipFont,
             fontWeight: selected ? FontWeight.w600 : FontWeight.w400,
             height: 1,
@@ -267,39 +269,41 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
   Widget _sortRow(AppLocalizations l10n) {
     return SizedBox(
       key: const Key('all-filter-row-3'),
-      height: AppDimens.filterChipHeight,
+      height: AppDimens.allDramasFilterButton,
       child: Row(
         mainAxisAlignment: MainAxisAlignment.start,
         crossAxisAlignment: CrossAxisAlignment.center,
         children: [
-          _sortOption(
+          _chip(
             key: const Key('all-sort-hot'),
             label: l10n.hot,
             selected: !_newest,
             onTap: () => setState(() => _newest = false),
           ),
           const SizedBox(width: AppDimens.filterItemGap),
-          _sortOption(
+          _chip(
             key: const Key('all-sort-new'),
             label: l10n.newest,
             selected: _newest,
             onTap: () => setState(() => _newest = true),
           ),
           const Spacer(),
-          SizedBox.square(
-            dimension: AppDimens.allDramasFilterIcon,
-            child: IconButton(
+          Material(
+            key: const Key('all-dramas-filter-page-button'),
+            color: AppColors.filterMenuButton,
+            shape: const CircleBorder(),
+            child: InkWell(
               key: const Key('all-dramas-filter-page'),
-              tooltip: l10n.filter,
-              padding: EdgeInsets.zero,
-              constraints: const BoxConstraints.tightFor(
-                width: AppDimens.allDramasFilterIcon,
-                height: AppDimens.allDramasFilterIcon,
+              customBorder: const CircleBorder(),
+              onTap: widget.onOpenFilter,
+              child: const SizedBox.square(
+                dimension: AppDimens.allDramasFilterButton,
+                child: Icon(
+                  Icons.filter_list_rounded,
+                  size: AppDimens.allDramasFilterIcon,
+                  color: AppColors.filterMenuIcon,
+                ),
               ),
-              onPressed: widget.onOpenFilter,
-              color: AppColors.textPrimary,
-              iconSize: AppDimens.allDramasFilterIcon,
-              icon: const Icon(Icons.filter_list_rounded),
             ),
           ),
         ],
@@ -307,39 +311,6 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
     );
   }
 
-  Widget _sortOption({
-    required Key key,
-    required String label,
-    required bool selected,
-    required VoidCallback onTap,
-  }) {
-    return GestureDetector(
-      key: key,
-      behavior: HitTestBehavior.opaque,
-      onTap: onTap,
-      child: SizedBox(
-        height: AppDimens.filterChipHeight,
-        child: Container(
-          padding: const EdgeInsets.symmetric(
-            horizontal: AppDimens.filterChipHorizontalPadding,
-          ),
-          alignment: Alignment.center,
-          child: Text(
-            label,
-            style: TextStyle(
-              color: selected
-                  ? AppColors.textPrimary
-                  : AppColors.textTabInactive,
-              fontSize: AppDimens.filterChipFont,
-              fontWeight: selected ? FontWeight.w700 : FontWeight.w400,
-              height: 1,
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-
   List<({String id, String label})> _availableGenres(AppLocalizations l10n) {
     final definitions = [
       (id: 'reversal', label: l10n.reversalFilter, terms: _reversalTerms),