From 55c8887a0882ebf9d8f51f656ce3084d92d7f6cc Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Thu, 2 Mar 2023 12:17:25 -0600
Subject: [PATCH] Small design tweaks for create group modal

---
 .../manage-group-modal/steps/details-step.tsx      | 14 +++++++-------
 .../manage-group-modal/steps/privacy-step.tsx      |  2 +-
 app/soapbox/locales/en.json                        |  2 +-
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
index c40bcf3e1..f51be0ae5 100644
--- a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
+++ b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
@@ -37,17 +37,17 @@ const HeaderPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }
         className={clsx('absolute top-0 h-full w-full transition-opacity', {
           'opacity-0 hover:opacity-90 bg-primary-100 dark:bg-gray-800': src,
         })}
-        space={3}
+        space={1.5}
         alignItems='center'
         justifyContent='center'
       >
         <Icon
           src={require('@tabler/icons/photo-plus.svg')}
-          className='h-7 w-7'
+          className='h-4.5 w-4.5'
         />
 
-        <Text size='sm' theme='primary' weight='semibold' transform='uppercase'>
-          <FormattedMessage id='compose_event.upload_banner' defaultMessage='Upload photo' />
+        <Text size='md' theme='primary' weight='semibold'>
+          <FormattedMessage id='group.upload_banner' defaultMessage='Upload photo' />
         </Text>
 
         <input
@@ -65,8 +65,8 @@ const HeaderPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }
 
 const AvatarPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }) => {
   return (
-    <label className='absolute left-1/2 bottom-0 h-[72px] w-[72px] -translate-x-1/2 translate-y-1/2 cursor-pointer rounded-full bg-primary-500 ring-2 ring-white dark:ring-primary-900'>
-      {src && <Avatar src={src} size={72} />}
+    <label className='absolute left-1/2 bottom-0 h-20 w-20 -translate-x-1/2 translate-y-1/2 cursor-pointer rounded-full bg-primary-500 ring-2 ring-white dark:ring-primary-900'>
+      {src && <Avatar src={src} size={80} />}
       <HStack
         alignItems='center'
         justifyContent='center'
@@ -77,7 +77,7 @@ const AvatarPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }
       >
         <Icon
           src={require('@tabler/icons/camera-plus.svg')}
-          className='h-7 w-7 text-white'
+          className='h-5 w-5 text-white'
         />
       </HStack>
       <span className='sr-only'>Upload avatar</span>
diff --git a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
index 4e6622c3c..22ad89305 100644
--- a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
+++ b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
@@ -19,7 +19,7 @@ const PrivacyStep = () => {
     <>
       <Stack className='mx-auto max-w-sm' space={2}>
         <Text size='3xl' weight='bold' align='center'>
-          <FormattedMessage id='manage_group.get_started' defaultMessage="Let's get started!" />
+          <FormattedMessage id='manage_group.get_started' defaultMessage='Let’s get started!' />
         </Text>
         <Text size='lg' theme='muted' align='center'>
           <FormattedMessage id='manage_group.tagline' defaultMessage='Groups connect you with others based on shared interests.' />
diff --git a/app/soapbox/locales/en.json b/app/soapbox/locales/en.json
index f9b638009..dd82fa393 100644
--- a/app/soapbox/locales/en.json
+++ b/app/soapbox/locales/en.json
@@ -892,7 +892,7 @@
   "manage_group.fields.description_placeholder": "Description",
   "manage_group.fields.name_label": "Group name (required)",
   "manage_group.fields.name_placeholder": "Group Name",
-  "manage_group.get_started": "Let's get started!",
+  "manage_group.get_started": "Let’s get started!",
   "manage_group.next": "Next",
   "manage_group.pending_requests": "Pending requests",
   "manage_group.privacy.hint": "These settings cannot be changed later.",