feat(ui): update button variants following figma (#482)

* feat(ui): update button variants following figma

* feat(ui): separate size prop to allow for regular and small sized button variants

* update type to no longer include minimal-small

* update uno css config to use new spacing system

* add variants and sizes to file upload; update button and file upload stories

* add mini button variant and update small button

* specify width on icon-only regular variant

* update plus buttons to be mini sizes

* remove redundant classnames

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>

src/views/components/calendar/CalendarBottomBar.tsx

@@ -60,12 +60,12 @@ export default function CalendarBottomBar({ courseCells, setCourse }: CalendarBo
             </div>
             <div className='flex items-center screenshot:hidden'>
                 {displayCourses && <Divider orientation='vertical' size='1rem' className='mx-1.25' />}
-                <Button variant='single' color='ut-black' icon={CalendarDots} onClick={saveAsCal}>
+                <Button variant='minimal' color='ut-black' icon={CalendarDots} onClick={saveAsCal}>
                     Save as .CAL
                 </Button>
                 <Divider orientation='vertical' size='1rem' className='mx-1.25' />
                 <Button
-                    variant='single'
+                    variant='minimal'
                     color='ut-black'
                     icon={ImageSquare}
                     onClick={() => requestAnimationFrame(() => saveCalAsPng())}

src/views/components/calendar/CalendarHeader.tsx

@@ -57,7 +57,7 @@ export default function CalendarHeader({ onSidebarToggle }: CalendarHeaderProps)
     return (
         <div className='flex items-center gap-5 overflow-x-auto overflow-y-hidden border-b border-ut-offwhite px-7 py-4 md:overflow-x-hidden'>
             <Button
-                variant='single'
+                variant='minimal'
                 icon={Sidebar}
                 color='ut-gray'
                 onClick={onSidebarToggle}
@@ -83,7 +83,7 @@ export default function CalendarHeader({ onSidebarToggle }: CalendarHeaderProps)
 
                 {/* <Button variant='single' icon={UndoIcon} color='ut-black' />
                 <Button variant='single' icon={RedoIcon} color='ut-black' /> */}
-                <Button variant='single' icon={GearSix} color='theme-black' onClick={handleOpenOptions} />
+                <Button variant='minimal' icon={GearSix} color='theme-black' onClick={handleOpenOptions} />
             </div>
         </div>
     );

src/views/components/calendar/CalendarSchedules.tsx

@@ -31,9 +31,7 @@ export function CalendarSchedules() {
                 <Text variant='h3' className='text-nowrap'>
                     MY SCHEDULES
                 </Text>
-                <Button variant='single' color='theme-black' className='h-fit p-0 btn' onClick={handleAddSchedule}>
-                    <Plus className='h-6 w-6' />
-                </Button>
+                <Button size='mini' variant='minimal' color='theme-black' onClick={handleAddSchedule} icon={Plus} />
             </div>
             <div className='flex flex-col space-y-2.5'>
                 <List