mirror of
https://github.com/Eugeny/tabby.git
synced 2024-09-11 13:13:59 +03:00
parent
c18936f6e5
commit
f08bf49b62
@ -13,6 +13,7 @@
|
||||
background: @body-bg;
|
||||
}
|
||||
|
||||
@titlebar-height: 35px;
|
||||
@tabs-height: 40px;
|
||||
@tab-border-radius: 4px;
|
||||
|
||||
@ -28,6 +29,35 @@
|
||||
}
|
||||
}
|
||||
|
||||
.titlebar {
|
||||
height: @titlebar-height;
|
||||
background: #141c23;
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.title {
|
||||
flex: auto;
|
||||
padding-left: 15px;
|
||||
line-height: @titlebar-height;
|
||||
-webkit-app-region: drag;
|
||||
}
|
||||
|
||||
.btn-minimize, .btn-maximize, .btn-close {
|
||||
flex: none;
|
||||
line-height: @titlebar-height - 2px;
|
||||
padding: 0 15px;
|
||||
font-size: 8px;
|
||||
|
||||
.button-states();
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-close {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
flex: none;
|
||||
height: @tabs-height;
|
||||
@ -36,29 +66,28 @@
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
&>button {
|
||||
border: none;
|
||||
flex: none;
|
||||
line-height: @tabs-height;
|
||||
.btn-settings, .btn-new-tab, .tab {
|
||||
line-height: @tabs-height - 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-new-tab, .btn-settings {
|
||||
padding: 0 15px;
|
||||
font-size: 8px;
|
||||
flex: none;
|
||||
flex-grow: 0;
|
||||
border-bottom: 2px solid transparent;
|
||||
transition: 0.25s all;
|
||||
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
color: #888;
|
||||
background: #141c23;
|
||||
|
||||
i {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.button-states();
|
||||
cursor: pointer;
|
||||
|
||||
&.btn-close {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&.btn-new-tab {
|
||||
border-bottom-left-radius: @tab-border-radius;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&.btn-settings {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.tab {
|
||||
@ -66,12 +95,6 @@
|
||||
flex-basis: 0;
|
||||
flex-grow: 1000;
|
||||
|
||||
&:active {
|
||||
-webkit-app-region: drag;
|
||||
}
|
||||
|
||||
line-height: @tabs-height - 2px;
|
||||
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
min-width: 0;
|
||||
@ -157,6 +180,8 @@
|
||||
.content-wrapper {
|
||||
//border-bottom: 2px solid #69bbea;
|
||||
background: @body-bg;
|
||||
border-top-left-radius: @tab-border-radius;
|
||||
border-top-right-radius: @tab-border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,3 +1,12 @@
|
||||
.titlebar
|
||||
.title((dblclick)='hostApp.maximizeWindow()') Term
|
||||
.btn-minimize((click)='hostApp.minimizeWindow()')
|
||||
i.fa.fa-window-minimize
|
||||
.btn-maximize((click)='hostApp.maximizeWindow()')
|
||||
i.fa.fa-window-maximize
|
||||
.btn-close((click)='hostApp.quit()')
|
||||
i.fa.fa-close
|
||||
|
||||
.tabs
|
||||
.tab(
|
||||
*ngFor='let tab of tabs; let idx = index; trackBy: tab?.id',
|
||||
@ -11,16 +20,11 @@
|
||||
div.index {{idx + 1}}
|
||||
div.name {{tab.name || 'Terminal'}}
|
||||
button((click)='closeTab(tab)') ×
|
||||
button.btn-new-tab((click)='newTab()')
|
||||
.btn-new-tab((click)='newTab()')
|
||||
i.fa.fa-plus
|
||||
button.btn-settings((click)='showSettings()')
|
||||
span Tab
|
||||
.btn-settings((click)='showSettings()')
|
||||
i.fa.fa-cog
|
||||
button.btn-minimize((click)='hostApp.minimizeWindow()')
|
||||
i.fa.fa-window-minimize
|
||||
button.btn-maximize((click)='hostApp.maximizeWindow()')
|
||||
i.fa.fa-window-maximize
|
||||
button.btn-close((click)='hostApp.quit()')
|
||||
i.fa.fa-close
|
||||
|
||||
.tabs-content
|
||||
.tab(*ngFor='let tab of tabs; trackBy: tab?.id', [class.active]='tab == activeTab')
|
||||
|
Loading…
Reference in New Issue
Block a user