Refactor HomePage layout to center title and align navigation buttons, enhancing visual structure

This commit is contained in:
Leon Bösche
2026-01-17 01:58:27 +01:00
parent a219b8c1a2
commit 712abbb34f

View File

@@ -405,42 +405,43 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
backgroundColor: AppTheme.primaryBackground,
body: Stack(
children: [
// Top bar: title and nav buttons
// Top bar: title always centered, nav buttons right
Positioned(
top: 0,
left: 0,
right: 0,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 32),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
// Left spacer
const Expanded(child: SizedBox()),
// Center: title only
Expanded(
flex: 2,
child: Builder(
builder: (context) {
final screenWidth = MediaQuery.of(context).size.width;
final fontSize = screenWidth < 600 ? 24.0 : 48.0;
return Text(
'b0esche.cloud',
style: TextStyle(
fontFamily: 'PixelatedElegance',
fontSize: fontSize,
color: AppTheme.primaryText,
decoration: TextDecoration.underline,
decorationColor: AppTheme.primaryText,
fontFeatures: const [FontFeature.slashedZero()],
),
);
},
child: SizedBox(
height: 64,
child: Stack(
alignment: Alignment.center,
children: [
// Centered title
Align(
alignment: Alignment.center,
child: Builder(
builder: (context) {
final screenWidth = MediaQuery.of(
context,
).size.width;
final fontSize = screenWidth < 600 ? 24.0 : 48.0;
return Text(
'b0esche.cloud',
style: TextStyle(
fontFamily: 'PixelatedElegance',
fontSize: fontSize,
color: AppTheme.primaryText,
decoration: TextDecoration.underline,
decorationColor: AppTheme.primaryText,
fontFeatures: const [FontFeature.slashedZero()],
),
);
},
),
),
),
// Right: nav buttons
Expanded(
child: Align(
// Right: nav buttons
Align(
alignment: Alignment.centerRight,
child: BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
@@ -467,8 +468,8 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
},
),
),
),
],
],
),
),
),
),