Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2024-11-17 01:37:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

paynym mobile ui sizing changes

Browse source
This commit is contained in:
julian 2023-02-01 15:02:41 -06:00
parent b64ffe91b7
commit 6a07672437
9 changed files with 146 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
lib/pages/paynym/dialogs/paynym_details_popup.dart
View file

@ -176,7 +176,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
children: [
PayNymBot(
paymentCodeString: widget.accountLite.code,
size: 32,
size: 36,
),
const SizedBox(
width: 12,
@ -186,7 +186,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
children: [
Text(
widget.accountLite.nymName,
style: STextStyles.w600_12(context),
style: STextStyles.w600_14(context),
),
FutureBuilder(
future:
@ -204,7 +204,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
),
Text(
"Connected",
style: STextStyles.w500_10(context)
style: STextStyles.w500_12(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
@ -230,33 +230,33 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
if (snapshot.data!) {
return PrimaryButton(
label: "Send",
buttonHeight: ButtonHeight.l,
buttonHeight: ButtonHeight.xl,
icon: SvgPicture.asset(
Assets.svg.circleArrowUpRight,
width: 10,
height: 10,
width: 14,
height: 14,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextPrimary,
),
iconSpacing: 4,
width: 86,
iconSpacing: 8,
width: 100,
onPressed: _onSend,
);
} else {
return PrimaryButton(
label: "Connect",
buttonHeight: ButtonHeight.l,
buttonHeight: ButtonHeight.xl,
icon: SvgPicture.asset(
Assets.svg.circlePlusFilled,
width: 10,
height: 10,
width: 13,
height: 13,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextPrimary,
),
iconSpacing: 4,
width: 86,
iconSpacing: 8,
width: 128,
onPressed: _onConnectPressed,
);
}
@ -291,6 +291,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
color: Theme.of(context)
.extension<StackColors>()!
.warningForeground,
fontSize: 12,
),
),
),
@ -321,7 +322,9 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
children: [
Text(
"PayNym address",
style: STextStyles.infoSmall(context),
style: STextStyles.infoSmall(context).copyWith(
fontSize: 12,
),
),
const SizedBox(
height: 6,
@ -332,6 +335,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
fontSize: 12,
),
),
const SizedBox(
@ -346,7 +350,7 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
),
QrImage(
padding: const EdgeInsets.all(0),
size: 86,
size: 100,
data: widget.accountLite.code,
foregroundColor:
Theme.of(context).extension<StackColors>()!.textDark,
@ -375,16 +379,16 @@ class _PaynymDetailsPopupState extends ConsumerState<PaynymDetailsPopup> {
Expanded(
child: SecondaryButton(
label: "Copy",
buttonHeight: ButtonHeight.l,
buttonHeight: ButtonHeight.xl,
iconSpacing: 8,
icon: SvgPicture.asset(
Assets.svg.copy,
width: 10,
height: 10,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextSecondary,
),
iconSpacing: 4,
onPressed: () async {
await Clipboard.setData(
ClipboardData(

15
lib/pages/paynym/dialogs/paynym_qr_popup.dart
View file

@ -56,7 +56,7 @@ class PaynymQrPopup extends StatelessWidget {
children: [
PayNymBot(
paymentCodeString: paynymAccount.codes.first.code,
size: isDesktop ? 56 : 32,
size: isDesktop ? 56 : 36,
),
const SizedBox(
width: 12,
@ -65,7 +65,7 @@ class PaynymQrPopup extends StatelessWidget {
paynymAccount.nymName,
style: isDesktop
? STextStyles.w500_24(context)
: STextStyles.w600_12(context),
: STextStyles.w600_14(context),
),
],
),
@ -87,7 +87,7 @@ class PaynymQrPopup extends StatelessWidget {
children: [
Expanded(
child: ConstrainedBox(
constraints: const BoxConstraints(minHeight: 107),
constraints: const BoxConstraints(minHeight: 130),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -100,7 +100,9 @@ class PaynymQrPopup extends StatelessWidget {
.extension<StackColors>()!
.textSubtitle1,
)
: STextStyles.infoSmall(context),
: STextStyles.infoSmall(context).copyWith(
fontSize: 12,
),
),
const SizedBox(
height: 6,
@ -113,6 +115,7 @@ class PaynymQrPopup extends StatelessWidget {
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
fontSize: 12,
),
),
const SizedBox(
@ -120,7 +123,7 @@ class PaynymQrPopup extends StatelessWidget {
),
CustomTextButton(
text: "Copy",
textSize: isDesktop ? 18 : 10,
textSize: isDesktop ? 18 : 14,
onTap: () async {
await Clipboard.setData(
ClipboardData(
@ -146,7 +149,7 @@ class PaynymQrPopup extends StatelessWidget {
),
QrImage(
padding: const EdgeInsets.all(0),
size: 107,
size: 130,
data: paynymAccount.codes.first.code,
foregroundColor:
Theme.of(context).extension<StackColors>()!.textDark,

30
lib/pages/paynym/paynym_home_view.dart
View file

@ -303,7 +303,9 @@ class _PaynymHomeViewState extends ConsumerState<PaynymHomeView> {
.code,
12,
5),
style: STextStyles.label(context),
style: STextStyles.label(context).copyWith(
fontSize: 14,
),
),
const SizedBox(
height: 11,
@ -313,11 +315,11 @@ class _PaynymHomeViewState extends ConsumerState<PaynymHomeView> {
Expanded(
child: SecondaryButton(
label: "Copy",
buttonHeight: ButtonHeight.l,
iconSpacing: 4,
buttonHeight: ButtonHeight.xl,
iconSpacing: 8,
icon: CopyIcon(
width: 10,
height: 10,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
@ -350,11 +352,11 @@ class _PaynymHomeViewState extends ConsumerState<PaynymHomeView> {
Expanded(
child: SecondaryButton(
label: "Share",
buttonHeight: ButtonHeight.l,
iconSpacing: 4,
buttonHeight: ButtonHeight.xl,
iconSpacing: 8,
icon: ShareIcon(
width: 10,
height: 10,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
@ -387,11 +389,11 @@ class _PaynymHomeViewState extends ConsumerState<PaynymHomeView> {
Expanded(
child: SecondaryButton(
label: "Address",
buttonHeight: ButtonHeight.l,
iconSpacing: 4,
buttonHeight: ButtonHeight.xl,
iconSpacing: 8,
icon: QrCodeIcon(
width: 10,
height: 10,
width: 12,
height: 12,
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
@ -554,7 +556,7 @@ class _PaynymHomeViewState extends ConsumerState<PaynymHomeView> {
child: child,
),
child: SizedBox(
height: isDesktop ? 56 : 40,
height: isDesktop ? 56 : 48,
width: isDesktop ? 490 : null,
child: Toggle(
onColor: Theme.of(context).extension<StackColors>()!.popupBG,

2
lib/pages/paynym/subwidgets/desktop_paynym_details.dart
View file

@ -171,7 +171,7 @@ class _PaynymDetailsPopupState extends ConsumerState<DesktopPaynymDetails> {
children: [
PayNymBot(
paymentCodeString: widget.accountLite.code,
size: 32,
size: 36,
),
const SizedBox(
width: 12,

6
lib/pages/paynym/subwidgets/paynym_card.dart
View file

@ -37,7 +37,7 @@ class _PaynymCardState extends State<PaynymCard> {
child: Row(
children: [
PayNymBot(
size: 32,
size: 36,
paymentCodeString: widget.paymentCodeString,
),
const SizedBox(
@ -56,7 +56,7 @@ class _PaynymCardState extends State<PaynymCard> {
.extension<StackColors>()!
.textFieldActiveText,
)
: STextStyles.w500_12(context),
: STextStyles.w500_14(context),
),
const SizedBox(
height: 2,
@ -65,7 +65,7 @@ class _PaynymCardState extends State<PaynymCard> {
Format.shorten(widget.paymentCodeString, 12, 5),
style: isDesktop
? STextStyles.desktopTextExtraExtraSmall(context)
: STextStyles.w500_12(context).copyWith(
: STextStyles.w500_14(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle1,

6
lib/pages/paynym/subwidgets/paynym_card_button.dart
View file

@ -77,7 +77,7 @@ class _PaynymCardButtonState extends ConsumerState<PaynymCardButton> {
child: Row(
children: [
PayNymBot(
size: 32,
size: 36,
paymentCodeString: widget.accountLite.code,
),
const SizedBox(
@ -96,7 +96,7 @@ class _PaynymCardButtonState extends ConsumerState<PaynymCardButton> {
.extension<StackColors>()!
.textFieldActiveText,
)
: STextStyles.w500_12(context),
: STextStyles.w500_14(context),
),
const SizedBox(
height: 2,
@ -105,7 +105,7 @@ class _PaynymCardButtonState extends ConsumerState<PaynymCardButton> {
Format.shorten(widget.accountLite.code, 12, 5),
style: isDesktop
? STextStyles.desktopTextExtraExtraSmall(context)
: STextStyles.w500_12(context).copyWith(
: STextStyles.w500_14(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle1,

80
lib/utilities/text_styles.dart
View file

@ -13,31 +13,31 @@ class STextStyles {
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 12,
fontSize: 14,
);
case ThemeType.oceanBreeze:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 12,
fontSize: 14,
);
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 12,
fontSize: 14,
);
case ThemeType.oledBlack:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 12,
fontSize: 14,
);
case ThemeType.fruitSorbet:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 12,
fontSize: 14,
);
}
}
@ -932,6 +932,76 @@ class STextStyles {
}
}
static TextStyle w600_14(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 14,
);
case ThemeType.oceanBreeze:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 14,
);
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 14,
);
case ThemeType.oledBlack:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 14,
);
case ThemeType.fruitSorbet:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 14,
);
}
}
static TextStyle w500_14(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
case ThemeType.oceanBreeze:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
case ThemeType.oledBlack:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
case ThemeType.fruitSorbet:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
}
}
static TextStyle w500_12(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:

12
lib/widgets/custom_buttons/paynym_follow_toggle_button.dart
View file

@ -272,8 +272,8 @@ class _PaynymFollowToggleButtonState
switch (widget.style) {
case PaynymFollowToggleButtonStyle.primary:
return PrimaryButton(
width: isDesktop ? 120 : 84,
buttonHeight: isDesktop ? ButtonHeight.s : ButtonHeight.l,
width: isDesktop ? 120 : 100,
buttonHeight: isDesktop ? ButtonHeight.s : ButtonHeight.xl,
label: isFollowing ? "Unfollow" : "Follow",
onPressed: _onPressed,
);
@ -281,15 +281,15 @@ class _PaynymFollowToggleButtonState
case PaynymFollowToggleButtonStyle.detailsPopup:
return SecondaryButton(
label: isFollowing ? "Unfollow" : "Follow",
buttonHeight: ButtonHeight.l,
buttonHeight: ButtonHeight.xl,
iconSpacing: 8,
icon: SvgPicture.asset(
isFollowing ? Assets.svg.userMinus : Assets.svg.userPlus,
width: 10,
height: 10,
width: 16,
height: 16,
color:
Theme.of(context).extension<StackColors>()!.buttonTextSecondary,
),
iconSpacing: 4,
onPressed: _onPressed,
);

10
lib/widgets/desktop/secondary_button.dart
View file

@ -78,6 +78,16 @@ class SecondaryButton extends StatelessWidget {
.buttonTextSecondaryDisabled,
);
}
if (buttonHeight == ButtonHeight.xl) {
return STextStyles.button(context).copyWith(
fontSize: 14,
color: enabled
? Theme.of(context).extension<StackColors>()!.buttonTextSecondary
: Theme.of(context)
.extension<StackColors>()!
.buttonTextSecondaryDisabled,
);
}
return STextStyles.button(context).copyWith(
color: enabled
? Theme.of(context).extension<StackColors>()!.buttonTextSecondary