Skip to content

Commit 1db46de

Browse files
PIG208gnprice
authored andcommitted
poll: Enlarge and vertically center vote count box
Previously, there were only bottom and end paddings; we redistribute the vertical paddings so the vote count box is padded on both sides. The end padding remains 5px because we want to keep the options aligned to the start with the surrounding messages. This change also affects the poll question, where 2.5px of space gets moved to the first option row. Similarly, the end of the poll was previously padded by the last poll option alone. Now 2.5px of space gets moved to the `Padding` wrapping the entire `Column` of the poll. Signed-off-by: Zixuan James Li <[email protected]>
1 parent 0a53ade commit 1db46de

File tree

1 file changed

+17
-11
lines changed

1 file changed

+17
-11
lines changed

lib/widgets/poll.dart

Lines changed: 17 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,8 @@ class _PollWidgetState extends State<PollWidget> {
4646

4747
@override
4848
Widget build(BuildContext context) {
49+
const verticalPadding = 2.5;
50+
4951
final zulipLocalizations = ZulipLocalizations.of(context);
5052
final theme = ContentTheme.of(context);
5153
final store = PerAccountStoreWidget.of(context);
@@ -73,10 +75,10 @@ class _PollWidgetState extends State<PollWidget> {
7375
textBaseline: localizedTextBaseline(context),
7476
children: [
7577
ConstrainedBox(
76-
constraints: const BoxConstraints(
77-
minWidth: 25 + 5, minHeight: 25 + 5),
78+
constraints: const BoxConstraints(minWidth: 44, minHeight: 44),
7879
child: Padding(
79-
padding: const EdgeInsetsDirectional.only(bottom: 5, end: 5),
80+
padding: const EdgeInsetsDirectional.only(
81+
end: 5, top: verticalPadding, bottom: verticalPadding),
8082
child: Container(
8183
// Inner padding preserves whitespace even when the text's
8284
// width approaches the button's min-width (e.g. because
@@ -89,14 +91,14 @@ class _PollWidgetState extends State<PollWidget> {
8991
child: Center(
9092
child: Text(option.voters.length.toString(),
9193
style: textStyleBold.copyWith(
92-
color: theme.colorPollVoteCountText, fontSize: 13)))))),
94+
color: theme.colorPollVoteCountText, fontSize: 20)))))),
9395
Expanded(
9496
child: Padding(
95-
// This and the bottom padding on the vote count box both extend
96-
// the row by the same extent. This ensures that there still will
97-
// be consistent spacing between rows when the text takes more
97+
// This and the padding on the vote count box both extend the row
98+
// by the same extent. This ensures that there still will be
99+
// consistent spacing between rows when the text takes more
98100
// vertical space than the vote count box.
99-
padding: const EdgeInsets.only(bottom: 5),
101+
padding: const EdgeInsets.symmetric(vertical: verticalPadding),
100102
child: Wrap(
101103
spacing: 5,
102104
children: [
@@ -111,15 +113,19 @@ class _PollWidgetState extends State<PollWidget> {
111113
return Column(
112114
crossAxisAlignment: CrossAxisAlignment.start,
113115
children: [
114-
Padding(padding: const EdgeInsets.only(bottom: 6), child: question),
116+
question,
117+
// `verticalPadding` out of 6px comes from the first option row.
118+
const SizedBox(height: 6 - verticalPadding),
115119
if (widget.poll.options.isEmpty)
116120
Padding(
117-
// This is consistent with the option rows' bottom padding.
118-
padding: const EdgeInsets.only(bottom: 5),
121+
// This is consistent with the option rows' padding.
122+
padding: const EdgeInsets.symmetric(vertical: verticalPadding),
119123
child: Text(zulipLocalizations.pollWidgetOptionsMissing,
120124
style: textStyleVoterNames.copyWith(fontStyle: FontStyle.italic))),
121125
for (final option in widget.poll.options)
122126
buildOptionItem(option),
127+
// `verticalPadding` out of 5px comes from the last option row.
128+
const SizedBox(height: 5 - verticalPadding),
123129
]);
124130
}
125131
}

0 commit comments

Comments
 (0)