mirror of
https://gitlab.com/veilid/veilidchat.git
synced 2025-07-22 06:08:54 -04:00
Accessibility update
This commit is contained in:
parent
be8014c97a
commit
3b1cb53b8a
55 changed files with 1089 additions and 807 deletions
|
@ -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,
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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');
|
||||
|
|
|
@ -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,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue