💄 Optimize news design

lib/screens/explore.dart

@@ -7,6 +7,7 @@ import 'package:go_router/go_router.dart';
 import 'package:material_symbols_icons/symbols.dart';
 import 'package:provider/provider.dart';
 import 'package:styled_widget/styled_widget.dart';
+import 'package:surface/providers/config.dart';
 import 'package:surface/providers/post.dart';
 import 'package:surface/providers/sn_network.dart';
 import 'package:surface/screens/post/post_detail.dart';
@@ -96,6 +97,8 @@ class _ExploreScreenState extends State<ExploreScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final cfg = context.read<ConfigProvider>();
+
     return AppScaffold(
       floatingActionButtonLocation: ExpandableFab.location,
       floatingActionButton: ExpandableFab(
@@ -243,8 +246,10 @@ class _ExploreScreenState extends State<ExploreScreen> {
                     ),
                     openColor: Colors.transparent,
                     openElevation: 0,
-                    closedColor: Theme.of(context).colorScheme.surfaceContainerLow.withOpacity(0.75),
                     transitionType: ContainerTransitionType.fade,
+                    closedColor: Theme.of(context).colorScheme.surfaceContainerLow.withOpacity(
+                          cfg.prefs.getBool(kAppBackgroundStoreKey) == true ? 0.75 : 1,
+                        ),
                     closedShape: const RoundedRectangleBorder(
                       borderRadius: BorderRadius.all(Radius.circular(16)),
                     ),

lib/screens/home.dart

@@ -51,7 +51,7 @@ class HomeScreen extends StatefulWidget {
 }
 
 class _HomeScreenState extends State<HomeScreen> {
-  static const List<HomeScreenDashEntry> kCards = [
+  late final List<HomeScreenDashEntry> kCards = [
     HomeScreenDashEntry(
       name: 'dashEntryRecommendation',
       child: _HomeDashRecommendationPostWidget(),
@@ -69,7 +69,7 @@ class _HomeScreenState extends State<HomeScreen> {
     HomeScreenDashEntry(
       name: 'dashEntryTodayNews',
       child: _HomeDashTodayNews(),
-      cols: 2,
+      cols: MediaQuery.of(context).size.width >= 640 ? 3 : 2,
     ),
   ];
 
@@ -293,7 +293,7 @@ class _HomeDashTodayNewsState extends State<_HomeDashTodayNews> {
                     Text(
                       _article!.title,
                       style: Theme.of(context).textTheme.titleMedium!.copyWith(fontSize: 18),
-                      maxLines: 2,
+                      maxLines: MediaQuery.of(context).size.width >= 640 ? 2 : 1,
                       overflow: TextOverflow.ellipsis,
                     ),
                     Text(

lib/screens/news/news_detail.dart

@@ -175,6 +175,8 @@ class _NewsDetailScreenState extends State<NewsDetailScreen> {
           ),
           if (_articleFragment != null && _isReadingFromReader)
             Expanded(
+              child: Container(
+                constraints: BoxConstraints(maxWidth: 640),
                 child: SingleChildScrollView(
                   child: Column(
                     crossAxisAlignment: CrossAxisAlignment.start,
@@ -223,6 +225,7 @@ class _NewsDetailScreenState extends State<NewsDetailScreen> {
                     ],
                   ).padding(horizontal: 12, vertical: 16),
                 ),
+              ).center(),
             )
           else if (_article != null)
             Expanded(

lib/screens/news/news_list.dart

@@ -70,11 +70,16 @@ class _NewsScreenState extends State<NewsScreen> {
                 sliver: SliverAppBar(
                   leading: AutoAppBarLeading(),
                   title: Text('screenNews').tr(),
+                  floating: true,
+                  snap: true,
                   bottom: TabBar(
                     isScrollable: true,
                     tabs: [
-                      Tab(child: Text('newsAllSources'.tr())),
-                      for (final source in _sources!) Tab(child: Text(source.label)),
+                      Tab(child: Text('newsAllSources'.tr()).textColor(Theme.of(context).appBarTheme.foregroundColor)),
+                      for (final source in _sources!)
+                        Tab(
+                          child: Text(source.label).textColor(Theme.of(context).appBarTheme.foregroundColor),
+                        ),
                     ],
                   ),
                 ),
@@ -146,6 +151,9 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
     return MediaQuery.removePadding(
       context: context,
       removeTop: true,
+      child: Center(
+        child: Container(
+          constraints: BoxConstraints(maxWidth: 640),
           child: RefreshIndicator(
             onRefresh: _fetchArticles,
             child: InfiniteList(
@@ -187,7 +195,9 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
                               child: Container(
                                 color: Theme.of(context).colorScheme.surfaceContainer,
                                 child: AutoResizeUniversalImage(
-                              article.thumbnail.startsWith('http') ? article.thumbnail : '$baseUrl/${article.thumbnail}',
+                                  article.thumbnail.startsWith('http')
+                                      ? article.thumbnail
+                                      : '$baseUrl/${article.thumbnail}',
                                 ),
                               ),
                             ),
@@ -222,6 +232,8 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
               },
             ),
           ),
+        ),
+      ),
     );
   }
 }