| 133 | } |
| 134 | |
| 135 | const windowsTitleBar = () => { |
| 136 | return ( |
| 137 | <> |
| 138 | <div className="title-group-container"> |
| 139 | <div className="title-container"> |
| 140 | <Icon className="app-icon"/> |
| 141 | <span className="title">Frame Player</span> |
| 142 | </div> |
| 143 | <div className="title-button-container"> |
| 144 | <UploadIcon className="title-bar-button" onClick={upload}/> |
| 145 | <DownloadIcon className="title-bar-button" onClick={download}/> |
| 146 | <SearchIcon className="title-bar-button" onClick={search}/> |
| 147 | <FXIcon className="title-bar-button" onClick={fx}/> |
| 148 | {videoDrag ? |
| 149 | <VideoDragIcon className="title-bar-button" onClick={drag}/> : |
| 150 | <VideoPanIcon className="title-bar-button" onClick={drag}/>} |
| 151 | <TransparentIcon className="title-bar-button" onClick={switchTransparency}/> |
| 152 | <PinIcon className={`title-bar-button ${pinned && "title-button-active"}`} onClick={switchPinned}/> |
| 153 | {theme === "light" ? |
| 154 | <LightIcon className="title-bar-button" onClick={switchTheme}/> : |
| 155 | <DarkIcon className="title-bar-button" onClick={switchTheme}/>} |
| 156 | <WindowsIcon className="title-bar-button" onClick={switchOSStyle}/> |
| 157 | </div> |
| 158 | </div> |
| 159 | <div className="title-group-container"> |
| 160 | <div className="title-win-container"> |
| 161 | <MinimizeIcon className="title-win-button" color="var(--minimizeButton)" onClick={minimize}/> |
| 162 | <MaximizeIcon className="title-win-button" color="var(--maximizeButton)" onClick={maximize} style={{marginLeft: "4px"}}/> |
| 163 | <CloseIcon className="title-win-button" color="var(--closeButton)" onClick={close}/> |
| 164 | </div> |
| 165 | </div> |
| 166 | </> |
| 167 | ) |
| 168 | } |
| 169 | |
| 170 | return ( |
| 171 | <section className={hover ? "title-bar visible" : "title-bar"} onMouseDown={onMouseDown}> |