Accessibility update

This commit is contained in:
Christien Rioux 2025-05-25 23:40:52 -04:00
parent be8014c97a
commit 3b1cb53b8a
55 changed files with 1089 additions and 807 deletions

View file

@ -73,15 +73,18 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
title: translate('edit_account_page.remove_account_confirm'),
child: Column(mainAxisSize: MainAxisSize.min, children: [
Text(translate('edit_account_page.remove_account_confirm_message'))
.paddingLTRB(24, 24, 24, 0),
Text(translate('confirmation.are_you_sure')).paddingAll(8),
.paddingLTRB(24.scaled(context), 24.scaled(context),
24.scaled(context), 0),
Text(translate('confirmation.are_you_sure'))
.paddingAll(8.scaled(context)),
Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [
ElevatedButton(
onPressed: () {
Navigator.of(context).pop(false);
},
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.cancel, size: 16).paddingLTRB(0, 0, 4, 0),
Icon(Icons.cancel, size: 16.scaled(context))
.paddingLTRB(0, 0, 4.scaled(context), 0),
Text(translate('button.no')).paddingLTRB(0, 0, 4, 0)
])),
ElevatedButton(
@ -89,10 +92,12 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
Navigator.of(context).pop(true);
},
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.check, size: 16).paddingLTRB(0, 0, 4, 0),
Text(translate('button.yes')).paddingLTRB(0, 0, 4, 0)
Icon(Icons.check, size: 16.scaled(context))
.paddingLTRB(0, 0, 4.scaled(context), 0),
Text(translate('button.yes'))
.paddingLTRB(0, 0, 4.scaled(context), 0)
]))
]).paddingAll(24)
]).paddingAll(24.scaled(context))
]));
if (confirmed != null && confirmed) {
try {
@ -141,29 +146,36 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
title: translate('edit_account_page.destroy_account_confirm'),
child: Column(mainAxisSize: MainAxisSize.min, children: [
Text(translate('edit_account_page.destroy_account_confirm_message'))
.paddingLTRB(24, 24, 24, 0),
.paddingLTRB(24.scaled(context), 24.scaled(context),
24.scaled(context), 0),
Text(translate(
'edit_account_page.destroy_account_confirm_message_details'))
.paddingLTRB(24, 24, 24, 0),
Text(translate('confirmation.are_you_sure')).paddingAll(8),
.paddingLTRB(24.scaled(context), 24.scaled(context),
24.scaled(context), 0),
Text(translate('confirmation.are_you_sure'))
.paddingAll(24.scaled(context)),
Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [
ElevatedButton(
onPressed: () {
Navigator.of(context).pop(false);
},
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.cancel, size: 16).paddingLTRB(0, 0, 4, 0),
Text(translate('button.no')).paddingLTRB(0, 0, 4, 0)
Icon(Icons.cancel, size: 16.scaled(context))
.paddingLTRB(0, 0, 4.scaled(context), 0),
Text(translate('button.no'))
.paddingLTRB(0, 0, 4.scaled(context), 0)
])),
ElevatedButton(
onPressed: () {
Navigator.of(context).pop(true);
},
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.check, size: 16).paddingLTRB(0, 0, 4, 0),
Text(translate('button.yes')).paddingLTRB(0, 0, 4, 0)
Icon(Icons.check, size: 16.scaled(context))
.paddingLTRB(0, 0, 4.scaled(context), 0),
Text(translate('button.yes'))
.paddingLTRB(0, 0, 4.scaled(context), 0)
]))
]).paddingAll(24)
]).paddingAll(24.scaled(context))
]));
if (confirmed != null && confirmed) {
try {
@ -250,10 +262,12 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
return StyledScaffold(
appBar: DefaultAppBar(
context: context,
title: Text(translate('edit_account_page.titlebar')),
leading: Navigator.canPop(context)
? IconButton(
icon: const Icon(Icons.arrow_back),
iconSize: 24.scaled(context),
onPressed: () {
singleFuture((this, _kDoBackArrow), () async {
if (_isModified) {
@ -277,6 +291,7 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
const SignalStrengthMeterWidget(),
IconButton(
icon: const Icon(Icons.settings),
iconSize: 24.scaled(context),
tooltip: translate('menu.settings_tooltip'),
onPressed: () async {
await GoRouterHelper(context).push('/settings');
@ -285,14 +300,14 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
body: SingleChildScrollView(
child: Column(children: [
_editAccountForm(context).paddingLTRB(0, 0, 0, 32),
OptionBox(
StyledButtonBox(
instructions:
translate('edit_account_page.remove_account_description'),
buttonIcon: Icons.person_remove_alt_1,
buttonText: translate('edit_account_page.remove_account'),
onClick: _onRemoveAccount,
),
OptionBox(
StyledButtonBox(
instructions:
translate('edit_account_page.destroy_account_description'),
buttonIcon: Icons.person_off,

View file

@ -53,16 +53,16 @@ class EditProfileForm extends StatefulWidget {
..add(DiagnosticsProperty<AccountSpec>('initialValue', initialValue));
}
static const String formFieldName = 'name';
static const String formFieldPronouns = 'pronouns';
static const String formFieldAbout = 'about';
static const String formFieldAvailability = 'availability';
static const String formFieldFreeMessage = 'free_message';
static const String formFieldAwayMessage = 'away_message';
static const String formFieldBusyMessage = 'busy_message';
static const String formFieldAvatar = 'avatar';
static const String formFieldAutoAway = 'auto_away';
static const String formFieldAutoAwayTimeout = 'auto_away_timeout';
static const formFieldName = 'name';
static const formFieldPronouns = 'pronouns';
static const formFieldAbout = 'about';
static const formFieldAvailability = 'availability';
static const formFieldFreeMessage = 'free_message';
static const formFieldAwayMessage = 'away_message';
static const formFieldBusyMessage = 'busy_message';
static const formFieldAvatar = 'avatar';
static const formFieldAutoAway = 'auto_away';
static const formFieldAutoAwayTimeout = 'auto_away_timeout';
}
class _EditProfileFormState extends State<EditProfileForm> {
@ -98,6 +98,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
name: EditProfileForm.formFieldAvailability,
initialValue: initialValue,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_availability'),
hintText: translate('account.empty_busy_message')),
@ -110,7 +111,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
Text(x == proto.Availability.AVAILABILITY_OFFLINE
? translate('availability.always_show_offline')
: AvailabilityWidget.availabilityName(x))
.paddingLTRB(8, 0, 0, 0),
.paddingLTRB(8.scaled(context), 0, 0, 0),
])))
.toList(),
);
@ -175,17 +176,8 @@ class _EditProfileFormState extends State<EditProfileForm> {
BuildContext context,
) {
final theme = Theme.of(context);
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
final textTheme = theme.textTheme;
late final Color border;
if (scaleConfig.useVisualIndicators && !scaleConfig.preferBorders) {
border = scale.primaryScale.elementBackground;
} else {
border = scale.primaryScale.border;
}
return FormBuilder(
key: _formKey,
autovalidateMode: AutovalidateMode.onUserInteraction,
@ -197,14 +189,9 @@ class _EditProfileFormState extends State<EditProfileForm> {
children: [
Row(children: [
const Spacer(),
AvatarWidget(
StyledAvatar(
name: _currentValueName,
size: 128,
borderColor: border,
foregroundColor: scale.primaryScale.primaryText,
backgroundColor: scale.primaryScale.primary,
scaleConfig: scaleConfig,
textStyle: theme.textTheme.titleLarge!.copyWith(fontSize: 64),
size: 128.scaled(context),
).paddingLTRB(0, 0, 0, 16),
const Spacer()
]),
@ -218,6 +205,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
});
},
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_name'),
hintText: translate('account.empty_name')),
@ -233,6 +221,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
initialValue: _savedValue.pronouns,
maxLength: 64,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_pronouns'),
hintText: translate('account.empty_pronouns')),
@ -245,6 +234,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
maxLines: 8,
minLines: 1,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_about'),
hintText: translate('account.empty_about')),
@ -256,6 +246,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
initialValue: _savedValue.freeMessage,
maxLength: 128,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_free_message'),
hintText: translate('account.empty_free_message')),
@ -266,6 +257,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
initialValue: _savedValue.awayMessage,
maxLength: 128,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_away_message'),
hintText: translate('account.empty_away_message')),
@ -276,6 +268,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
initialValue: _savedValue.busyMessage,
maxLength: 128,
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_busy_message'),
hintText: translate('account.empty_busy_message')),
@ -291,12 +284,13 @@ class _EditProfileFormState extends State<EditProfileForm> {
_currentValueAutoAway = v ?? false;
});
},
).paddingLTRB(0, 0, 0, 16),
).paddingLTRB(0, 0, 0, 16.scaled(context)),
FormBuilderTextField(
name: EditProfileForm.formFieldAutoAwayTimeout,
enabled: _currentValueAutoAway,
initialValue: _savedValue.autoAwayTimeout.toString(),
decoration: InputDecoration(
contentPadding: const EdgeInsets.all(8).scaled(context),
labelText: translate('account.form_auto_away_timeout'),
),
validator: FormBuilderValidators.positiveNumber(),
@ -306,7 +300,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
const Spacer(),
Text(widget.instructions).toCenter().flexible(flex: 6),
const Spacer(),
]).paddingSymmetric(vertical: 16),
]).paddingSymmetric(vertical: 16.scaled(context)),
Row(children: [
const Spacer(),
Builder(builder: (context) {
@ -319,17 +313,19 @@ class _EditProfileFormState extends State<EditProfileForm> {
false;
return ElevatedButton(
onPressed: (networkReady && _isModified) ? _doSubmit : null,
child: Row(mainAxisSize: MainAxisSize.min, children: [
Icon(networkReady ? Icons.check : Icons.hourglass_empty,
size: 16)
.paddingLTRB(0, 0, 4, 0),
Text(networkReady
? widget.submitText
: widget.submitDisabledText)
.paddingLTRB(0, 0, 4, 0)
]),
);
onPressed: (networkReady && _isModified) ? _doSubmit : null,
child: Padding(
padding: EdgeInsetsGeometry.all(4.scaled(context)),
child: Row(mainAxisSize: MainAxisSize.min, children: [
Icon(networkReady ? Icons.check : Icons.hourglass_empty,
size: 16.scaled(context))
.paddingLTRB(0, 0, 4.scaled(context), 0),
Text(networkReady
? widget.submitText
: widget.submitDisabledText)
.paddingLTRB(0, 0, 4.scaled(context), 0)
]),
));
}),
const Spacer()
])
@ -363,5 +359,5 @@ class _EditProfileFormState extends State<EditProfileForm> {
late AccountSpec _savedValue;
late bool _currentValueAutoAway;
late String _currentValueName;
bool _isModified = false;
var _isModified = false;
}

