fix: FormField label margin too large, button reset (#521)

Author: dogmar

src/components/FormField.tsx

@@ -111,6 +111,7 @@ function FormFieldRef(
               fontWeight="600"
               flexShrink={0}
               flexGrow={1}
+              margin={0}
               {...labelProps}
             >
               {label}

src/stories/FormField.stories.tsx

@@ -142,12 +142,15 @@ export const Caption = AllSizesTemplate.bind({})
 
 Caption.args = {
   label: 'Password',
+  caption: 'A short caption',
 }
 
 export const LongCaption = AllSizesTemplate.bind({})
 
 LongCaption.args = {
   label: 'Label',
+  caption:
+    'This will probably truncate, because it is ever so so longer than usual.',
 }
 
 export const HintText = AllSizesTemplate.bind({})

src/theme/resets.ts

@@ -9,8 +9,9 @@ export const resetPartials = {
     padding: 0,
     font: 'inherit',
     cursor: 'pointer',
-    outline: 'inherit',
+    outline: 'unset',
     alignItems: 'unset',
+    appearance: 'none',
   },
   list: {
     margin: 0,