Fix the god damn grid

This commit is contained in:
2025-02-22 17:00:16 +01:00
parent e5fc67ef43
commit 4f1a947d2b
2 changed files with 73 additions and 52 deletions

View File

@@ -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,22 +80,20 @@ class _MyHomePageState extends State<MyHomePage> {
),
body: RefreshIndicator(
onRefresh: _refreshGames,
child: LayoutBuilder(
builder: (context, constraints) {
final cardWidth = constraints.maxWidth / 2;
final cardHeight = (cardWidth * 215) / 400; // Maintain aspect ratio
return SingleChildScrollView(
child: SingleChildScrollView(
padding: const EdgeInsets.all(8),
child: Wrap(
spacing: 8,
runSpacing: 8,
child: Column(
children: [
...games.values.map(
(game) => SizedBox(
width: cardWidth - 10, // Subtract spacing to fit 3 cards
height: cardHeight - 10,
child: GameCard(
game: game,
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(() {
@@ -103,18 +101,13 @@ class _MyHomePageState extends State<MyHomePage> {
});
},
onDelete: () async {
await GameRepository.delete(game);
await GameRepository.delete(games.values.elementAt(i));
setState(() {
games.remove(game.name);
games.remove(games.values.elementAt(i).name);
});
},
),
),
),
SizedBox(
width: cardWidth - 10, // Subtract spacing to fit 3 cards
height: cardHeight - 10,
child: NewGameCard(
)
: NewGameCard(
onGameCreated: (game) async {
game = await GameRepository.upsert(game);
setState(() {
@@ -123,10 +116,31 @@ class _MyHomePageState extends State<MyHomePage> {
},
),
),
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
),
],
),
),
],
),
);
},
),
),
);

View File

@@ -181,9 +181,12 @@ class _GameCardState extends State<GameCard>
Positioned.fill(
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Opacity(
opacity: 0.4,
child: Image.memory(widget.game.imageData!, fit: BoxFit.cover),
),
),
),
if (hasImage)
Positioned.fill(
child: Container(
@@ -193,16 +196,16 @@ class _GameCardState extends State<GameCard>
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<GameCard>
],
),
),
const SizedBox(height: 8),
const SizedBox(height: 16),
Row(
children: [
SizedBox(
@@ -283,6 +286,7 @@ class _GameCardState extends State<GameCard>
),
],
),
const SizedBox(height: 12),
Row(
children: [
SizedBox(
@@ -304,6 +308,7 @@ class _GameCardState extends State<GameCard>
),
],
),
const SizedBox(height: 12),
Row(
children: [
SizedBox(
@@ -324,7 +329,9 @@ class _GameCardState extends State<GameCard>
),
],
),
const SizedBox(height: 16),
const Divider(),
const SizedBox(height: 16),
TextField(
controller: _versionRegexController,
focusNode: _versionRegexFocus,