feat: Update typography styles and improve layout in coverage components

This commit is contained in:
Achintha Isuru
2026-03-10 12:07:36 -04:00
parent 94cdf7c486
commit 825cffbc33
4 changed files with 44 additions and 49 deletions

View File

@@ -322,7 +322,7 @@ class UiTypography {
/// Body 1 Medium - Font: Instrument Sans, Size: 16, Height: 1.5 (#121826)
static final TextStyle body1m = _primaryBase.copyWith(
fontWeight: FontWeight.w500,
fontWeight: FontWeight.w600,
fontSize: 16,
height: 1.5,
letterSpacing: -0.025,

View File

@@ -59,7 +59,8 @@ class _CoveragePageState extends State<CoveragePage> {
child: Scaffold(
body: BlocConsumer<CoverageBloc, CoverageState>(
listener: (BuildContext context, CoverageState state) {
if (state.status == CoverageStatus.failure && state.errorMessage != null) {
if (state.status == CoverageStatus.failure &&
state.errorMessage != null) {
UiSnackbar.show(
context,
message: translateErrorKey(state.errorMessage!),
@@ -265,22 +266,25 @@ class _CoveragePageState extends State<CoveragePage> {
padding: const EdgeInsets.all(UiConstants.space5),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
spacing: UiConstants.space6,
children: <Widget>[
if (state.stats != null) ...<Widget>[
CoverageQuickStats(stats: state.stats!),
const SizedBox(height: UiConstants.space5),
],
Column(
spacing: UiConstants.space2,
children: [
if (state.stats != null && state.stats!.late > 0) ...<Widget>[
LateWorkersAlert(lateCount: state.stats!.late),
const SizedBox(height: UiConstants.space5),
],
if (state.stats != null) ...<Widget>[
CoverageQuickStats(stats: state.stats!),
],
],
),
Text(
'Shifts (${state.shifts.length})',
style: UiTypography.title2b.copyWith(
color: UiColors.textPrimary,
),
),
const SizedBox(height: UiConstants.space3),
CoverageShiftList(shifts: state.shifts),
const SizedBox(
height: UiConstants.space24,

View File

@@ -18,6 +18,7 @@ class CoverageQuickStats extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Row(
spacing: UiConstants.space2,
children: <Widget>[
Expanded(
child: _StatCard(
@@ -27,7 +28,6 @@ class CoverageQuickStats extends StatelessWidget {
color: UiColors.iconSuccess,
),
),
const SizedBox(width: UiConstants.space3),
Expanded(
child: _StatCard(
icon: UiIcons.clock,
@@ -36,15 +36,6 @@ class CoverageQuickStats extends StatelessWidget {
color: UiColors.textWarning,
),
),
const SizedBox(width: UiConstants.space3),
Expanded(
child: _StatCard(
icon: UiIcons.warning,
label: 'Late',
value: stats.late.toString(),
color: UiColors.destructive,
),
),
],
);
}
@@ -84,27 +75,30 @@ class _StatCard extends StatelessWidget {
width: 0.75,
),
),
child: Column(
child: Row(
spacing: UiConstants.space2,
children: <Widget>[
Icon(
icon,
color: color,
size: UiConstants.space6,
),
const SizedBox(height: UiConstants.space2),
Row(
spacing: UiConstants.space1,
children: [
Text(
value,
style: UiTypography.title1m.copyWith(
color: UiColors.textPrimary,
style: UiTypography.title1b.copyWith(
color: color,
),
),
const SizedBox(height: UiConstants.space1),
Text(
label,
style: UiTypography.body3r.copyWith(
color: UiColors.mutedForeground,
color: color,
),
textAlign: TextAlign.center,
),
],
),
],
),

View File

@@ -22,32 +22,29 @@ class LateWorkersAlert extends StatelessWidget {
color: UiColors.destructive.withValues(alpha: 0.1),
borderRadius: UiConstants.radiusLg,
border: Border.all(
color: UiColors.destructive.withValues(alpha: 0.3),
color: UiColors.destructive,
width: 0.5,
),
),
child: Row(
spacing: UiConstants.space4,
children: <Widget>[
const Icon(
UiIcons.warning,
color: UiColors.destructive,
size: UiConstants.space5,
),
const SizedBox(width: UiConstants.space3),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
'Late Workers Alert',
style: UiTypography.body1b.copyWith(
color: UiColors.destructive,
),
),
const SizedBox(height: UiConstants.space1),
Text(
'$lateCount ${lateCount == 1 ? 'worker is' : 'workers are'} running late',
style: UiTypography.body1b.textError,
),
Text(
'Auto-backup system system is searching for replacements.',
style: UiTypography.body3r.copyWith(
color: UiColors.destructiveForeground,
color: UiColors.textError.withValues(alpha: 0.7),
),
),
],