fix: styling, fix: warningbox not showing explanation

GoodDollar · Nov 26, 2024 · 70c2bc8 · 70c2bc8
1 parent 717d136
commit 70c2bc8
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/packages/app/src/components/DonateComponent.tsx b/packages/app/src/components/DonateComponent.tsx
@@ -187,6 +187,8 @@ const DonateComponent = ({ collective }: DonateComponentProps) => {
     },
     xl: {
       maxWidth: '100%',
+      paddingLeft: 4,
+      paddingRight: 4,
     },
   });
 
@@ -522,7 +524,7 @@ const DonateComponent = ({ collective }: DonateComponentProps) => {
               )}
             </VStack>
             {/* Amount and token */}
-            <VStack space={2} maxW="320" mb={8}>
+            <VStack space={2} maxW="320" mb={8} zIndex={1}>
               <VStack space={2} zIndex={1}>
                 <Text variant="bold" fontSize="lg">
                   How much?
@@ -616,7 +618,7 @@ const DonateComponent = ({ collective }: DonateComponentProps) => {
                 return whichWarning ? (
                   <WarningBox
                     key={key}
-                    explanationProps={priceImpact}
+                    explanationProps={key === 'priceImpact' ? { priceImpact: priceImpact } : { type: key }}
                     content={warningProps[key as keyof typeof warningProps]}
                   />
                 ) : null;

diff --git a/packages/app/src/components/NumberInput.tsx b/packages/app/src/components/NumberInput.tsx
@@ -45,7 +45,7 @@ const NumberInput = ({
         padding={2}
         paddingRight={4}
         space={4}
-        maxWidth={290}>
+        maxWidth={type === 'duration' ? 290 : '100%'}>
         {type === 'token' ? <Dropdown value={dropdownValue} onSelect={onSelect} options={options} /> : <Box />}
         <HStack alignItems="center" flexGrow={1} justifyContent="flex-end">
           <HStack justifyContent="flex-end">