View file

@ -94,6 +94,7 @@ class _NewAccountPageState extends WindowSetupState<NewAccountPage> {
return StyledScaffold(
appBar: DefaultAppBar(
context: context,
title: Text(translate('new_account_page.titlebar')),
leading: GoRouterHelper(context).canPop()
? IconButton(
@ -111,6 +112,7 @@ class _NewAccountPageState extends WindowSetupState<NewAccountPage> {
const SignalStrengthMeterWidget(),
IconButton(
icon: const Icon(Icons.settings),
iconSize: 24.scaled(context),
tooltip: translate('menu.settings_tooltip'),
onPressed: () async {
await GoRouterHelper(context).push('/settings');

View file

@ -164,6 +164,7 @@ class _ShowRecoveryKeyPageState extends WindowSetupState<ShowRecoveryKeyPage> {
return StyledScaffold(
appBar: DefaultAppBar(
context: context,
title: Text(translate('show_recovery_key_page.titlebar')),
actions: [
const SignalStrengthMeterWidget(),
@ -193,7 +194,7 @@ class _ShowRecoveryKeyPageState extends WindowSetupState<ShowRecoveryKeyPage> {
textAlign: TextAlign.center,
translate('show_recovery_key_page.instructions_options'))
.paddingLTRB(12, 0, 12, 24),
OptionBox(
StyledButtonBox(
instructions:
translate('show_recovery_key_page.instructions_print'),
buttonIcon: Icons.print,
@ -209,7 +210,7 @@ class _ShowRecoveryKeyPageState extends WindowSetupState<ShowRecoveryKeyPage> {
_codeHandled = true;
});
}),
OptionBox(
StyledButtonBox(
instructions:
translate('show_recovery_key_page.instructions_view'),
buttonIcon: Icons.edit_document,
@ -229,7 +230,7 @@ class _ShowRecoveryKeyPageState extends WindowSetupState<ShowRecoveryKeyPage> {
_codeHandled = true;
});
}),
OptionBox(
StyledButtonBox(
instructions:
translate('show_recovery_key_page.instructions_share'),
buttonIcon: Icons.ios_share,