remove gap

helium · Nov 30, 2023 · a4d9fb4 · a4d9fb4
1 parent a584326
commit a4d9fb4
Show file tree

Hide file tree

Showing 12 changed files with 170 additions and 167 deletions.
diff --git a/package.json b/package.json
@@ -90,7 +90,7 @@
     "@react-navigation/stack": "6.2.2",
     "@reduxjs/toolkit": "1.9.1",
     "@rnmapbox/maps": "10.0.7-rc.0",
-    "@shopify/restyle": "^2.4.2",
+    "@shopify/restyle": "1.8.0",
     "@solana/spl-account-compression": "0.1.4",
     "@solana/spl-memo": "0.2.3",
     "@solana/spl-token": "0.3.6",

diff --git a/src/components/TextTransform.tsx b/src/components/TextTransform.tsx
@@ -36,6 +36,7 @@ type Props = TextProps<Theme> & {
   maxFontSizeMultiplier?: number
   colorTextVariant?: ResponsiveValue<TextVariant, Theme>
 }
+
 const TextTransform = ({
   i18nKey,
   values,

diff --git a/src/features/governance/DelegateTokensModal.tsx b/src/features/governance/DelegateTokensModal.tsx
@@ -107,14 +107,15 @@ export const DelegateTokensModal = ({
                   </Text>
                 </Box>
               )}
-              <Box gap="m">
-                {subDaos?.map((subDao) => {
+              <Box>
+                {subDaos?.map((subDao, idx) => {
                   const isSelected = selectedSubDaoPk?.equals(subDao.pubkey)
 
                   return (
                     <TouchableOpacityBox
                       key={subDao.pubkey.toString()}
                       borderRadius="l"
+                      marginBottom={idx > 0 ? 'm' : 'none'}
                       backgroundColor={
                         isSelected ? 'secondaryBackground' : 'secondary'
                       }

diff --git a/src/features/governance/LockTokensModal.tsx b/src/features/governance/LockTokensModal.tsx
@@ -289,8 +289,8 @@ export const LockTokensModal = ({
                                   <InfoIcon width={20} />
                                 </TouchableOpacityBox>
                               </Box>
-                              <Box flexDirection="row" gap="ms">
-                                {lockupKindOptions.map((option) => {
+                              <Box flexDirection="row">
+                                {lockupKindOptions.map((option, idx) => {
                                   const isActive =
                                     option.value === lockupKind.value
 
@@ -301,6 +301,7 @@ export const LockTokensModal = ({
                                       padding="s"
                                       alignItems="center"
                                       borderRadius="m"
+                                      marginLeft={idx > 0 ? 'ms' : 'none'}
                                       backgroundColor={
                                         isActive
                                           ? 'surfaceSecondary'
@@ -388,11 +389,11 @@ export const LockTokensModal = ({
                               </TouchableOpacityBox>
                             </Box>
                           ) : null}
-                          <Box flexDirection="row" flexWrap="wrap" gap="ms">
+                          <Box flexDirection="row" flexWrap="wrap">
                             {(hasMinLockup
                               ? [...lockupPeriodOptions.splice(1)]
                               : lockupPeriodOptions
-                            ).map((option) => {
+                            ).map((option, idx) => {
                               const isActive =
                                 option.value === lockupPeriod.value
 
@@ -403,6 +404,7 @@ export const LockTokensModal = ({
                                   padding="s"
                                   alignItems="center"
                                   borderRadius="m"
+                                  marginLeft={idx > 0 ? 'ms' : 'none'}
                                   backgroundColor={
                                     isActive ? 'surfaceSecondary' : 'black500'
                                   }

diff --git a/src/features/governance/PositionsList.tsx b/src/features/governance/PositionsList.tsx
@@ -68,11 +68,12 @@ export const PositionsList = ({
           </Text>
         </Box>
       </Box>
-      <Box gap="m">
-        {sortedPositions?.map((p) => (
+      <Box>
+        {sortedPositions?.map((p, idx) => (
           <PositionCard
             key={`${p.pubkey.toBase58()}`}
             position={p}
+            marginTop={idx > 0 ? 'm' : 'none'}
             subDaos={subDaos}
           />
         ))}

diff --git a/src/features/governance/ProposalCard.tsx b/src/features/governance/ProposalCard.tsx
@@ -157,24 +157,24 @@ export const ProposalCard = ({
                 {proposal?.name}
               </Text>
             </Box>
-            <Box flexDirection="row" marginLeft="s" gap="s">
+            <Box flexDirection="row">
               {proposal?.tags
                 .filter((tag) => tag !== 'tags')
                 .map((tag) => (
-                  <Box key={tag}>
-                    <Box
-                      padding="s"
-                      backgroundColor={
-                        tag.toLowerCase().includes('temp check')
-                          ? 'orange500'
-                          : 'surfaceSecondary'
-                      }
-                      borderRadius="m"
-                    >
-                      <Text fontSize={10} color="secondaryText">
-                        {tag.toUpperCase()}
-                      </Text>
-                    </Box>
+                  <Box
+                    key={tag}
+                    marginLeft="s"
+                    padding="s"
+                    backgroundColor={
+                      tag.toLowerCase().includes('temp check')
+                        ? 'orange500'
+                        : 'surfaceSecondary'
+                    }
+                    borderRadius="m"
+                  >
+                    <Text fontSize={10} color="secondaryText">
+                      {tag.toUpperCase()}
+                    </Text>
                   </Box>
                 ))}
             </Box>

diff --git a/src/features/governance/ProposalScreen.tsx b/src/features/governance/ProposalScreen.tsx
@@ -220,12 +220,13 @@ export const ProposalScreen = () => {
               borderRadius="l"
               padding="m"
             >
-              <Box flexDirection="row" gap="s">
+              <Box flexDirection="row">
                 {proposal?.tags
                   .filter((tag) => tag !== 'tags')
-                  .map((tag) => (
+                  .map((tag, idx) => (
                     <Box
                       key={tag}
+                      marginLeft={idx > 0 ? 's' : 'none'}
                       padding="s"
                       backgroundColor={
                         tag.toLowerCase().includes('temp check')
@@ -286,10 +287,13 @@ export const ProposalScreen = () => {
                     backgroundColor="secondaryBackground"
                     borderRadius="l"
                     paddingTop="m"
-                    gap="s"
                   >
-                    {votingResults.results?.map((r) => (
-                      <Box key={r.name} flex={1}>
+                    {votingResults.results?.map((r, idx) => (
+                      <Box
+                        key={r.name}
+                        flex={1}
+                        marginTop={idx > 0 ? 's' : 'none'}
+                      >
                         <Text
                           variant="body2"
                           color="primaryText"
@@ -367,10 +371,11 @@ export const ProposalScreen = () => {
                       </Text>
                     </Box>
                   )}
-                  <Box flex={1} flexDirection="row" flexWrap="wrap" gap="s">
-                    {votingResults.results?.map((r) => (
+                  <Box flex={1} flexDirection="row" flexWrap="wrap">
+                    {votingResults.results?.map((r, idx) => (
                       <VoteOption
                         key={r.name}
+                        marginLeft={idx % 2 === 0 ? 's' : 'none'}
                         voting={
                           currVote === r.index && (voting || relinquishing)
                         }

diff --git a/src/features/governance/ProposalsList.tsx b/src/features/governance/ProposalsList.tsx
@@ -88,24 +88,23 @@ export const ProposalsList = ({ ...boxProps }: IProposalsListProps) => {
           </TouchableOpacityBox>
         </Box>
         {loading && <ProposalCardSkeleton backgroundColor="transparent" />}
-        <Box gap="m">
-          {!loading &&
-            proposals
-              ?.filter((p) => Boolean(p.info))
-              .map((proposal) => (
-                <ProposalCard
-                  key={proposal.publicKey.toBase58()}
-                  filter={filter}
-                  proposal={proposal.info as ProposalV0}
-                  proposalKey={proposal.publicKey}
-                  onPress={async (p) =>
-                    navigation.push('ProposalScreen', {
-                      proposal: p.toBase58(),
-                    })
-                  }
-                />
-              ))}
-        </Box>
+        {!loading &&
+          proposals
+            ?.filter((p) => Boolean(p.info))
+            .map((proposal, idx) => (
+              <ProposalCard
+                key={proposal.publicKey.toBase58()}
+                filter={filter}
+                marginTop={idx > 0 ? 'm' : 'none'}
+                proposal={proposal.info as ProposalV0}
+                proposalKey={proposal.publicKey}
+                onPress={async (p) =>
+                  navigation.push('ProposalScreen', {
+                    proposal: p.toBase58(),
+                  })
+                }
+              />
+            ))}
       </Box>
       <BlurActionSheet
         title={t('gov.proposals.filterTitle')}