From 7f6b73704748e806c9ed79c9f3d3c18dc8057c50 Mon Sep 17 00:00:00 2001
From: Katie Rischpater <98350084+the-bay-kay@users.noreply.github.com>
Date: Thu, 28 Sep 2023 14:23:20 -0700
Subject: [PATCH 1/4] Recentered & Resized "inferred trip" checkmark See [Issue
 #979](https://github.com/e-mission/e-mission-docs/issues/979#issuecomment-1736386591)
 for more details. Only slight difference in comment; removed the `-0.2rem` in
 this commit, the buttons look crowded otherwise.

---
 www/js/survey/multilabel/MultiLabelButtonGroup.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
index cb14c61ea..268d16eb7 100644
--- a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
+++ b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
@@ -100,10 +100,10 @@ const MultilabelButtonGroup = ({ trip, buttonsInline=false }) => {
           )
         })}
       </View>
-      <View>
-        <IconButton icon='check-bold' mode='outlined' size={16} onPress={verifyTrip}
+      <View style={{marginTop:'1rem'}}>
+        <IconButton icon='check-bold' mode='outlined' size={18} onPress={verifyTrip}
                     disabled={trip.verifiability != 'can-verify'}
-                    style={{width: 20, height: 20, margin: 3}}/>
+                    style={{width: 24, height: 24, margin: 3}}/>
       </View>
     </View>
     <Modal visible={modalVisibleFor != null} transparent={true} onDismiss={() => dismiss()}>

From d3f8970ef8e6f27d1e56b7b94d7ae02e3b8ebbd1 Mon Sep 17 00:00:00 2001
From: Katie Rischpater <98350084+the-bay-kay@users.noreply.github.com>
Date: Mon, 2 Oct 2023 10:40:04 -0700
Subject: [PATCH 2/4] Checkmark dynamically appears, color matches

Updated the button to only appear if you can verify the trip.
Button color now matches the "inferred trip" data.
---
 www/js/survey/multilabel/MultiLabelButtonGroup.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
index 268d16eb7..33842f48c 100644
--- a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
+++ b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
@@ -100,11 +100,12 @@ const MultilabelButtonGroup = ({ trip, buttonsInline=false }) => {
           )
         })}
       </View>
-      <View style={{marginTop:'1rem'}}>
-        <IconButton icon='check-bold' mode='outlined' size={18} onPress={verifyTrip}
-                    disabled={trip.verifiability != 'can-verify'}
-                    style={{width: 24, height: 24, margin: 3}}/>
-      </View>
+      {trip.verifiability === 'can-verify' && (
+        <View style={{marginTop:'1rem'}}>
+          <IconButton icon='check-bold' mode='outlined' size={18} onPress={verifyTrip}
+                       style={{width: 24, height: 24, margin: 3, backgroundColor: colors.secondaryContainer}}/>
+        </View>
+      )}
     </View>
     <Modal visible={modalVisibleFor != null} transparent={true} onDismiss={() => dismiss()}>
       <Dialog visible={modalVisibleFor != null} onDismiss={() => dismiss()}>

From 6262d2e6d80a2bff87132649dd4882215f8b3299 Mon Sep 17 00:00:00 2001
From: Katie Rischpater <98350084+the-bay-kay@users.noreply.github.com>
Date: Tue, 3 Oct 2023 08:17:57 -0700
Subject: [PATCH 3/4] Update www/js/survey/multilabel/MultiLabelButtonGroup.tsx

See conversation in PR
 `rem` doesn't work properly in react-native, updated

Co-authored-by: Jack Greenlee <JackAGreenlee@gmail.com>
---
 www/js/survey/multilabel/MultiLabelButtonGroup.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
index 33842f48c..ecfcf7ea6 100644
--- a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
+++ b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
@@ -101,7 +101,7 @@ const MultilabelButtonGroup = ({ trip, buttonsInline=false }) => {
         })}
       </View>
       {trip.verifiability === 'can-verify' && (
-        <View style={{marginTop:'1rem'}}>
+        <View style={{marginTop: 16}}>
           <IconButton icon='check-bold' mode='outlined' size={18} onPress={verifyTrip}
                        style={{width: 24, height: 24, margin: 3, backgroundColor: colors.secondaryContainer}}/>
         </View>

From 9c36f7dfb894122810165443f97c1c4d27d306a1 Mon Sep 17 00:00:00 2001
From: Katie Rischpater <98350084+the-bay-kay@users.noreply.github.com>
Date: Tue, 3 Oct 2023 08:19:43 -0700
Subject: [PATCH 4/4] Update www/js/survey/multilabel/MultiLabelButtonGroup.tsx

iconButtonProp & Border Color
Changed prop to use native property, adjusted border color.

Co-authored-by: Jack Greenlee <JackAGreenlee@gmail.com>
---
 www/js/survey/multilabel/MultiLabelButtonGroup.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
index ecfcf7ea6..0ce031bee 100644
--- a/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
+++ b/www/js/survey/multilabel/MultiLabelButtonGroup.tsx
@@ -103,7 +103,8 @@ const MultilabelButtonGroup = ({ trip, buttonsInline=false }) => {
       {trip.verifiability === 'can-verify' && (
         <View style={{marginTop: 16}}>
           <IconButton icon='check-bold' mode='outlined' size={18} onPress={verifyTrip}
-                       style={{width: 24, height: 24, margin: 3, backgroundColor: colors.secondaryContainer}}/>
+                      containerColor={colors.secondaryContainer}
+                      style={{width: 24, height: 24, margin: 3, borderColor: colors.secondary}} />
         </View>
       )}
     </View>