7d4c5d7be8
* feat: screenshot whole page, hide certain elements, screenshot fixed size * refactor: use variants instead of groups and custom rules * feat: scaled header, smaller body, weird padding/margin changes * feat: consistent sizing & style regardless of zoom * feat: use downloadBlob instead of hand-rolled image saving * fix: be type safe is toBlob returns Promise<null> * fix: revoke object url when it should be * fix: animation scheduling --------- Co-authored-by: Razboy20 <razboy20@gmail.com>
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import Text from '@views/components/common/Text/Text';
|
|
import React from 'react';
|
|
|
|
/**
|
|
* Props for ScheduleTotalHoursAndCourses
|
|
*/
|
|
export interface ScheduleTotalHoursAndCoursesProps {
|
|
scheduleName: string;
|
|
totalHours: number;
|
|
totalCourses: number;
|
|
}
|
|
|
|
/**
|
|
* The ScheduleTotalHoursAndCourses as per the Labels and Details Figma section
|
|
*
|
|
* @param props ScheduleTotalHoursAndCoursesProps
|
|
*/
|
|
export default function ScheduleTotalHoursAndCourses({
|
|
scheduleName,
|
|
totalHours,
|
|
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 text-ut-black capitalize screenshot:inline sm:inline'>
|
|
{totalCourses} {totalCourses === 1 ? 'Course' : 'Courses'}
|
|
</Text>
|
|
</Text>
|
|
</div>
|
|
);
|
|
}
|