DerexXD/UT-Registration-Plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: alignment on calendar and header (#109)

Browse Source 
* feat: corrected date updated text

* feat: whew alignment looks way better

* feat: aligned the bars and made the latter half justify-end

* fix: limt

* fix: removed broken divider vinson did u do this
This commit is contained in:
Derek Chen
2024-02-25 19:12:45 -06:00
committed by doprz
parent ee37897df4
commit 07ec5abc3e
1 changed files with 10 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/views/components/calendar/CalendarHeader/CalenderHeader.tsx
View File

@@ -6,7 +6,6 @@ import ScheduleTotalHoursAndCourses from '@views/components/common/ScheduleTotal
import Text from '@views/components/common/Text/Text'; import Text from '@views/components/common/Text/Text';
import React from 'react'; import React from 'react';
import calIcon from 'src/assets/logo.png'; import calIcon from 'src/assets/logo.png';
import MenuIcon from '~icons/material-symbols/menu'; import MenuIcon from '~icons/material-symbols/menu';
import RedoIcon from '~icons/material-symbols/redo'; import RedoIcon from '~icons/material-symbols/redo';
import SettingsIcon from '~icons/material-symbols/settings'; import SettingsIcon from '~icons/material-symbols/settings';
@@ -21,25 +20,24 @@ const CalendarHeader = () => (
<div className='flex flex-row gap-20'> <div className='flex flex-row gap-20'>
<div className='flex gap-10'> <div className='flex gap-10'>
<div className='flex gap-1'> <div className='flex gap-1'>
<Button variant='single' icon={MenuIcon} color='ut-gray' /> <Button className='self-center' variant='single' icon={MenuIcon} color='ut-gray' />
<div className='flex items-center'> <div className='flex items-center gap-2'>
<img src={calIcon} className='max-w-[48px] min-w-[48px]' alt='UT Registration Plus Logo' /> <img src={calIcon} className='max-w-[48px] min-w-[48px]' alt='UT Registration Plus Logo' />
<div className='flex flex-col whitespace-nowrap'> <div className='flex flex-col whitespace-nowrap'>
<Text className='leading-trim font-roboto text-cap text-base text-ut-burntorange font-medium'> <Text className='text-lg text-ut-burntorange font-medium'>UT Registration</Text>
UT Registration <Text className='text-lg text-ut-orange font-medium'>Plus</Text>
</Text>
<Text className='leading-trim text-cap font-roboto text-base text-ut-orange font-medium'>
Plus
</Text>
</div> </div>
</div> </div>
</div> </div>
<div className='flex flex-col'> <Divider className='self-center' size='2.5rem' orientation='vertical' />
<div className='flex flex-col self-center'>
<ScheduleTotalHoursAndCourses scheduleName='SCHEDULE' totalHours={22} totalCourses={8} /> <ScheduleTotalHoursAndCourses scheduleName='SCHEDULE' totalHours={22} totalCourses={8} />
<Text variant='h4' className='text-gray text-xs font-medium leading-normal'>
DATA UPDATED ON: 12:00 AM 02/01/2024 DATA UPDATED ON: 12:00 AM 02/01/2024
</Text>
</div> </div>
</div> </div>
<div className='flex flex-row items-center space-x-8'> <div className='flex flex-row justify-end items-center space-x-8'>
<div className='flex flex-row space-x-4'> <div className='flex flex-row space-x-4'>
<CourseStatus size='small' status={Status.WAITLISTED} /> <CourseStatus size='small' status={Status.WAITLISTED} />
<CourseStatus size='small' status={Status.CLOSED} /> <CourseStatus size='small' status={Status.CLOSED} />
@@ -52,7 +50,6 @@ const CalendarHeader = () => (
</div> </div>
</div> </div>
</div> </div>
<Divider type='solid' />
</div> </div>
); );