SymphonyElectron/js/windowsTitleBar/style.css
Kiran Niranjan d1c1e3caa2 Electron-486 (Add an option to configure Windows 10 title bar) (#389)
- Initial title bar menu item implementation
- Allow users to customization title bar style
- Add separators for menu item and hide action items
- Fix menu item separator and bold text in installer
2018-06-06 17:27:10 +05:30

107 lines
2.0 KiB
CSS

#title-bar {
display: flex;
position: fixed;
background: rgba(74,74,74,1);
top: 0;
left: 0;
width: 100%;
height: 32px;
padding-left: 0;
justify-content: center;
align-items: center;
-webkit-app-region: drag;
-webkit-user-select: none;
box-sizing: content-box;
z-index: 1000;
}
#hamburger-menu-button {
color: rgba(255,255,255,1);
text-align: center;
width: 40px;
height: 32px;
background: none;
border: none;
border-image: initial;
display: inline-grid;
border-radius: 0;
padding: 11px;
box-sizing: border-box;
cursor: default;
}
#hamburger-menu-button:focus {
outline: none;
}
#title-container {
height: 32px;
flex: 1;
display: flex;
justify-content: flex-start;
align-items: center;
white-space: nowrap;
overflow: hidden;
}
#title-bar-title {
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
color: white;
margin: 0;
padding-left: 10px;
font-size: 13px;
}
.title-bar-button-container {
justify-content: center;
align-items: center;
right: 0;
color: rgba(255,255,255,1);
-webkit-app-region: no-drag;
text-align: center;
width: 45px;
height: 32px;
background: rgba(74,74,74,1);
margin: 0;
box-sizing: border-box !important;
cursor: default;
}
.title-bar-button {
color: rgba(255,255,255,1);
text-align: center;
width: 45px;
height: 32px;
background: none;
border: none;
border-image: initial;
display: inline-grid;
border-radius: 0;
padding: 10px 15px;
cursor: default;
}
.title-bar-button:hover {
background-color: rgba(51,51,51,1);
}
.title-bar-button:focus {
outline: none;
}
.title-bar-button-container:hover {
background-color: rgba(51,51,51,1);
}
.window-border {
border-left: 1px solid rgba(74,74,74,1);
border-right: 1px solid rgba(74,74,74,1);
}
.bottom-window-border {
position: fixed;
border-bottom: 1px solid rgba(74,74,74,1);
width: 100%;
z-index: 3000;
bottom: 0;
}