From d409890635077a09379c74eda14094d8f583081f Mon Sep 17 00:00:00 2001 From: Devin Binnie Date: Thu, 19 Sep 2024 11:25:40 -0400 Subject: [PATCH 1/6] [MM-60605] Fix missing downloads/developer mode icon hidden on Linux and Windows --- src/renderer/components/MainPage.tsx | 1 + src/types/window.ts | 6 ++++++ 2 files changed, 7 insertions(+) diff --git a/src/renderer/components/MainPage.tsx b/src/renderer/components/MainPage.tsx index e35057b81fd..906d0af5720 100644 --- a/src/renderer/components/MainPage.tsx +++ b/src/renderer/components/MainPage.tsx @@ -483,6 +483,7 @@ class MainPage extends React.PureComponent { developerMode={this.state.developerMode} /> {downloadsDropdownButton} + {window.process.platform !== 'darwin' && this.state.fullScreen &&
DOMRect; + } + } } From 19050679b106bef7e77ee36063c0a85a2cf6b72b Mon Sep 17 00:00:00 2001 From: Devin Binnie Date: Thu, 19 Sep 2024 11:32:07 -0400 Subject: [PATCH 2/6] Disable for mac --- src/renderer/components/MainPage.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/renderer/components/MainPage.tsx b/src/renderer/components/MainPage.tsx index 906d0af5720..7e83f6ac322 100644 --- a/src/renderer/components/MainPage.tsx +++ b/src/renderer/components/MainPage.tsx @@ -483,7 +483,9 @@ class MainPage extends React.PureComponent { developerMode={this.state.developerMode} /> {downloadsDropdownButton} - + {window.process.platform !== 'darwin' && + + } {window.process.platform !== 'darwin' && this.state.fullScreen &&
Date: Thu, 19 Sep 2024 11:51:34 -0400 Subject: [PATCH 3/6] Fix lint --- src/types/window.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/types/window.ts b/src/types/window.ts index 163e0edbb5d..ec1af282d95 100644 --- a/src/types/window.ts +++ b/src/types/window.ts @@ -159,6 +159,6 @@ declare global { interface Navigator { windowControlsOverlay?: { getTitlebarAreaRect: () => DOMRect; - } + }; } } From 40fdb404ca7056474281062d8c5c956257e929ca Mon Sep 17 00:00:00 2001 From: Devin Binnie Date: Thu, 19 Sep 2024 16:33:08 -0400 Subject: [PATCH 4/6] Fix misalignment on Windows --- src/renderer/components/MainPage.tsx | 30 ++++++---- src/renderer/css/index.css | 89 +++++++++++----------------- 2 files changed, 52 insertions(+), 67 deletions(-) diff --git a/src/renderer/components/MainPage.tsx b/src/renderer/components/MainPage.tsx index 7e83f6ac322..69c4348a4ca 100644 --- a/src/renderer/components/MainPage.tsx +++ b/src/renderer/components/MainPage.tsx @@ -438,6 +438,22 @@ class MainPage extends React.PureComponent { const activeServer = this.state.servers.find((srv) => srv.id === this.state.activeServerId); + let titleBarSpacing; + if (window.process.platform !== 'darwin') { + if (this.state.fullScreen) { + titleBarSpacing = ( +
+ +
+ ); + } else { + titleBarSpacing = (); + } + } + const topRow = ( { developerMode={this.state.developerMode} /> {downloadsDropdownButton} - {window.process.platform !== 'darwin' && - - } - {window.process.platform !== 'darwin' && this.state.fullScreen && - -
- -
- - } + {titleBarSpacing}
); diff --git a/src/renderer/css/index.css b/src/renderer/css/index.css index 24a2286a1c9..67ee54f144c 100644 --- a/src/renderer/css/index.css +++ b/src/renderer/css/index.css @@ -113,10 +113,6 @@ body { color: rgba(243,243,243,0.7); } -.topBar.darkMode .title-bar-btns { - color: rgba(243,243,243,0.7); -} - .topBar .app-title { position: absolute; top: 0; @@ -139,58 +135,43 @@ body { color: rgba(221,221,221,0.64); } -.topBar .title-bar-btns { - position: relative; - line-height: 40px; - height: 40px; - z-index: 9; - color: rgba(61,60,64,0.7); - -webkit-app-region: no-drag; - display: grid; - grid-template-columns: repeat(3, 46px); -} - -.topBar .title-bar-btns>.button { - grid-row: 1 / span 1; +.full-screen-button { + align-items: center; + background: transparent; + border-radius: 4px; + border: none; + cursor: pointer; display: flex; + flex-direction: column; justify-content: center; - align-items: center; - width: 100%; - height: 100%; - user-select: none; -} - -.topBar.darkMode .title-bar-btns>.button:hover { - background: rgba(255,255,255,0.1); -} - -.topBar.darkMode .title-bar-btns>.button:active { - background: rgba(255,255,255,0.2); -} - -.topBar .title-bar-btns>.button:hover { - background: rgba(0,0,0,0.1); -} - -.topBar .title-bar-btns>.button:active { - background: rgba(0,0,0,0.2); -} - -.topBar .title-bar-btns>.full-screen-button { - font-size: 18px; -} - -.topBar .title-bar-btns img { - opacity: 0.7; -} - -.topBar.darkMode .title-bar-btns img { - filter: invert(100%); - -webkit-filter: invert(100%); -} - -.topBar .title-bar-btns>.close-button, .topBar .title-bar-btns>.full-screen-button { - grid-column: 3; + margin: 4px; + position: relative; + width: 32px; + + i { + color: rgba(63, 67, 80, 0.56); + cursor: pointer; + font-size: 21px; + line-height: 21px; + } + + &:hover, &:focus { + i { + color: rgba(63, 67, 80, 0.78); + } + } + + &.darkMode { + i { + color: rgba(221, 223, 228, 0.56); + } + + &:hover, &:focus { + i { + color: rgba(221, 223, 228, 0.78); + } + } + } } .topBar .overlay-gradient { From 080766a16741c0e33741fb8598103c99604e7d88 Mon Sep 17 00:00:00 2001 From: Devin Binnie Date: Thu, 19 Sep 2024 17:03:16 -0400 Subject: [PATCH 5/6] "fix" linux --- src/renderer/components/MainPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/renderer/components/MainPage.tsx b/src/renderer/components/MainPage.tsx index 69c4348a4ca..469b17e0299 100644 --- a/src/renderer/components/MainPage.tsx +++ b/src/renderer/components/MainPage.tsx @@ -440,7 +440,7 @@ class MainPage extends React.PureComponent { let titleBarSpacing; if (window.process.platform !== 'darwin') { - if (this.state.fullScreen) { + if (this.state.fullScreen && window.process.platform !== 'linux') { titleBarSpacing = (
Date: Fri, 20 Sep 2024 14:12:05 -0400 Subject: [PATCH 6/6] Return to inline version, ignore Linux --- src/renderer/components/MainPage.tsx | 28 +++++++++++----------------- 1 file changed, 11 insertions(+), 17 deletions(-) diff --git a/src/renderer/components/MainPage.tsx b/src/renderer/components/MainPage.tsx index 469b17e0299..ac6c4b28268 100644 --- a/src/renderer/components/MainPage.tsx +++ b/src/renderer/components/MainPage.tsx @@ -438,22 +438,6 @@ class MainPage extends React.PureComponent { const activeServer = this.state.servers.find((srv) => srv.id === this.state.activeServerId); - let titleBarSpacing; - if (window.process.platform !== 'darwin') { - if (this.state.fullScreen && window.process.platform !== 'linux') { - titleBarSpacing = ( -
- -
- ); - } else { - titleBarSpacing = (); - } - } - const topRow = ( { developerMode={this.state.developerMode} /> {downloadsDropdownButton} - {titleBarSpacing} + {window.process.platform !== 'darwin' && this.state.fullScreen && ( +
+ +
+ )} + {window.process.platform !== 'darwin' && !this.state.fullScreen && ( + + )}
);