forked from akai/readest
Rounded window without window decorations
This commit is contained in:
@@ -41,7 +41,7 @@ const FooterBar: React.FC<FooterBarProps> = ({
|
||||
<div
|
||||
className={clsx(
|
||||
'footer-bar absolute bottom-0 z-10 flex h-12 w-full items-center px-4',
|
||||
'shadow-xs bg-base-100 transition-opacity duration-300',
|
||||
'shadow-xs bg-base-100 rounded-window transition-opacity duration-300',
|
||||
isHoveredAnim && 'hover-bar-anim',
|
||||
hoveredBookKey === bookKey ? `opacity-100` : `opacity-0`,
|
||||
)}
|
||||
|
||||
@@ -2,6 +2,8 @@ import React from 'react';
|
||||
import clsx from 'clsx';
|
||||
import { VscLayoutSidebarLeft, VscLayoutSidebarLeftOff } from 'react-icons/vsc';
|
||||
|
||||
import WindowButtons from '@/components/WindowButtons';
|
||||
|
||||
interface HeaderBarProps {
|
||||
bookKey: string;
|
||||
bookTitle: string;
|
||||
@@ -36,9 +38,10 @@ const HeaderBar: React.FC<HeaderBarProps> = ({
|
||||
|
||||
return (
|
||||
<div
|
||||
id='titlebar'
|
||||
className={clsx(
|
||||
`header-bar absolute top-0 z-10 flex h-10 w-full items-center px-4`,
|
||||
`shadow-xs bg-base-100 transition-opacity duration-300`,
|
||||
`header-bar absolute top-0 z-10 flex h-11 w-full items-center px-4`,
|
||||
`shadow-xs bg-base-100 rounded-window transition-opacity duration-300`,
|
||||
isHoveredAnim && 'hover-bar-anim',
|
||||
hoveredBookKey === bookKey ? `opacity-100` : `opacity-0`,
|
||||
)}
|
||||
@@ -59,6 +62,9 @@ const HeaderBar: React.FC<HeaderBarProps> = ({
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
<div className='absolute right-4 flex h-full items-center'>
|
||||
<WindowButtons />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -82,7 +82,7 @@ const SideBar: React.FC<{
|
||||
return (
|
||||
isVisible && (
|
||||
<div
|
||||
className='sidebar-container bg-base-200 z-20 h-full select-none'
|
||||
className='sidebar-container bg-base-200 rounded-window-left z-20 h-full select-none'
|
||||
style={{
|
||||
width: `${width}`,
|
||||
minWidth: `${MIN_SIDEBAR_WIDTH * 100}%`,
|
||||
@@ -91,7 +91,7 @@ const SideBar: React.FC<{
|
||||
}}
|
||||
>
|
||||
<div className={'sidebar h-full'}>
|
||||
<div className='flex h-10 items-center justify-between pl-1.5 pr-3'>
|
||||
<div className='flex h-11 items-center justify-between pl-1.5 pr-3'>
|
||||
<div className='flex items-center'>
|
||||
<button className='btn btn-ghost h-8 min-h-8 w-8 p-0' onClick={onGoToLibrary}>
|
||||
<GiBookshelf size={20} className='fill-base-content' />
|
||||
|
||||
@@ -164,7 +164,7 @@ const TOCView: React.FC<{
|
||||
|
||||
return (
|
||||
<div className='relative'>
|
||||
<div className='max-h-[calc(100vh-168px)] overflow-y-auto rounded border'>
|
||||
<div className='max-h-[calc(100vh-173px)] overflow-y-auto rounded border'>
|
||||
<ul role='tree' ref={tocRef} className='overflow-y-auto px-2'>
|
||||
{toc &&
|
||||
toc.map((item) => (
|
||||
|
||||
Reference in New Issue
Block a user