nicolium: fix logic

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2026-02-26 14:55:39 +01:00
parent 267e644481
commit 9964dbb3cc
3 changed files with 18 additions and 4 deletions

View File

@ -140,7 +140,8 @@ const Main: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({ children, classN
const Aside: React.FC<IAside> = ({ children }) => {
const isVisible = useMinWidth(`(min-width: ${breakpoints.xl})`);
const wcoRect = useWindowControlsOverlay();
const offsetTop = wcoRect && wcoRect.x + wcoRect.width < window.innerWidth ? 16 + wcoRect.y : 16;
const offsetTop =
wcoRect && wcoRect.x + wcoRect.width < window.innerWidth ? 16 + wcoRect.height : 16;
if (!isVisible) {
return null;

View File

@ -26,6 +26,7 @@ const PlFeHead = () => {
const frontendConfig = useFrontendConfig();
const theme = useTheme();
const [wcoVisible, setWcoVisible] = React.useState(false);
const [wcoRight, setWcoRight] = React.useState(false);
const withModals = useHasModals();
@ -50,7 +51,16 @@ const PlFeHead = () => {
const overlay = navigator.windowControlsOverlay;
if (!overlay) return;
const update = () => setWcoVisible(overlay.visible);
const update = () => {
setWcoVisible(overlay.visible);
if (overlay.visible) {
const rect = overlay.getTitlebarAreaRect();
setWcoRight(rect.x + rect.width < window.innerWidth);
} else {
setWcoRight(false);
}
};
update();
overlay.addEventListener('geometrychange', update);
return () => overlay.removeEventListener('geometrychange', update);
}, []);
@ -60,7 +70,7 @@ const PlFeHead = () => {
return window.getComputedStyle(document.body, null).getPropertyValue('background-color');
}
return frontendConfig.brandColor;
}, [frontendConfig.brandColor, theme, wcoVisible]);
}, [frontendConfig.brandColor, theme, wcoVisible, wcoRight]);
return (
<>
@ -71,6 +81,7 @@ const PlFeHead = () => {
dark: theme === 'dark',
'black dark': theme === 'black',
'window-controls-overlay': wcoVisible,
'window-controls-overlay--right': wcoRight,
})}
/>
<body className={bodyClass} dir={direction} />

View File

@ -379,7 +379,9 @@ body {
padding-top: env(titlebar-area-height);
@media (min-width: variables.$breakpoint-lg) {
padding-top: 0;
&:is(.window-controls-overlay:not(.window-controls-overlay--right) *) {
padding-top: 0;
}
}
}
}