Files
readest/apps/readest-app/src/app/reader/components/SectionInfo.tsx
T
2024-11-25 17:51:40 +01:00

31 lines
812 B
TypeScript

import clsx from 'clsx';
import React from 'react';
import { useSidebarStore } from '@/store/sidebarStore';
import useTrafficLight from '@/hooks/useTrafficLight';
interface SectionInfoProps {
section?: string;
gapLeft: string;
}
const SectionInfo: React.FC<SectionInfoProps> = ({ section, gapLeft }) => {
const { isSideBarVisible } = useSidebarStore();
const { isTrafficLightVisible } = useTrafficLight();
return (
<div
className={clsx(
'pageinfo absolute right-0 top-0 flex items-end',
isTrafficLightVisible && !isSideBarVisible ? 'h-[44px]' : 'h-[30px]',
)}
style={{ left: gapLeft }}
>
<h2 className='text-neutral-content text-center font-sans text-xs font-light'>
{section || ''}
</h2>
</div>
);
};
export default SectionInfo;