poll: Enlarge and vetically 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]>

Author: PIG208

lib/widgets/poll.dart

@@ -46,6 +46,8 @@ class _PollWidgetState extends State<PollWidget> {
 
   @override
   Widget build(BuildContext context) {
+    const verticalPadding = 2.5;
+
     final zulipLocalizations = ZulipLocalizations.of(context);
     final theme = ContentTheme.of(context);
     final store = PerAccountStoreWidget.of(context);
@@ -73,10 +75,10 @@ class _PollWidgetState extends State<PollWidget> {
         textBaseline: localizedTextBaseline(context),
         children: [
           ConstrainedBox(
-            constraints: const BoxConstraints(
-              minWidth: 25 + 5, minHeight: 25 + 5),
+            constraints: const BoxConstraints(minWidth: 44, minHeight: 44),
             child: Padding(
-              padding: const EdgeInsetsDirectional.only(bottom: 5, end: 5),
+              padding: const EdgeInsetsDirectional.only(
+                end: 5, top: verticalPadding, bottom: verticalPadding),
               child: Container(
                 // Inner padding preserves whitespace even when the text's
                 // width approaches the button's min-width (e.g. because
@@ -89,14 +91,14 @@ class _PollWidgetState extends State<PollWidget> {
                 child: Center(
                   child: Text(option.voters.length.toString(),
                     style: textStyleBold.copyWith(
-                      color: theme.colorPollVoteCountText, fontSize: 13)))))),
+                      color: theme.colorPollVoteCountText, fontSize: 20)))))),
           Expanded(
             child: Padding(
-              // This and the bottom padding on the vote count box both extend
-              // the row by the same extent. This ensures that there still will
-              // be consistent spacing between rows when the text takes more
+              // This and the padding on the vote count box both extend the row
+              // by the same extent. This ensures that there still will be
+              // consistent spacing between rows when the text takes more
               // vertical space than the vote count box.
-              padding: const EdgeInsets.only(bottom: 5),
+              padding: const EdgeInsets.symmetric(vertical: verticalPadding),
               child: Wrap(
                 spacing: 5,
                 children: [
@@ -108,18 +110,26 @@ class _PollWidgetState extends State<PollWidget> {
         ]);
     }
 
-    return Column(
-      crossAxisAlignment: CrossAxisAlignment.start,
-      children: [
-        Padding(padding: const EdgeInsets.only(bottom: 6), child: question),
-        if (widget.poll.options.isEmpty)
+    return Padding(
+      // `verticalPadding` out of 5 logical pixels
+      // come from the last option row.
+      padding: const EdgeInsets.only(bottom: 5 - verticalPadding),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
           Padding(
-            // This is consistent with the option rows' bottom padding.
-            padding: const EdgeInsets.only(bottom: 5),
-            child: Text(zulipLocalizations.pollWidgetOptionsMissing,
-              style: textStyleVoterNames.copyWith(fontStyle: FontStyle.italic))),
-        for (final option in widget.poll.options)
-          buildOptionItem(option),
-      ]);
+            // `verticalPadding` out of 6 logical pixels
+            // come from the first option row.
+            padding: const EdgeInsets.only(bottom: 6 - verticalPadding),
+            child: question),
+          if (widget.poll.options.isEmpty)
+            Padding(
+              // This is consistent with the option rows' padding.
+              padding: const EdgeInsets.symmetric(vertical: verticalPadding),
+              child: Text(zulipLocalizations.pollWidgetOptionsMissing,
+                style: textStyleVoterNames.copyWith(fontStyle: FontStyle.italic))),
+          for (final option in widget.poll.options)
+            buildOptionItem(option),
+        ]));
   }
 }