diff --git a/lib/main.dart b/lib/main.dart index 0d114d2..bbd85f1 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -32,7 +32,7 @@ class MyApp extends StatelessWidget { margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8), ), textTheme: const TextTheme( - titleLarge: TextStyle(fontSize: 22, fontWeight: FontWeight.bold), + titleLarge: TextStyle(fontSize: 30, fontWeight: FontWeight.bold), bodyLarge: TextStyle(fontSize: 18), bodyMedium: TextStyle(fontSize: 16), bodySmall: TextStyle(fontSize: 14), @@ -80,53 +80,67 @@ class _MyHomePageState extends State { ), body: RefreshIndicator( onRefresh: _refreshGames, - child: LayoutBuilder( - builder: (context, constraints) { - final cardWidth = constraints.maxWidth / 2; - final cardHeight = (cardWidth * 215) / 400; // Maintain aspect ratio - return SingleChildScrollView( - padding: const EdgeInsets.all(8), - child: Wrap( - spacing: 8, - runSpacing: 8, - children: [ - ...games.values.map( - (game) => SizedBox( - width: cardWidth - 10, // Subtract spacing to fit 3 cards - height: cardHeight - 10, - child: GameCard( - game: game, - onGameUpdated: (game) async { - game = await GameRepository.upsert(game); - setState(() { - games[game.name] = game; - }); - }, - onDelete: () async { - await GameRepository.delete(game); - setState(() { - games.remove(game.name); - }); - }, + child: SingleChildScrollView( + padding: const EdgeInsets.all(8), + child: Column( + children: [ + for (var i = 0; i < games.length + 1; i += 2) + Padding( + padding: const EdgeInsets.only(bottom: 8), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Expanded( + child: i < games.length + ? GameCard( + game: games.values.elementAt(i), + onGameUpdated: (game) async { + game = await GameRepository.upsert(game); + setState(() { + games[game.name] = game; + }); + }, + onDelete: () async { + await GameRepository.delete(games.values.elementAt(i)); + setState(() { + games.remove(games.values.elementAt(i).name); + }); + }, + ) + : NewGameCard( + onGameCreated: (game) async { + game = await GameRepository.upsert(game); + setState(() { + games[game.name] = game; + }); + }, + ), ), - ), + const SizedBox(width: 8), + Expanded( + child: i + 1 < games.length + ? GameCard( + game: games.values.elementAt(i + 1), + onGameUpdated: (game) async { + game = await GameRepository.upsert(game); + setState(() { + games[game.name] = game; + }); + }, + onDelete: () async { + await GameRepository.delete(games.values.elementAt(i + 1)); + setState(() { + games.remove(games.values.elementAt(i + 1).name); + }); + }, + ) + : const SizedBox(), // Empty space for odd number of items + ), + ], ), - SizedBox( - width: cardWidth - 10, // Subtract spacing to fit 3 cards - height: cardHeight - 10, - child: NewGameCard( - onGameCreated: (game) async { - game = await GameRepository.upsert(game); - setState(() { - games[game.name] = game; - }); - }, - ), - ), - ], - ), - ); - }, + ), + ], + ), ), ), ); diff --git a/lib/widgets/game_card.dart b/lib/widgets/game_card.dart index af20032..08d64c9 100644 --- a/lib/widgets/game_card.dart +++ b/lib/widgets/game_card.dart @@ -181,7 +181,10 @@ class _GameCardState extends State Positioned.fill( child: ClipRRect( borderRadius: BorderRadius.circular(12), - child: Image.memory(widget.game.imageData!, fit: BoxFit.cover), + child: Opacity( + opacity: 0.4, + child: Image.memory(widget.game.imageData!, fit: BoxFit.cover), + ), ), ), if (hasImage) @@ -193,16 +196,16 @@ class _GameCardState extends State begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [ - Colors.transparent, - Colors.black.withOpacity(0.7), - Colors.black.withOpacity(0.9), + Colors.black.withAlpha(110), + Colors.black.withAlpha(90), + Colors.black.withAlpha(70), ], ), ), ), ), Padding( - padding: const EdgeInsets.all(16.0), + padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 24.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -260,7 +263,7 @@ class _GameCardState extends State ], ), ), - const SizedBox(height: 8), + const SizedBox(height: 16), Row( children: [ SizedBox( @@ -283,6 +286,7 @@ class _GameCardState extends State ), ], ), + const SizedBox(height: 12), Row( children: [ SizedBox( @@ -304,6 +308,7 @@ class _GameCardState extends State ), ], ), + const SizedBox(height: 12), Row( children: [ SizedBox( @@ -324,7 +329,9 @@ class _GameCardState extends State ), ], ), + const SizedBox(height: 16), const Divider(), + const SizedBox(height: 16), TextField( controller: _versionRegexController, focusNode: _versionRegexFocus,