From bc354f3798a02e6ebc3c66a8b5eee553c25a19d4 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Mon, 27 May 2024 09:32:31 -0500
Subject: [PATCH] feat: additional changes to #201 (#224)

* fix: calendar weight change

* feat: small color change

* feat: stories for logo

* feat: align the logo

* feat: stupid imports

* fix: eslint styling

* Update CalenderHeader.tsx

* Update colors.module.scss

* chore: remove argTypes

* chore: remove argTypes

* chore: remove argTypes

* fix: lock

* chore: styled up logo stories

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
---
 src/stories/components/LogoIcon.stories.tsx    | 18 ++++++++++++++++++
 .../components/calendar/CalenderHeader.tsx     |  2 +-
 src/views/components/common/LogoIcon.tsx       |  4 ++--
 3 files changed, 21 insertions(+), 3 deletions(-)
 create mode 100644 src/stories/components/LogoIcon.stories.tsx

diff --git a/src/stories/components/LogoIcon.stories.tsx b/src/stories/components/LogoIcon.stories.tsx
new file mode 100644
index 00000000..4eafe95f
--- /dev/null
+++ b/src/stories/components/LogoIcon.stories.tsx
@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { LargeLogo, SmallLogo } from '@views/components/common/LogoIcon';
+import React from 'react';
+
+const meta = {
+    title: 'Components/Common/Logo',
+    component: SmallLogo,
+    tags: ['autodocs'],
+} satisfies Meta<typeof SmallLogo>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Small: Story = {};
+
+export const Large: Story = {
+    render: args => <LargeLogo {...args} />,
+};
diff --git a/src/views/components/calendar/CalenderHeader.tsx b/src/views/components/calendar/CalenderHeader.tsx
index 7b91aa51..c159cdc7 100644
--- a/src/views/components/calendar/CalenderHeader.tsx
+++ b/src/views/components/calendar/CalenderHeader.tsx
@@ -51,7 +51,7 @@ export default function CalendarHeader({ onSidebarToggle }: CalendarHeaderProps)
                     totalCourses={activeSchedule.courses.length}
                 />
                 <div className='flex items-center gap-1 screenshot:hidden'>
-                    <Text variant='mini' className='text-nowrap text-ut-gray font-normal'>
+                    <Text variant='mini' className='text-nowrap text-ut-gray font-normal!'>
                         DATA LAST UPDATED: {getUpdatedAtDateTimeString(activeSchedule.updatedAt)}
                     </Text>
                     <button className='inline-block h-4 w-4 bg-transparent p-0 btn'>
diff --git a/src/views/components/common/LogoIcon.tsx b/src/views/components/common/LogoIcon.tsx
index 19ce6817..b2ca45ae 100644
--- a/src/views/components/common/LogoIcon.tsx
+++ b/src/views/components/common/LogoIcon.tsx
@@ -28,7 +28,7 @@ export function SmallLogo({ className }: { className?: string }): JSX.Element {
     return (
         <div className={clsx('flex items-center gap-2', className)}>
             <LogoIcon />
-            <div className='flex flex-col text-lg font-medium leading-[1em]'>
+            <div className='flex flex-col text-lg font-medium leading-[1em] mt-1'>
                 <p className='text-nowrap text-ut-burntorange'>UT Registration</p>
                 <p className='text-ut-burntorange'>
                     Plus{' '}
@@ -51,7 +51,7 @@ export function LargeLogo({ className }: { className?: string }): JSX.Element {
     return (
         <div className={clsx('flex items-center gap-2', className)}>
             <LogoIcon className='h-12 w-12' />
-            <div className='hidden flex-col text-[1.35rem] font-medium leading-[1em] md:flex screenshot:flex'>
+            <div className='hidden flex-col text-[1.35rem] font-medium leading-[1em] md:flex screenshot:flex mt-1'>
                 <p className='text-nowrap text-ut-burntorange'>UT Registration</p>
                 <p className='text-ut-burntorange'>
                     Plus{' '}