+
- {list[Math.floor(Math.random() * list.length)].icon(21)}
+ {list[Math.floor(Math.random() * list.length)].icon(16)}
-
{ensName}
+ {/*
{ensName}
*/}
{`${address.substr(0, 6)}...${address.substr(address.length - 4, address.length)}`}
diff --git a/app/workspace/Ribbon/Native/index.js b/app/workspace/Ribbon/Native/index.js
new file mode 100644
index 000000000..88a8fdefd
--- /dev/null
+++ b/app/workspace/Ribbon/Native/index.js
@@ -0,0 +1,153 @@
+import React from 'react'
+import link from '../../../../resources/link'
+import svg from '../../../../resources/svg'
+import useStore from '../../../../resources/Hooks/useStore.js'
+import styled from 'styled-components'
+import {
+ NativeControls,
+ LinuxControls,
+ LinuxControlsButton,
+ WindowsControls,
+ WindowsControlsButton,
+ MacControls,
+ MacTitleButton,
+ MacTitleClose,
+ MacTitleMin,
+ MacTitleFull
+} from './styled'
+
+const NavigationContainer = styled.div`
+ position: absolute;
+ top: 0px;
+ left: 8px;
+ bottom: 0px;
+ z-index: 9999;
+ display: flex;
+ background: red;
+`
+
+const NavBack = styled.div`
+ height: 26px;
+ width: 26px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ margin: 8px 0px;
+ border-radius: 7px;
+ background: red;
+ -webkit-app-region: no-drag;
+ &:hover {
+ background: var(--ghostB);
+ box-shadow: 1px 1px 4px var(--ghostZ), -1px -1px 4px var(--ghostA);
+ }
+ * {
+ pointer-events: none;
+ }
+`
+
+const RotatedSpan = styled.span`
+ transform: rotate(180deg);
+`
+
+const Navigation = () => (
+
+ link.send('workspace:nav:back', window.frameId)}>{svg.chevronLeft(14)}
+ link.send('workspace:nav:forward', window.frameId)}>
+ {svg.chevronLeft(14)}
+
+
+)
+
+const handleClose = () => link.send('frame:close')
+const handleMin = () => link.send('frame:min')
+const handleMax = () => link.send('frame:max')
+const handleUnmax = () => link.send('frame:unmax')
+const handleFull = () => link.send('frame:full')
+const handleUnfull = () => link.send('frame:unfull')
+
+const Title = () => {
+ const platform = useStore('platform')
+ const { fullscreen, maximized, focused } = useStore('windows.workspaces', window.frameId)
+
+ return (
+
+ {/* */}
+ {platform === 'darwin' ? (
+
+
+
+
+
+
+
+
+ {maximized || fullscreen ? (
+
+ ) : (
+
+ )}
+
+
+ ) : platform === 'win32' ? (
+ <>
+
+
+
+
+ {maximized || fullscreen ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
+
+
+
+
+ ) : (
+ <>
+
+
+
+
+ {maximized || fullscreen ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
+
+
+
+
+ )}
+
+ )
+}
+
+export default Title
diff --git a/app/workspace/Dock/Native/styled/index.js b/app/workspace/Ribbon/Native/styled/index.js
similarity index 65%
rename from app/workspace/Dock/Native/styled/index.js
rename to app/workspace/Ribbon/Native/styled/index.js
index 816df92ab..a6fc6e877 100644
--- a/app/workspace/Dock/Native/styled/index.js
+++ b/app/workspace/Ribbon/Native/styled/index.js
@@ -1,38 +1,8 @@
import styled, { css } from 'styled-components'
export const NativeControls = styled.div`
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- height: 37px;
- /* border-bottom: 1px solid var(--ghostZ); */
-`
-
-export const MacGrab = styled.div`
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- -webkit-app-region: drag;
-`
-
-export const MacControls = styled.div`
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- width: 74px;
-`
-
-export const LinuxGrab = styled.div`
- position: absolute;
- top: 0;
- right: 104px;
- bottom: 0;
- left: 0;
- -webkit-app-region: drag;
+ height: 40px;
+ width: 80px;
`
export const LinuxControls = styled.div`
@@ -69,6 +39,12 @@ export const LinuxControlsButton = styled.div`
&:hover {
background: rgba(255, 255, 255, 0.1);
}
+
+ -webkit-app-region: no-drag;
+ cursor: pointer;
+ * {
+ pointer-events: none;
+ }
`
export const WindowsGrab = styled.div`
@@ -86,6 +62,8 @@ export const WindowsControls = styled.div`
right: 1px;
bottom: 0;
display: flex;
+ justify-content: center;
+ align-items: center;
`
export const WindowsControlsButton = styled.div`
@@ -96,6 +74,11 @@ export const WindowsControlsButton = styled.div`
align-items: center;
color: white;
border-radius: 4px;
+ -webkit-app-region: no-drag;
+ cursor: pointer;
+ * {
+ pointer-events: none;
+ }
svg {
position: relative;
@@ -111,61 +94,76 @@ export const WindowsControlsButton = styled.div`
}
`
-export const MacTitle = styled.div`
- height: 30px;
- position: absolute;
- top: 0;
- left: 0;
- padding: 0px 5px 0px 5px;
- z-index: 50000;
- display: flex;
- justify-content: center;
- align-items: center;
-
- &:hover {
- .titleClose {
- background: #fc615d;
- }
-
- .titleMin {
- background: #fdbd41;
- }
-
- .titleFull {
- background: #34c84a;
- }
- }
-`
-
export const MacTitleButton = styled.div`
- height: 30px;
- width: 30px;
+ height: 24px;
+ width: 24px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
`
-export const TitleClose = styled.div`
+export const MacTitleClose = styled.div`
width: 12px;
height: 12px;
- background: rgba(0, 0, 50, 0.15);
+ background: rgba(124, 124, 124, 0.24);
border-radius: 50%;
- pointer-events: none;
+ cursor: pointer;
`
-export const TitleMin = styled.div`
+export const MacTitleMin = styled.div`
width: 12px;
height: 12px;
- background: rgba(0, 0, 50, 0.15);
+ background: rgba(124, 124, 124, 0.24);
border-radius: 50%;
- pointer-events: none;
+ cursor: pointer;
`
-export const TitleFull = styled.div`
+export const MacTitleFull = styled.div`
width: 12px;
height: 12px;
- background: rgba(0, 0, 50, 0.15);
+ background: rgba(124, 124, 124, 0.24);
border-radius: 50%;
- pointer-events: none;
+ cursor: pointer;
+
+ /* &:hover {
+ background: #34c84a;
+ } */
+`
+export const MacControls = styled.div`
+ height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ -webkit-app-region: no-drag;
+
+ &:hover {
+ ${MacTitleClose} {
+ background: #fc615d;
+ }
+
+ ${MacTitleMin} {
+ background: #fdbd41;
+ }
+
+ ${MacTitleFull} {
+ background: #34c84a;
+ }
+ }
+
+ ${({ focused }) =>
+ focused &&
+ `
+ ${MacTitleClose} {
+ background: #fc615d;
+ }
+
+ ${MacTitleMin} {
+ background: #fdbd41;
+ }
+
+ ${MacTitleFull} {
+ background: #34c84a;
+ }
+ `}
`
diff --git a/app/workspace/Ribbon/index.js b/app/workspace/Ribbon/index.js
new file mode 100644
index 000000000..00147c0a0
--- /dev/null
+++ b/app/workspace/Ribbon/index.js
@@ -0,0 +1,224 @@
+import styled from 'styled-components'
+
+import Native from './Native'
+import Account from './Account'
+
+import link from '../../../resources/link'
+import svg from '../../../resources/svg'
+import useStore from '../../../resources/Hooks/useStore'
+
+const Ribbon = styled.div`
+ position: absolute;
+ top: 12px;
+ right: 12px;
+ left: 12px;
+ height: 36px;
+ z-index: 999999;
+ pointer-events: auto;
+ align-items: center;
+ text-align: center;
+ display: flex;
+ justify-content: space-between;
+ transform: translate3d(0, 0, 0);
+`
+
+const RibbonSection = styled.div`
+ height: 32px;
+ border-radius: 12px;
+ overflow: hidden;
+ z-index: 999999;
+ background: var(--ghostAZ);
+ opacity: 1;
+ border-bottom: 1px solid var(--ghostZ);
+ box-shadow: 0px 2px 8px -2px var(--ghostY), 0px -3px 6px -2px var(--ghostB);
+ display: flex;
+`
+
+const Options = styled.div`
+ font-size: 13px;
+ font-weight: 400;
+ display: flex;
+ height: 100%;
+`
+const OptionButton = styled.div`
+ width: 64px;
+ height: 100%;
+ border-left: 1px solid var(--ghostZ);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ -webkit-app-region: no-drag;
+ * {
+ pointer-events: none;
+ }
+ &:hover {
+ background: var(--ghostA);
+ }
+`
+
+export const TopBackdrop = styled.div`
+ position: fixed;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ left: 0px;
+ height: 120px;
+ z-index: 99999;
+ backdrop-filter: blur(8px);
+ pointer-events: none;
+ mask-image: linear-gradient(to bottom, black 32px, transparent);
+ -webkit-mask-image: linear-gradient(to bottom, black 32px, transparent);
+
+ &:after {
+ content: '';
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ left: 0px;
+ z-index: 1;
+ background: linear-gradient(90deg, var(--ghostZ) 5%, transparent 10%, transparent 90%, var(--ghostZ) 95%);
+ }
+`
+
+export const TopFade = styled.div`
+ position: fixed;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ left: 0px;
+ height: 120px;
+ z-index: 199999;
+ pointer-events: none;
+
+ /* background: red; */
+ background: linear-gradient(-180deg, var(--ghostY) 0%, transparent 100%);
+
+ &:after {
+ content: '';
+ position: absolute;
+ inset: 0px;
+ opacity: 0.8;
+ background: linear-gradient(-180deg, var(--ghostZ) 25%, transparent 100%);
+ }
+`
+
+const NavigationContainer = styled.div`
+ z-index: 9999;
+ display: flex;
+ height: 40px;
+ width: 80px;
+`
+const NavBack = styled.div`
+ height: 26px;
+ width: 26px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ margin: 8px 0px;
+ border-radius: 7px;
+ -webkit-app-region: no-drag;
+ &:hover {
+ background: var(--ghostB);
+ box-shadow: 1px 1px 4px var(--ghostZ), -1px -1px 4px var(--ghostA);
+ }
+ * {
+ pointer-events: none;
+ }
+`
+
+const RibbonCenter = styled.div`
+ display: flex;
+ margin: 4px 0px 0px 0px;
+ > * {
+ margin: 0 4px;
+ }
+`
+
+const Navigation = () => {
+ return (
+
+ {
+ link.send('workspace:nav:back', window.frameId)
+ }}
+ >
+ {svg.chevronLeft(14)}
+
+ {
+ link.send('workspace:nav:forward', window.frameId)
+ }}
+ >
+ {svg.chevronLeft(14)}
+
+
+ )
+}
+
+export default () => {
+ const frameState = useStore('windows.workspaces', frameId)
+ const nav = frameState?.nav[0] || { space: 'command', data: {} }
+ if (!nav || !nav.space) return null
+
+ const { space } = nav
+
+ const platform = useStore('platform')
+
+ return (
+ <>
+
+
+
+
+
+ {
+ link.send('workspace:nav', window.frameId, 'accounts')
+ }}
+ >
+ {svg.chevron(24)}
+
+
+
+
+ {
+ link.send('workspace:nav', window.frameId, 'accounts')
+ }}
+ >
+ {svg.accounts(14)}
+
+ {
+ link.send('workspace:nav', window.frameId, 'chains')
+ }}
+ >
+ {svg.chain(16)}
+
+ {
+ link.send('workspace:nav', window.frameId, 'dapps')
+ }}
+ >
+ {svg.window(13)}
+
+ {
+ link.send('workspace:nav', window.frameId, 'settings')
+ }}
+ >
+ {svg.settings(14)}
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/app/workspace/Spaces/Accounts/AccountManager/styled/index.js b/app/workspace/Spaces/Accounts/AccountManager/styled/index.js
index 62aae87ef..9e290bc44 100644
--- a/app/workspace/Spaces/Accounts/AccountManager/styled/index.js
+++ b/app/workspace/Spaces/Accounts/AccountManager/styled/index.js
@@ -37,8 +37,6 @@ export const cardDown = keyframes`
`
export const AccountManagerWrap = styled.div`
- position: absolute;
- inset: 8px;
z-index: 99999999999;
pointer-events: none;
/* animation: cardShow 400ms linear both; */
diff --git a/app/workspace/Spaces/Command/index.js b/app/workspace/Spaces/Command/index.js
index ce070537d..4e7f17c5e 100644
--- a/app/workspace/Spaces/Command/index.js
+++ b/app/workspace/Spaces/Command/index.js
@@ -6,13 +6,12 @@ import React from 'react'
import { Cluster, ClusterRow, ClusterValue } from '../../../../resources/Components/Cluster'
const Container = styled.div`
+ position: relative;
display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- height: 100%;
- width: 100%;
- /* background: var(--ghostA); */
+ flex-direction: row;
+ margin: auto auto;
+ width: 900px;
+ padding-left: 64px;
`
const MainButton = styled.div`
@@ -41,7 +40,7 @@ const DappRow = styled.div`
const DappIcon = styled.div`
width: 42px;
height: 42px;
- margin: 8px;
+ margin: 0px 0px 16px 0px;
background: var(--ghostAZ);
border-radius: 16px;
display: flex;
@@ -141,10 +140,60 @@ class Settings extends React.Component {
}
}
+const HomeLeft = styled.div`
+ position: absolute;
+ height: 100%;
+ width: 32px;
+ left: 0;
+`
+const HomeCenter = styled.div`
+ height: 400px;
+ width: 65%;
+ min-height: 100%;
+ border-radius: 16px;
+`
+const HomeRight = styled.div`
+ width: 35%;
+ min-height: 550px;
+ border-radius: 16px;
+ background: var(--ghostAZ);
+ margin-left: 16px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+`
+const CommandBar = styled.div`
+ height: 64px;
+ width: 100%;
+ border-radius: 16px;
+ background: var(--ghostAZ);
+ margin-bottom: 16px;
+`
+const Portfolio = styled.div`
+ height: 200px;
+ width: 100%;
+ border-radius: 16px;
+ background: var(--ghostAZ);
+ margin-bottom: 16px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+`
+
+const AssetList = styled.div`
+ height: 200px;
+ width: 100%;
+ border-radius: 16px;
+ background: var(--ghostAZ);
+ margin-bottom: 16px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+`
+
const Home = ({ data }) => (
- {/* {'current account'} */}
-
+
{
link.send('workspace:run', 'dapp', {}, ['send.frame.eth'])
@@ -155,14 +204,20 @@ const Home = ({ data }) => (
-
-
-
-
-
+
+
+
+
+ Value
+ Assets
+ Inventory
+
+
+ {'Account activity'}
+
)
diff --git a/app/workspace/Spaces/Views/index.js b/app/workspace/Spaces/Views/index.js
index bd4a70acc..374a7e29e 100644
--- a/app/workspace/Spaces/Views/index.js
+++ b/app/workspace/Spaces/Views/index.js
@@ -44,8 +44,8 @@ const Error = ({ isMainnetConnected }) => {
const ViewWrap = styled.div`
position: absolute;
- top: 8px;
- left: 0px;
+ top: 80px;
+ left: 8px;
right: 8px;
bottom: 8px;
z-index: 99999999;
@@ -91,7 +91,7 @@ const App = ({ id }) => {
return (
<>
-
+
{/*
{shouldDisplayError ? (
diff --git a/app/workspace/Workspace.js b/app/workspace/Workspace.js
index 9f224b869..327da58b8 100644
--- a/app/workspace/Workspace.js
+++ b/app/workspace/Workspace.js
@@ -14,7 +14,7 @@ import Dapps from './Spaces/Dapps'
import Views from './Spaces/Views'
import Onboard from '../onboard/App'
-import Dock from './Dock'
+import Ribbon from './Ribbon'
const Splash = styled.div`
position: fixed;
@@ -29,7 +29,7 @@ const Splash = styled.div`
const Main = styled.div`
position: absolute;
top: 0px;
- left: 316px;
+ left: 0px;
bottom: 0px;
right: 0px;
color: var(--outerspace);
@@ -46,17 +46,41 @@ const Space = ({ space, data }) => {
if (space === 'command') {
return
} else if (space === 'dapp') {
- return
+ return (
+
+
+
+ )
} else if (space === 'settings') {
- return
+ return (
+
+
+
+ )
} else if (space === 'onboard') {
- return
+ return (
+
+
+
+ )
} else if (space === 'chains') {
- return
+ return (
+
+
+
+ )
} else if (space === 'dapps') {
- return
+ return (
+
+
+
+ )
} else if (space === 'accounts') {
- return
+ return (
+
+
+
+ )
} else {
return (
@@ -74,9 +98,11 @@ const SpaceWrap = styled.div`
right: 0;
bottom: 0;
left: 0;
- padding: 32px 0px;
+ margin: auto auto;
+ padding: 128px 0px;
overflow-y: scroll;
overflow-x: hidden;
+ max-width: 900px;
`
const TopHandle = styled.div`
@@ -84,7 +110,7 @@ const TopHandle = styled.div`
top: 0px;
left: 0px;
right: 0px;
- height: 32px;
+ height: 64px;
z-index: 999999999; // Top z-index
-webkit-app-region: drag;
pointer-events: none;
@@ -99,11 +125,9 @@ const Workspace = (props) => {
-
+
-
-
-
+
diff --git a/app/workspace/dash/Chains/style/index.styl b/app/workspace/dash/Chains/style/index.styl
index 0ea8f965f..b8666bab6 100644
--- a/app/workspace/dash/Chains/style/index.styl
+++ b/app/workspace/dash/Chains/style/index.styl
@@ -1,5 +1,5 @@
.network
- margin 6px 6px 4px 6px
+ margin 6px 6px 32px 6px
position relative
box-shadow 0px 4px 8px var(--ghostY)
border-radius 27px
@@ -78,11 +78,6 @@
height 84px
.localSettings
- position absolute
- top 0px
- right 0px
- bottom 0px
- left 0px
display flex
justify-content center
flex-direction column
diff --git a/main/index.ts b/main/index.ts
index 2bcf3fe2c..95252801d 100644
--- a/main/index.ts
+++ b/main/index.ts
@@ -274,6 +274,14 @@ ipcMain.on('frame:unmax', (e) => {
windows.unmax(e)
})
+ipcMain.on('frame:full', (e) => {
+ windows.full(e)
+})
+
+ipcMain.on('frame:unfull', (e) => {
+ windows.unfull(e)
+})
+
dapps.add({
ens: 'send.frame.eth',
checkStatusRetryCount: 0,
diff --git a/main/windows/frames/frameInstances.ts b/main/windows/frames/frameInstances.ts
index 9e2c41c88..067c0e125 100644
--- a/main/windows/frames/frameInstances.ts
+++ b/main/windows/frames/frameInstances.ts
@@ -3,6 +3,7 @@ import path from 'path'
import { createWindow } from '../window'
import topRight from './topRight'
+import store from '../../store'
import { Workspace, Nav, View } from '../workspace/types'
@@ -36,8 +37,8 @@ export default {
y: 0,
width: 0,
height: 0,
- titleBarStyle: 'hidden',
- trafficLightPosition: { x: 20, y: 23 },
+ // titleBarStyle: 'hidden',
+ // trafficLightPosition: { x: 20, y: 23 },
icon: path.join(__dirname, './AppIcon.png')
})
@@ -75,6 +76,20 @@ export default {
// Show menu on macOS
// })
+ frameInstance.on('resize', () => {
+ Object.values(frameInstance.views || {}).forEach((viewInstance) => {
+ const { frameId } = frameInstance
+ // const { fullscreen } = store('windows.workspaces', frameId)
+ const { width, height } = frameInstance.getBounds()
+ viewInstance.setBounds({
+ x: 8,
+ y: 80 + 24,
+ width: width - 16,
+ height: height - 80 - 32 - 16
+ })
+ })
+ })
+
place(frameInstance)
return frameInstance
diff --git a/main/windows/frames/index.ts b/main/windows/frames/index.ts
index fa58d6b00..e1397cdef 100644
--- a/main/windows/frames/index.ts
+++ b/main/windows/frames/index.ts
@@ -46,10 +46,14 @@ export default class WorkspaceManager {
const frames = getFrames()
this.manageFrames(frames, inFocus)
this.manageViews(frames)
- // manageOverlays(frames)
+ // this.manageOverlays(frames)
})
}
+ manageOverlays(frames: Record, inFocus: string) {
+ // If there is an overlay, create a frame instance for it
+ }
+
manageFrames(frames: Record, inFocus: string) {
const frameIds = Object.keys(frames)
const instanceIds = Object.keys(this.frameInstances)
@@ -108,6 +112,11 @@ export default class WorkspaceManager {
frameInstance.views = frameInstance.views || {}
frameInstance.views[currentView]?.webContents?.focus()
}
+ store.updateFrame(frameId, { focused: true })
+ })
+
+ frameInstance.on('blur', () => {
+ store.updateFrame(frameId, { focused: false })
})
})
diff --git a/main/windows/frames/viewInstances.ts b/main/windows/frames/viewInstances.ts
index 3eef312c0..8c378ee9a 100644
--- a/main/windows/frames/viewInstances.ts
+++ b/main/windows/frames/viewInstances.ts
@@ -66,7 +66,7 @@ export default {
frameInstance.addBrowserView(viewInstance)
const dappBackground = store('main.dapps', view.dappId, 'colors', 'background')
- if (dappBackground) frameInstance.setBackgroundColor(dappBackground)
+ // if (dappBackground) frameInstance.setBackgroundColor(dappBackground)
viewInstance.webContents.setVisualZoomLevelLimits(1, 3)
@@ -130,13 +130,13 @@ export default {
// height: fullscreen ? height : height - 32
// })
viewInstance.setBounds({
- x: 316,
- y: 24,
- width: width - 316 - 8,
- height: height - 16 - 16 - 16
+ x: 8,
+ y: 80 + 24,
+ width: width - 16,
+ height: height - 80 - 32 - 16
})
// viewInstance.setBounds({ x: 73, y: 16, width: width - 73, height: height - 16 })
- viewInstance.setAutoResize({ width: true, height: true })
+ // viewInstance.setAutoResize({ width: true, height: true })
}
}
}
diff --git a/main/windows/index.ts b/main/windows/index.ts
index d3f523171..52e28f08a 100644
--- a/main/windows/index.ts
+++ b/main/windows/index.ts
@@ -620,6 +620,12 @@ export default {
close(e: IpcMainEvent) {
windowFromWebContents(e.sender).close()
},
+ full(e: IpcMainEvent) {
+ windowFromWebContents(e.sender).setFullScreen(true)
+ },
+ unfull(e: IpcMainEvent) {
+ windowFromWebContents(e.sender).setFullScreen(false)
+ },
max(e: IpcMainEvent) {
windowFromWebContents(e.sender).maximize()
},
diff --git a/main/windows/window.ts b/main/windows/window.ts
index e92b41584..4a2c4163b 100644
--- a/main/windows/window.ts
+++ b/main/windows/window.ts
@@ -36,7 +36,7 @@ export function createWindow(
acceptFirstMouse: true,
transparent: process.platform === 'darwin',
show: false,
- backgroundColor: COLORWAYS[store('main.colorway') as keyof typeof COLORWAYS]['background'],
+ // backgroundColor: COLORWAYS[store('main.colorway') as keyof typeof COLORWAYS]['background'],
skipTaskbar: process.platform !== 'linux',
webPreferences: {
...webPreferences,