mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-01 10:23:33 +00:00
Add dedicated OS window bars (#22)
This commit is contained in:
parent
ececc394e2
commit
58c7370536
25 changed files with 823 additions and 462 deletions
|
|
@ -5,6 +5,8 @@ import { useMergedRef, useTimeout } from '@mantine/hooks';
|
|||
import { motion, useScroll } from 'framer-motion';
|
||||
import styled from 'styled-components';
|
||||
import { PageHeader, PageHeaderProps } from '/@/renderer/components/page-header';
|
||||
import { useGeneralSettings } from '/@/renderer/store/settings.store';
|
||||
import { Platform } from '/@/renderer/types';
|
||||
|
||||
interface ScrollAreaProps extends MantineScrollAreaProps {
|
||||
children: React.ReactNode;
|
||||
|
|
@ -26,16 +28,18 @@ const StyledScrollArea = styled(MantineScrollArea)`
|
|||
}
|
||||
`;
|
||||
|
||||
const StyledNativeScrollArea = styled.div<{ scrollBarOffset?: string }>`
|
||||
const StyledNativeScrollArea = styled.div<{ scrollBarOffset?: string; windowBarStyle?: Platform }>`
|
||||
height: 100%;
|
||||
overflow-y: overlay !important;
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
margin-top: ${(props) => props.scrollBarOffset || '65px'};
|
||||
margin-top: ${(props) =>
|
||||
props.windowBarStyle !== Platform.WEB ? '0px' : props.scrollBarOffset || '65px'};
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
margin-top: ${(props) => props.scrollBarOffset || '65px'};
|
||||
margin-top: ${(props) =>
|
||||
props.windowBarStyle !== Platform.WEB ? '0px' : props.scrollBarOffset || '65px'};
|
||||
}
|
||||
`;
|
||||
|
||||
|
|
@ -74,6 +78,7 @@ export const NativeScrollArea = forwardRef(
|
|||
}: NativeScrollAreaProps,
|
||||
ref: Ref<HTMLDivElement>,
|
||||
) => {
|
||||
const { windowBarStyle } = useGeneralSettings();
|
||||
const [hideScrollbar, setHideScrollbar] = useState(false);
|
||||
const [hideHeader, setHideHeader] = useState(true);
|
||||
const { start, clear } = useTimeout(
|
||||
|
|
@ -130,6 +135,7 @@ export const NativeScrollArea = forwardRef(
|
|||
ref={mergedRef}
|
||||
className={hideScrollbar ? 'hide-scrollbar' : undefined}
|
||||
scrollBarOffset={scrollBarOffset}
|
||||
windowBarStyle={windowBarStyle}
|
||||
onMouseEnter={() => {
|
||||
setHideScrollbar(false);
|
||||
clear();
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue