Function macTitleBar

components/TitleBar.tsx:98–133

()

    })

    const macTitleBar = () => {
        return (
            <div className="title-group-container">
                <div className="title-mac-container" onMouseEnter={() => setIconHover(true)} onMouseLeave={() => setIconHover(false)}>
                    {iconHover ? <>
                    <CircleCloseIcon className="title-mac-button" color="var(--closeButton)" onClick={close}/>
                    <CircleMinimizeIcon className="title-mac-button" color="var(--minimizeButton)" onClick={minimize}/>
                    <CircleMaximizeIcon className="title-mac-button" color="var(--maximizeButton)" onClick={maximize}/>
                    </> : <>
                    <CircleIcon className="title-mac-button" color="var(--closeButton)" onClick={close}/>
                    <CircleIcon className="title-mac-button" color="var(--minimizeButton)" onClick={minimize}/>
                    <CircleIcon className="title-mac-button" color="var(--maximizeButton)" onClick={maximize}/>
                    </>}
                </div>
                <div className="title-container">
                    <Icon className="app-icon"/>
                    <span className="title">Frame Player</span>
                </div>
                <div className="title-button-container">
                    <UploadIcon className="title-bar-button" onClick={upload}/>
                    <DownloadIcon className="title-bar-button" onClick={download}/>
                    <SearchIcon className="title-bar-button" onClick={search}/>
                    <FXIcon className="title-bar-button" onClick={fx}/>
                    {videoDrag ?
                    <VideoDragIcon className="title-bar-button" onClick={drag}/> :
                    <VideoPanIcon className="title-bar-button" onClick={drag}/>}
                    <TransparentIcon className="title-bar-button" onClick={switchTransparency}/>
                    <PinIcon className={`title-bar-button ${pinned && "title-button-active"}`} onClick={switchPinned}/>
                    {theme === "light" ?
                    <LightIcon className="title-bar-button" onClick={switchTheme}/> :
                    <DarkIcon className="title-bar-button" onClick={switchTheme}/>}
                    <MacIcon className="title-bar-button" onClick={switchOSStyle}/>
                </div>
            </div>
        )
    }

    const windowsTitleBar = () => {
        return (