ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 18:46:40 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix the UI for nav bar (#937)

Browse Source
This commit is contained in:
Abbie Petchtes
2018-03-19 20:38:04 -07:00
committed by GitHub
parent 3c3d8417e9
commit fe496ab03b
2 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/sql/base/browser/ui/panel/media/panel.css
View File

@@ -44,14 +44,26 @@ panel {
padding-bottom: 4px; padding-bottom: 4px;
} }
.tabbedPanel .tabList .tab-header {
display: flex;
}
.tabbedPanel.vertical .tabList .tab-header {
display: block;
text-transform: none;
text-overflow: ellipsis;
overflow: hidden;
width: 63px;
height: 50px;
line-height: 45px;
}
.tabbedPanel .tabList .tab .tabLabel.icon { .tabbedPanel .tabList .tab .tabLabel.icon {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center 10px; background-position: center center;
background-size: 25px; background-size: 25px;
line-height: 15px; padding: 20px 20px;
padding-top: 40px; line-height: 50px;
display: inline-block;
text-transform: none;
} }
.tabbedPanel .tabList .tab-header { .tabbedPanel .tabList .tab-header {

5
src/sql/base/browser/ui/panel/tabHeader.component.ts
View File

@@ -19,10 +19,9 @@ import { CloseTabAction } from './tabActions';
@Component({ @Component({
selector: 'tab-header', selector: 'tab-header',
template: ` template: `
<div #actionHeader class="tab-header" style="display: flex; flex: 0 0; flex-direction: row;" [class.active]="tab.active" tabindex="0" (keyup)="onKey($event)"> <div #actionHeader class="tab-header" style="flex: 0 0; flex-direction: row;" [class.active]="tab.active" tabindex="0" (keyup)="onKey($event)">
<span class="tab" (click)="selectTab(tab)"> <span class="tab" (click)="selectTab(tab)">
<a class="tabLabel" [class.active]="tab.active" #tabLabel> <a class="tabLabel" [class.active]="tab.active" #tabLabel>
{{tab.title}}
</a> </a>
</span> </span>
<span #actionbar style="flex: 0 0 auto; align-self: end; margin-top: auto; margin-bottom: auto;" ></span> <span #actionbar style="flex: 0 0 auto; align-self: end; margin-top: auto; margin-bottom: auto;" ></span>
@@ -62,7 +61,9 @@ export class TabHeaderComponent extends Disposable implements AfterContentInit,
tabLabelcontainer.classList.add(this.tab.iconClass); tabLabelcontainer.classList.add(this.tab.iconClass);
} else { } else {
tabLabelcontainer.className = 'tabLabel'; tabLabelcontainer.className = 'tabLabel';
tabLabelcontainer.innerHTML = this.tab.title;
} }
tabLabelcontainer.title = this.tab.title;
} }
ngOnDestroy() { ngOnDestroy() {