Fix skinny buttons (#336)

# What's Changed?

- Fixed skinny buttons and tabs that were broken by changes to touch
area in #330

## Screenshots

### Before
<img width="1385" alt="Screenshot 2023-01-16 at 14 21 39"
src="https://user-images.githubusercontent.com/88904316/212700049-7384768a-5119-4a13-83c2-db71d347ce44.png">

### After
<img width="1141" alt="Screenshot 2023-01-16 at 14 22 21"
src="https://user-images.githubusercontent.com/88904316/212700189-b347b140-8833-4cdd-9764-5692118c69d8.png">

closes #335

Co-authored-by: loiswells97 <loiswells97@users.noreply.github.com>
Co-authored-by: Lois Wells <lois.wells@raspberrypi.org>
Co-authored-by: Lois Wells <88904316+loiswells97@users.noreply.github.com>
Co-authored-by: Patrick Cherry <patch0@users.noreply.github.com>

CHANGELOG.md

@@ -25,9 +25,9 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### Fixed
 - Make sure button text is always centered (#328)
+- Touch area of icon-only buttons (#330, #336)
 - Delete project action on project index page (#330)
 - Refactored project list loading to allow loading states to be shown (#330)
-- Touch area of icon-only buttons (#330)
 - Removed unneeded scrollbars on the editor and output panels (#331)
 - Make Your projects page background extend below the fold (#334)
 

src/components/Button/Button.scss

@@ -129,6 +129,11 @@
     }
   }
 
+  &--small {
+    min-height: unset;
+    min-width: unset;
+  }
+
   &--svg-only {
     svg {
       margin: 0;

src/tabs.scss

@@ -15,6 +15,7 @@ $spacing-four: calc($spacing-eight / 2);
 
     &__tab-inner {
       @extend .btn;
+      @extend .btn--small;
       @extend .btn--secondary;
 
       border: 3px solid transparent;