Titlebar fixes

This commit is contained in:
Fedor Indutny 2022-07-05 09:44:53 -07:00 committed by GitHub
parent f273333046
commit f92be05b15
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
41 changed files with 225 additions and 154 deletions

View file

@ -12,6 +12,7 @@ import { createTemplate } from '../../app/menu';
import { ThemeType } from '../types/Util';
import type { LocaleMessagesType } from '../types/I18N';
import type { MenuOptionsType, MenuActionType } from '../types/menu';
import { useIsWindowActive } from '../hooks/useIsWindowActive';
export type MenuPropsType = Readonly<{
hasMenu: true;
@ -28,9 +29,8 @@ export type PropsType = Readonly<{
theme: ThemeType;
isMaximized?: boolean;
isFullScreen?: boolean;
isWindows11: boolean;
hasCustomTitleBar: boolean;
hideMenuBar?: boolean;
platform: string;
executeMenuRole: ExecuteMenuRoleType;
titleBarDoubleClick?: () => void;
children: ReactNode;
@ -116,16 +116,17 @@ export const TitleBarContainer = (props: PropsType): JSX.Element => {
theme,
isMaximized,
isFullScreen,
isWindows11,
hasCustomTitleBar,
hideMenuBar,
executeMenuRole,
titleBarDoubleClick,
children,
hasMenu,
platform,
iconSrc = 'images/icon_32.png',
} = props;
const isWindowActive = useIsWindowActive();
const titleBarTheme = useMemo(
() => ({
bar: {
@ -201,7 +202,7 @@ export const TitleBarContainer = (props: PropsType): JSX.Element => {
[theme, hideMenuBar]
);
if (platform !== 'win32' || isFullScreen) {
if (!hasCustomTitleBar || isFullScreen) {
return <>{children}</>;
}
@ -236,17 +237,18 @@ export const TitleBarContainer = (props: PropsType): JSX.Element => {
}
return (
<div className="TitleBarContainer">
<TitleBar
className={classNames(
'TitleBarContainer__title',
<div
className={classNames(
'TitleBarContainer',
isWindowActive ? 'TitleBarContainer--active' : null
)}
>
<div className="TitleBarContainer__padding" />
<div className="TitleBarContainer__content">{children}</div>
// Add a pixel of padding on non-maximized Windows 11 titlebar.
isWindows11 && !isMaximized
? 'TitleBarContainer__title--extra-padding'
: null
)}
platform={platform}
<TitleBar
className="TitleBarContainer__title"
platform="win32"
iconSrc={iconSrc}
theme={titleBarTheme}
maximized={isMaximized}
@ -254,8 +256,6 @@ export const TitleBarContainer = (props: PropsType): JSX.Element => {
onDoubleClick={titleBarDoubleClick}
hideControls
/>
<div className="TitleBarContainer__content">{children}</div>
</div>
);
};