Add option to hide the title bar

This commit is contained in:
simurai 2016-10-15 19:12:53 +09:00
parent a7f049008a
commit ed2c72a586
5 changed files with 69 additions and 9 deletions

View File

@ -692,9 +692,11 @@ class AtomEnvironment extends Model
@deserialize(state) if state?
@deserializeTimings.atom = Date.now() - startTime
if process.platform is 'darwin' and @config.get('core.useCustomTitleBar')
if process.platform is 'darwin' and @config.get('core.titleBar') is 'custom'
@workspace.addHeaderPanel({item: new TitleBar({@workspace, @themes, @applicationDelegate})})
@document.body.classList.add('custom-title-bar')
if process.platform is 'darwin' and @config.get('core.titleBar') is 'hidden'
@document.body.classList.add('hidden-title-bar')
@document.body.appendChild(@views.getView(@workspace))
@backgroundStylesheet?.remove()

View File

@ -272,7 +272,8 @@ if process.platform in ['win32', 'linux']
description: 'Automatically hide the menu bar and toggle it by pressing Alt. This is only supported on Windows & Linux.'
if process.platform is 'darwin'
module.exports.core.properties.useCustomTitleBar =
type: 'boolean'
default: false
description: 'Use custom, theme-aware title bar.<br>Note: This currently does not include a proxy icon.<br>This setting will require a relaunch of Atom to take effect.'
module.exports.core.properties.titleBar =
type: 'string'
default: 'native'
enum: ['native', 'custom', 'hidden']
description: 'Use a custom, theme-aware title bar or hide the title bar altogether.<br>Note: Switching to a custom or hidden title bar will compromise some functionality.<br>This setting will require a relaunch of Atom to take effect.'

View File

@ -83,7 +83,7 @@ class AtomApplication
initialize: (options) ->
global.atomApplication = this
@config.onDidChange 'core.useCustomTitleBar', @promptForRestart
@config.onDidChange 'core.titleBar', @promptForRestart
@autoUpdateManager = new AutoUpdateManager(@version, options.test, @resourcePath, @config)
@applicationMenu = new ApplicationMenu(@version, @autoUpdateManager)

View File

@ -43,6 +43,9 @@ class AtomWindow
if process.platform is 'linux'
options.icon = @constructor.iconPath
if @shouldAddCustomTitleBar()
options.titleBarStyle = 'hidden'
if @shouldHideTitleBar()
options.titleBarStyle = 'hidden-inset'
@ -227,10 +230,15 @@ class AtomWindow
[width, height] = @browserWindow.getSize()
{x, y, width, height}
shouldAddCustomTitleBar: ->
not @isSpec and
process.platform is 'darwin' and
@atomApplication.config.get('core.titleBar') is 'custom'
shouldHideTitleBar: ->
not @isSpec and
process.platform is 'darwin' and
@atomApplication.config.get('core.useCustomTitleBar')
@atomApplication.config.get('core.titleBar') is 'hidden'
close: -> @browserWindow.close()

View File

@ -1,7 +1,9 @@
@import "ui-variables";
// Custom Title Bar -------------------------------
@title-bar-text-size: 13px;
@title-bar-height: 36px;
@title-bar-height: 23px;
@title-bar-background-color: @base-background-color;
@title-bar-border-color: @base-border-color;
@ -23,7 +25,7 @@ body.fullscreen .title-bar {
-webkit-user-select: none;
-webkit-app-region: drag;
padding: 0 77px;
padding: 0 70px;
overflow: hidden;
.title {
@ -40,3 +42,50 @@ body.fullscreen .title-bar {
color: @text-color-subtle;
}
}
// Hidden Title Bar -------------------------------
.hidden-title-bar {
// Add space for the traffic lights
atom-panel-container.left {
padding-top: 36px;
// TODO: The .fullscreen class doesn't seem to get added
// So this has currently no effect
.fullscreen & {
padding-top: 0;
}
}
// Avoid tabs from overlap window controls when sidebar is closed
atom-panel-container.left:empty + atom-workspace-axis.vertical .tab-bar,
atom-panel-container.left:empty + atom-workspace-axis.vertical atom-panel-container.top {
padding-left: 77px;
}
// Enable dragging
atom-panel-container.left,
.tree-view,
.tab-bar,
.status-bar {
-webkit-app-region: drag;
}
// Disable dragging (on child elements)
.tree-view > li,
.tree-view-resize-handle,
.tab {
-webkit-app-region: no-drag;
}
// Modal
atom-panel.modal {
// padding: 0 77px;
top: 36px;
border-top-left-radius: @component-border-radius;
border-top-right-radius: @component-border-radius;
}
}