From 7ea688eb975f117754fb29a4ab2bb3b55d77fd32 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Alejandro=20Fern=C3=A1ndez?= <61871580+Alejandro-FA@users.noreply.github.com> Date: Thu, 17 Oct 2024 22:26:23 +0200 Subject: [PATCH] Minor visual fixes to Curriculum Vitae --- lib/pages/cv.dart | 24 +++++++++++++----------- lib/utils.dart | 36 ++++++++++++++++++------------------ lib/widgets/base_page.dart | 10 +++++----- lib/widgets/timeline.dart | 4 ++-- 4 files changed, 38 insertions(+), 36 deletions(-) diff --git a/lib/pages/cv.dart b/lib/pages/cv.dart index 4a609ae..91028ff 100644 --- a/lib/pages/cv.dart +++ b/lib/pages/cv.dart @@ -3,7 +3,7 @@ import 'dart:math'; import 'package:auto_route/auto_route.dart'; import 'package:flutter/material.dart'; -import '../utils.dart' show MaterialWindowSizeClass; +import '../utils.dart' show MaterialWindowClass; import '../web_utils.dart' show downloadFile; import '../widgets/base_page.dart'; import '../widgets/timeline.dart'; @@ -18,8 +18,8 @@ class CVPage extends StatelessWidget { final textTheme = theme.textTheme; final screenWidth = MediaQuery.of(context).size.width; final double padding = max( - 50, - (screenWidth - MaterialWindowSizeClass.large.minDP) / 2, + MaterialWindowClass.of(context) <= MaterialWindowClass.medium ? 25 : 50, + (screenWidth - MaterialWindowClass.large.minDP) / 2, ); return BasePage( @@ -174,15 +174,17 @@ class MyTimelineEvent implements TimelineEvent { title, style: textTheme.titleLarge?.copyWith(color: colorScheme.tertiary), ), - Text( - institution, - style: textTheme.titleMedium?.copyWith(color: colorScheme.tertiary), + Padding( + padding: const EdgeInsets.only(top: 8), + child: Text( + institution, + style: + textTheme.titleSmall?.copyWith(color: colorScheme.tertiary), + ), ), - if (grade != null || awards != null || description != null) - const SizedBox(height: 12), if (grade != null) Padding( - padding: const EdgeInsets.symmetric(vertical: 6), + padding: const EdgeInsets.only(top: 20), child: RichText( text: TextSpan( text: 'Average grade: ', @@ -201,7 +203,7 @@ class MyTimelineEvent implements TimelineEvent { ), if (awards != null) Padding( - padding: const EdgeInsets.symmetric(vertical: 6), + padding: const EdgeInsets.only(top: 8), child: RichText( text: TextSpan( text: 'Awards: ', @@ -220,7 +222,7 @@ class MyTimelineEvent implements TimelineEvent { ), if (description != null) Padding( - padding: const EdgeInsets.symmetric(vertical: 8), + padding: const EdgeInsets.only(top: 20), child: Text( description!, style: textTheme.bodyLarge?.copyWith(height: 1.5), diff --git a/lib/utils.dart b/lib/utils.dart index 91d1f6e..8eb6466 100644 --- a/lib/utils.dart +++ b/lib/utils.dart @@ -6,14 +6,14 @@ import 'package:url_launcher/url_launcher.dart'; /// An enumeration of the different window sizes according to the [Material /// Design 3 guidelines](https://m3.material.io/foundations/layout/applying-layout/window-size-classes). -enum MaterialWindowSizeClass implements Comparable { +enum MaterialWindowClass implements Comparable { compact(minDP: 0, maxDP: 600, panes: 1), medium(minDP: 600, maxDP: 840, panes: 1), expanded(minDP: 840, maxDP: 1200, panes: 2), large(minDP: 1200, maxDP: 1600, panes: 2), extraLarge(minDP: 1600, maxDP: double.infinity, panes: 3); - const MaterialWindowSizeClass({ + const MaterialWindowClass({ required this.minDP, required this.maxDP, required this.panes, @@ -28,29 +28,29 @@ enum MaterialWindowSizeClass implements Comparable { /// Recommended number of panes to divide the screen. final int panes; - /// Returns the [MaterialWindowSizeClass] based on the screen width. - static MaterialWindowSizeClass of(BuildContext context) { + /// Returns the [MaterialWindowClass] based on the screen width. + static MaterialWindowClass of(BuildContext context) { final width = MediaQuery.of(context).size.width; - if (width < MaterialWindowSizeClass.compact.maxDP) { - return MaterialWindowSizeClass.compact; - } else if (width < MaterialWindowSizeClass.medium.maxDP) { - return MaterialWindowSizeClass.medium; - } else if (width < MaterialWindowSizeClass.expanded.maxDP) { - return MaterialWindowSizeClass.expanded; - } else if (width < MaterialWindowSizeClass.large.maxDP) { - return MaterialWindowSizeClass.large; + if (width < MaterialWindowClass.compact.maxDP) { + return MaterialWindowClass.compact; + } else if (width < MaterialWindowClass.medium.maxDP) { + return MaterialWindowClass.medium; + } else if (width < MaterialWindowClass.expanded.maxDP) { + return MaterialWindowClass.expanded; + } else if (width < MaterialWindowClass.large.maxDP) { + return MaterialWindowClass.large; } else { - return MaterialWindowSizeClass.extraLarge; + return MaterialWindowClass.extraLarge; } } @override - int compareTo(MaterialWindowSizeClass other) => minDP.compareTo(other.minDP); + int compareTo(MaterialWindowClass other) => minDP.compareTo(other.minDP); - bool operator <(MaterialWindowSizeClass other) => minDP < other.minDP; - bool operator <=(MaterialWindowSizeClass other) => minDP <= other.minDP; - bool operator >(MaterialWindowSizeClass other) => minDP > other.minDP; - bool operator >=(MaterialWindowSizeClass other) => minDP >= other.minDP; + bool operator <(MaterialWindowClass other) => minDP < other.minDP; + bool operator <=(MaterialWindowClass other) => minDP <= other.minDP; + bool operator >(MaterialWindowClass other) => minDP > other.minDP; + bool operator >=(MaterialWindowClass other) => minDP >= other.minDP; } void openWebpage(String url) { diff --git a/lib/widgets/base_page.dart b/lib/widgets/base_page.dart index c1e8aa0..c5742c7 100644 --- a/lib/widgets/base_page.dart +++ b/lib/widgets/base_page.dart @@ -82,10 +82,10 @@ class BasePage extends StatelessWidget { floatingActionButton: floatingActionButton, drawer: _Drawer(menuRoutes: menuRoutes, socialMedia: socialMedia), body: Stack( - alignment: MaterialWindowSizeClass.of(context) >= - MaterialWindowSizeClass.expanded - ? AlignmentDirectional.centerEnd - : AlignmentDirectional.bottomCenter, + alignment: + MaterialWindowClass.of(context) >= MaterialWindowClass.expanded + ? AlignmentDirectional.centerEnd + : AlignmentDirectional.bottomCenter, children: [ CustomScrollView( physics: const BouncingScrollPhysics(), @@ -253,4 +253,4 @@ class _SocialMediaRail extends StatelessWidget { } bool _isWideScreen(BuildContext context) => - MaterialWindowSizeClass.of(context) >= MaterialWindowSizeClass.expanded; + MaterialWindowClass.of(context) >= MaterialWindowClass.expanded; diff --git a/lib/widgets/timeline.dart b/lib/widgets/timeline.dart index 7174912..41f8c3f 100644 --- a/lib/widgets/timeline.dart +++ b/lib/widgets/timeline.dart @@ -1,6 +1,6 @@ import 'package:flutter/widgets.dart'; -import '../utils.dart' show MaterialWindowSizeClass; +import '../utils.dart' show MaterialWindowClass; abstract class TimelineEvent { Widget buildLeft(BuildContext context); @@ -32,7 +32,7 @@ class Timeline extends StatelessWidget { @override Widget build(BuildContext context) => - MaterialWindowSizeClass.of(context) >= MaterialWindowSizeClass.expanded + MaterialWindowClass.of(context) >= MaterialWindowClass.expanded ? _buildWide(context) : _buildNarrow(context);