mirror of
https://github.com/atom/atom.git
synced 2026-02-12 07:35:14 -05:00
157 lines
3.2 KiB
Plaintext
157 lines
3.2 KiB
Plaintext
|
|
// Theme config
|
|
// This gets changed from the theme settings
|
|
|
|
@theme-tabsizing: ~'theme-@{ui-theme-name}-tabsizing';
|
|
@theme-dockButtons: ~'theme-@{ui-theme-name}-dock-buttons';
|
|
@theme-stickyHeaders: ~'theme-@{ui-theme-name}-sticky-headers';
|
|
@theme-closeButton: ~'theme-@{ui-theme-name}-tab-close-button';
|
|
|
|
|
|
// Tabs ----------------------------------------------
|
|
|
|
@tab-min-width: 7em; // ~ icon + 6 characters
|
|
|
|
// Even (default)
|
|
|
|
.tab-bar {
|
|
.tab,
|
|
.tab.active {
|
|
flex: 1 1 0;
|
|
max-width: 22em;
|
|
min-width: @tab-min-width;
|
|
}
|
|
atom-dock & {
|
|
.tab,
|
|
.tab.active {
|
|
max-width: none;
|
|
}
|
|
}
|
|
|
|
// TODO: Turn this into a config
|
|
// Truncates the beginning instead
|
|
// .title.title.title {
|
|
// direction: rtl; // change direction
|
|
// }
|
|
}
|
|
|
|
|
|
// Maximum (full width)
|
|
|
|
[@{theme-tabsizing}="maximum"] .tab-bar {
|
|
.tab,
|
|
.tab.active {
|
|
max-width: none;
|
|
}
|
|
}
|
|
|
|
|
|
// Minimum (show long paths)
|
|
|
|
[@{theme-tabsizing}="minimum"] .tab-bar {
|
|
.tab,
|
|
.tab.active {
|
|
flex: 0 0 auto;
|
|
min-width: 2.75em;
|
|
max-width: @tab-min-width * 3.3;
|
|
}
|
|
atom-dock {
|
|
.tab,
|
|
.tab.active {
|
|
max-width: @tab-min-width * 2;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
// Tabs: close button position ------------------------------
|
|
|
|
[@{theme-closeButton}="left"] {
|
|
|
|
.tab-bar .tab {
|
|
.close-icon {
|
|
right: auto;
|
|
left: @icon-padding-right;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
|
|
// Hide docks toggle buttons ------------------------------
|
|
|
|
[@{theme-dockButtons}="hidden"] {
|
|
|
|
// Hide docks when not open
|
|
.atom-dock-inner:not(.atom-dock-open) {
|
|
display: none;
|
|
}
|
|
|
|
// Hide toggle buttons
|
|
.atom-dock-toggle-button {
|
|
display: none;
|
|
}
|
|
|
|
}
|
|
|
|
|
|
// Sticky Projects ------------------------------
|
|
|
|
[@{theme-stickyHeaders}="sticky"] {
|
|
|
|
.tree-view {
|
|
.project-root-header {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 3;
|
|
padding-left: 5px;
|
|
padding-right: 10px;
|
|
border-bottom: 1px solid @base-border-color;
|
|
background-color: @tree-view-background-color;
|
|
}
|
|
.project-root.project-root {
|
|
margin-left: -5px;
|
|
margin-right: -10px;
|
|
|
|
// Disable selection
|
|
&::before {
|
|
display: none;
|
|
}
|
|
|
|
// Add selection back
|
|
&.selected .project-root-header {
|
|
background-color: @background-color-selected;
|
|
}
|
|
}
|
|
&:focus .selected .project-root-header.project-root-header {
|
|
background: @button-background-color-selected;
|
|
}
|
|
|
|
// Fix sticky header from covering auto-revealed files
|
|
.entry.file.selected {
|
|
padding-top: @ui-tab-height;
|
|
margin-top: -@ui-tab-height;
|
|
}
|
|
|
|
// Fix sticky header from covering auto-revealed directories when using up/down keys
|
|
// for directories, scroll test moves to .header, see https://github.com/atom/tree-view/blob/d2857ad4d7eeb7dad5cf94b33257a8740211480e/lib/tree-view.coffee#L839
|
|
.entry.directory.selected:not(.project-root) {
|
|
& > .header {
|
|
padding-top: @ui-tab-height;
|
|
margin-top: -@ui-tab-height;
|
|
}
|
|
&::before {
|
|
margin-top: @ui-tab-height;
|
|
}
|
|
}
|
|
|
|
// Fix above directory is not being clickable
|
|
.entry.directory:not(.project-root) > .header {
|
|
z-index: 2;
|
|
}
|
|
.entry.directory.selected:not(.project-root) > .header {
|
|
z-index: 1;
|
|
}
|
|
}
|
|
}
|