Files
atom/static/title-bar.less
2016-10-25 15:27:42 +09:00

95 lines
2.0 KiB
Plaintext

@import "ui-variables";
// Custom Title Bar -------------------------------
@title-bar-text-size: 13px;
@title-bar-height: 23px;
@title-bar-background-color: @base-background-color;
@title-bar-border-color: @base-border-color;
body.fullscreen .title-bar {
margin-top: -@title-bar-height;
}
.title-bar {
box-sizing: content-box;
height: @title-bar-height;
transition: margin-top 160ms;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: @title-bar-text-size;
-webkit-user-select: none;
-webkit-app-region: drag;
padding: 0 70px;
overflow: hidden;
.title {
flex: 0 1 auto;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
background-color: @title-bar-background-color;
border-bottom: 1px solid @title-bar-border-color;
.is-blurred & {
color: @text-color-subtle;
}
}
// Hidden Title Bar -------------------------------
@traffic-lights-width: 78px;
@traffic-lights-height: 38px;
.hidden-title-bar:not(.fullscreen) {
atom-panel-container.header:empty + atom-workspace-axis.horizontal atom-panel-container.left {
min-width: 78px; // keep some width for traffic lights when tree-view is hidden
padding-top: @traffic-lights-height; // add space for traffic lights
}
// Add space for traffic lights in header panels
atom-panel.header:first-child {
box-sizing: content-box;
height: @traffic-lights-height;
padding-left: @traffic-lights-width;
overflow-x: auto;
overflow-y: hidden;
}
// Enable dragging
atom-panel-container.left,
.tree-view,
.tab-bar,
.status-bar,
atom-panel.header:first-child {
-webkit-app-region: drag;
}
// Disable dragging (on child elements)
.tree-view > li,
.tree-view-resize-handle,
.tab {
-webkit-app-region: no-drag;
}
}
// Modal -------------------------------
// Prevent traffic lights from overlapping modals
.custom-title-bar atom-panel.modal {
top: @title-bar-height;
}
.hidden-title-bar atom-panel.modal {
top: @traffic-lights-height;
}