[Dashboard] Fix HStack

apps/dashboard/src/app/team/[team_slug]/(team)/~/usage/UsagePage.tsx

@@ -23,7 +23,7 @@ export const SettingsUsagePage = () => {
     <div className="flex flex-col gap-8">
       <div className="flex flex-col">
         <h1 className="mb-2 font-semibold text-3xl tracking-tight">Usage</h1>
-        <div className="flex flex-col items-start justify-between lg:flex-row lg:items-center">
+        <div className="flex flex-col items-start justify-between gap-2 lg:flex-row lg:items-center">
           <BillingPlan account={account} />
           <BillingPeriod account={account} usage={usageQuery.data} />
         </div>

apps/dashboard/src/components/onboarding/Steps.tsx

@@ -283,7 +283,7 @@ export const OnboardingSteps: React.FC<OnboardingStepsProps> = ({
       >
         <Heading size="title.sm">{title}</Heading>
         <Text>{description}</Text>
-        <div className="mt-4 flex flex-row items-center">
+        <div className="mt-4 flex flex-row items-center gap-2">
           {isLoggedIn ? (
             <Button
               size="sm"

apps/dashboard/src/components/settings/Account/AccountForm.tsx

@@ -220,7 +220,7 @@ export const AccountForm: React.FC<AccountFormProps> = ({
 
         <div
           className={cn(
-            "flex w-full flex-row",
+            "flex w-full flex-row items-center gap-2",
             showBillingButton ? "justify-between" : "justify-end",
           )}
         >

apps/dashboard/src/components/settings/Account/Billing/DowngradeDialog.tsx

@@ -65,7 +65,7 @@ export const BillingDowngradeDialog: React.FC<BillingDowngradeDialogProps> = ({
                 <Flex flexDir="column" gap={2}>
                   {oldPlanFeatures.map((feat) => (
                     <div
-                      className="flex flex-row"
+                      className="flex flex-row items-center gap-2"
                       key={Array.isArray(feat) ? feat[0] : feat}
                     >
                       <Icon as={FiX} boxSize={4} color="red.500" />

apps/dashboard/src/components/settings/Account/Billing/Header.tsx

@@ -17,7 +17,7 @@ export const BillingHeader: React.FC<BillingHeaderProps> = ({
         Billing Info
       </Heading>
 
-      <div className="flex flex-row">
+      <div className="flex flex-row items-center gap-2">
         <Text size="body.md">
           Manage your payment methods, billing information and invoices.
         </Text>
@@ -29,7 +29,7 @@ export const BillingHeader: React.FC<BillingHeaderProps> = ({
           py={1.5}
           textTransform="capitalize"
         >
-          <span className="flex flex-row">
+          <span className="flex flex-row items-center gap-2">
             <Icon
               as={
                 validPayment

apps/dashboard/src/components/settings/Account/Billing/Plan.tsx

@@ -20,7 +20,7 @@ export const BillingPlan: React.FC<BillingPlanProps> = ({
 }) => {
   return (
     <Flex direction={direction} gap={3}>
-      <div className="flex flex-row">
+      <div className="flex flex-row items-center gap-2">
         <Text color={titleColor} size={titleSize}>
           Your current plan is
         </Text>
@@ -35,7 +35,7 @@ export const BillingPlan: React.FC<BillingPlanProps> = ({
         </Badge>
       </div>
 
-      <div className="flex flex-row">
+      <div className="flex flex-row items-center gap-2">
         {description && <Text>{description}</Text>}
 
         <TrackedLink

apps/dashboard/src/components/settings/Account/Billing/PlanCard.tsx

@@ -17,7 +17,7 @@ export const BillingPlanCard = () => {
 
   return (
     <Card as={Flex} flexDir="column" gap={2}>
-      <div className="flex flex-row">
+      <div className="flex flex-row items-center gap-2">
         <Heading size="title.xs">Your current plan is</Heading>
         <Badge
           borderRadius="md"

apps/dashboard/src/components/settings/Account/Billing/index.tsx

@@ -142,7 +142,7 @@ export const Billing: React.FC<BillingProps> = ({ account, teamId }) => {
     return [
       {
         title: (
-          <div className="flex flex-row justify-between">
+          <div className="flex flex-row items-center justify-between gap-2">
             <Heading
               size="label.md"
               opacity={!stepsCompleted.account ? 1 : 0.6}

apps/dashboard/src/contract-ui/tabs/claim-conditions/components/snapshot-upload.tsx

@@ -427,7 +427,7 @@ const SnapshotTableColumns = [
         return address;
       }
       return (
-        <div className="flex flex-row">
+        <div className="flex flex-row items-center gap-2">
           <Tooltip
             label={
               address.startsWith("0x")

apps/dashboard/src/contract-ui/tabs/nfts/components/airdrop-upload.tsx

@@ -335,7 +335,7 @@ const AirdropTable: React.FC<AirdropTableProps> = ({ data, portalRef }) => {
             return address;
           }
           return (
-            <div className="flex flex-row">
+            <div className="flex flex-row items-center gap-2">
               <Tooltip
                 label={
                   address.startsWith("0x")

apps/dashboard/src/core-ui/batch-upload/batch-lazy-mint.tsx

@@ -266,7 +266,7 @@ export const BatchLazyMint: ComponentWithChildren<BatchLazyMintProps> = (
                 w="100%"
                 mb={2}
               >
-                <div className="flex flex-row">
+                <div className="flex flex-row items-center gap-2">
                   <Button
                     className="text-muted-foreground"
                     variant="ghost"

apps/dashboard/src/core-ui/batch-upload/batch-table.tsx

@@ -214,7 +214,7 @@ export const BatchTable: React.FC<BatchTableProps> = ({
       </TableContainer>
       <Portal containerRef={portalRef}>
         <div className="flex w-full items-center justify-center">
-          <div className="flex flex-row">
+          <div className="flex flex-row items-center gap-2">
             <IconButton
               isDisabled={!canPreviousPage}
               aria-label="first page"