fix: place hours and courses under schedule name (#388)
* fix(header): bottom-aligned the schedule name + hours/courses in calendar * feat: updated font style in header and dropdown * fix: new hour/course styling per discussion i love having 80 different ideas, hopefully after this there's like maybe a tiny commit left to do before this is done.. * feat(header): added icons to cal header WORK IN PROGRESS * style: updated layout of header and main popup * fix: updated font and spacing for header and popup * fix: updated cal + popup style details - schedule title is now in normal casing w/ colon removed - last updated on is now entirely deleted from everywhere - hour and course numbers now h3 in calendar ONLY * refactor: changed size for calendar header * refactor: changed ut-black to theme-black * refactor: remove hiding on small window sizes * refactor: reduced spacing in popup * refactor: updated unocss for small-caps configuration * style: changed variant + className order * fix: readded update time text * style: auto formatter, unused imports, capitalization --------- Co-authored-by: Razboy20 <razboy20@gmail.com> Co-authored-by: Samuel Gunter <sgunter@utexas.edu> Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
This commit is contained in:
@@ -24,16 +24,36 @@ export default function ScheduleTotalHoursAndCourses({
|
||||
totalCourses,
|
||||
}: ScheduleTotalHoursAndCoursesProps): JSX.Element {
|
||||
return (
|
||||
<div className='min-w-full w-0 flex items-center gap-2.5 whitespace-nowrap'>
|
||||
<Text className='truncate text-ut-burntorange uppercase' variant='h1' as='span'>
|
||||
{`${scheduleName}: `}
|
||||
</Text>
|
||||
<Text variant='h3' as='div' className='flex flex-row items-center gap-2 text-theme-black'>
|
||||
{totalHours} {totalHours === 1 ? 'Hour' : 'Hours'}
|
||||
<Text variant='h4' as='span' className='hidden capitalize screenshot:inline sm:inline'>
|
||||
{totalCourses} {totalCourses === 1 ? 'Course' : 'Courses'}
|
||||
</Text>
|
||||
<div className='min-w-full w-0 items-center whitespace-nowrap'>
|
||||
<Text className='truncate text-ut-burntorange normal-case!' variant='h1' as='span'>
|
||||
{scheduleName}
|
||||
</Text>
|
||||
<div className='flex flex-row items-center gap-2.5 text-theme-black'>
|
||||
<div className='flex flex-row items-center gap-1.25 text-theme-black'>
|
||||
<Text variant='h3' as='span' className='capitalize screenshot:inline sm:inline'>
|
||||
{totalHours}
|
||||
</Text>
|
||||
<Text
|
||||
variant='h3'
|
||||
as='span'
|
||||
className='capitalize screenshot:inline sm:inline font-all-small-caps!'
|
||||
>
|
||||
{totalHours === 1 ? 'HOUR' : 'HOURS'}
|
||||
</Text>
|
||||
</div>
|
||||
<div className='flex flex-row items-center gap-1.25 text-theme-black'>
|
||||
<Text variant='h3' as='span' className='capitalize screenshot:inline sm:inline'>
|
||||
{totalCourses}
|
||||
</Text>
|
||||
<Text
|
||||
variant='h3'
|
||||
as='span'
|
||||
className='capitalize screenshot:inline sm:inline font-all-small-caps!'
|
||||
>
|
||||
{totalCourses === 1 ? 'COURSE' : 'COURSES'}
|
||||
</Text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user