Skip to content

Commit 3034659

Browse files
blakeembreyblakeembrey
committed
Merge pull request #607 from TypeStrong/bug/606-panel-heading-size
Tidy up the CSS for the bottom panel
2 parents 193ec30 + 6bb4273 commit 3034659

File tree

2 files changed

+50
-54
lines changed

2 files changed

+50
-54
lines changed

‎dist/main/atom/views/mainPanelView.js

Lines changed: 25 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -29,23 +29,19 @@ var MainPanelView = (function (_super) {
2929
var btn = function (view, text, className) {
3030
if (className === void 0) { className = ''; }
3131
return _this.button({
32-
'class': "btn " + className,
32+
'class': "btn btn-sm " + className,
3333
'click': view + "PanelSelectedClick",
34-
'outlet': view + "PanelBtn",
35-
'style': 'top:-2px!important'
34+
'outlet': view + "PanelBtn"
3635
}, text);
3736
};
3837
this.div({
39-
class: 'atomts atomts-main-panel-view native-key-bindings layout horizontal',
38+
class: 'atomts atomts-main-panel-view native-key-bindings',
39+
style: 'padding: 6px',
4040
tabindex: '-1'
4141
}, function () {
4242
_this.div({
43-
class: 'panel-resize-handle',
44-
style: 'position: absolute; top: 0; left: 0; right: 0; height: 10px; cursor: row-resize; z-index: 3; -webkit-user-select:none'
45-
});
46-
_this.div({
47-
class: 'panel-heading layout horizontal',
48-
style: '-webkit-user-select:none',
43+
class: 'layout horizontal',
44+
style: '-webkit-user-select: none; align-items: center',
4945
dblclick: 'toggle'
5046
}, function () {
5147
_this.span({
@@ -57,23 +53,23 @@ var MainPanelView = (function (_super) {
5753
});
5854
_this.div({
5955
class: 'btn-group',
60-
style: 'margin-left: 5px'
56+
style: 'margin-left: 8px'
6157
}, function () {
62-
btn("error", panelHeaders.error, 'selected');
63-
btn("build", panelHeaders.build);
64-
btn("references", panelHeaders.references);
58+
btn('error', panelHeaders.error, 'selected');
59+
btn('build', panelHeaders.build);
60+
btn('references', panelHeaders.references);
6561
});
6662
_this.div({
67-
style: 'display:inline-block; margin-top: 2px; cursor: pointer;',
63+
style: 'cursor: pointer;',
6864
click: 'clickedCurrentTsconfigFilePath'
6965
}, function () {
7066
_this.span({
71-
style: 'margin-left:10px;',
67+
style: 'margin-left: 10px;',
7268
outlet: 'tsconfigInUse'
7369
});
7470
});
7571
_this.div({
76-
style: 'display:inline-block;overflow-x:visible;white-space:nowrap;'
72+
style: 'overflow-x: visible; white-space: nowrap;'
7773
}, function () {
7874
_this.span({
7975
style: 'margin-left:10px; transition: color 1s',
@@ -82,28 +78,30 @@ var MainPanelView = (function (_super) {
8278
});
8379
_this.div({
8480
class: 'heading-summary flex',
85-
style: 'display:inline-block; margin-left:5px; margin-top:3px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis',
81+
style: 'margin-left: 5px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis',
8682
outlet: 'summary'
8783
});
8884
_this.progress({
8985
class: 'inline-block build-progress',
90-
style: 'display: none; color:red',
86+
style: 'display: none; color: red',
9187
outlet: 'buildProgress'
9288
});
93-
_this.span({ class: 'section-pending', outlet: 'sectionPending' }, function () {
89+
_this.span({
90+
class: 'section-pending',
91+
outlet: 'sectionPending',
92+
click: 'showPending'
93+
}, function () {
9494
_this.span({
9595
outlet: 'txtPendingCount',
9696
style: 'cursor: pointer; margin-right: 7px;',
9797
});
9898
_this.span({
9999
class: 'loading loading-spinner-tiny inline-block',
100-
style: 'cursor: pointer; margin-right: 7px;',
101-
click: 'showPending'
100+
style: 'cursor: pointer; margin-right: 7px;'
102101
});
103102
});
104103
_this.div({
105-
class: 'heading-buttons',
106-
style: 'width:50px; display:inline-block'
104+
class: 'heading-buttons'
107105
}, function () {
108106
_this.span({
109107
class: 'heading-fold icon-unfold',
@@ -122,17 +120,17 @@ var MainPanelView = (function (_super) {
122120
_this.div({
123121
class: 'panel-body atomts-panel-body padded',
124122
outlet: 'errorBody',
125-
style: 'overflow-y: auto; display:none'
123+
style: 'overflow-y: auto; display: none'
126124
});
127125
_this.div({
128126
class: 'panel-body atomts-panel-body padded',
129127
outlet: 'buildBody',
130-
style: 'overflow-y: auto; display:none'
128+
style: 'overflow-y: auto; display: none'
131129
});
132130
_this.div({
133131
class: 'panel-body atomts-panel-body padded',
134132
outlet: 'referencesBody',
135-
style: 'overflow-y: auto; display:none'
133+
style: 'overflow-y: auto; display: none'
136134
});
137135
});
138136
};

‎lib/main/atom/views/mainPanelView.ts

Lines changed: 25 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -40,23 +40,19 @@ export class MainPanelView extends view.View<any> {
4040
static content() {
4141
var btn = (view, text, className: string = '') =>
4242
this.button({
43-
'class': "btn " + className,
43+
'class': `btn btn-sm ${className}`,
4444
'click': `${view}PanelSelectedClick`,
45-
'outlet': `${view}PanelBtn`,
46-
'style': 'top:-2px!important'
45+
'outlet': `${view}PanelBtn`
4746
}, text);
4847

4948
this.div({
50-
class: 'atomts atomts-main-panel-view native-key-bindings layout horizontal',
49+
class: 'atomts atomts-main-panel-view native-key-bindings',
50+
style: 'padding: 6px',
5151
tabindex: '-1'
5252
}, () => {
5353
this.div({
54-
class: 'panel-resize-handle',
55-
style: 'position: absolute; top: 0; left: 0; right: 0; height: 10px; cursor: row-resize; z-index: 3; -webkit-user-select:none'
56-
});
57-
this.div({
58-
class: 'panel-heading layout horizontal',
59-
style: '-webkit-user-select:none',
54+
class: 'layout horizontal',
55+
style: '-webkit-user-select: none; align-items: center',
6056
dblclick: 'toggle'
6157
}, () => {
6258
this.span({
@@ -69,26 +65,26 @@ export class MainPanelView extends view.View<any> {
6965

7066
this.div({
7167
class: 'btn-group',
72-
style: 'margin-left: 5px'
68+
style: 'margin-left: 8px'
7369
},
7470
() => {
75-
btn("error", panelHeaders.error, 'selected')
76-
btn("build", panelHeaders.build)
77-
btn("references", panelHeaders.references)
71+
btn('error', panelHeaders.error, 'selected')
72+
btn('build', panelHeaders.build)
73+
btn('references', panelHeaders.references)
7874
});
7975

8076
this.div({
81-
style: 'display:inline-block; margin-top: 2px; cursor: pointer;',
77+
style: 'cursor: pointer;',
8278
click: 'clickedCurrentTsconfigFilePath'
8379
}, () => {
8480
this.span({
85-
style: 'margin-left:10px;',
81+
style: 'margin-left: 10px;',
8682
outlet: 'tsconfigInUse'
8783
});
8884
});
8985

9086
this.div({
91-
style: 'display:inline-block;overflow-x:visible;white-space:nowrap;'
87+
style: 'overflow-x: visible; white-space: nowrap;'
9288
}, () => {
9389
this.span({
9490
style: 'margin-left:10px; transition: color 1s', // Added transition to make it easy to see *yes I just did this compile*.
@@ -98,31 +94,33 @@ export class MainPanelView extends view.View<any> {
9894

9995
this.div({
10096
class: 'heading-summary flex',
101-
style: 'display:inline-block; margin-left:5px; margin-top:3px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis',
97+
style: 'margin-left: 5px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis',
10298
outlet: 'summary'
10399
});
104100

105101
this.progress({
106102
class: 'inline-block build-progress',
107-
style: 'display: none; color:red',
103+
style: 'display: none; color: red',
108104
outlet: 'buildProgress'
109105
});
110106

111-
this.span({ class: 'section-pending', outlet: 'sectionPending' }, () => {
107+
this.span({
108+
class: 'section-pending',
109+
outlet: 'sectionPending',
110+
click: 'showPending'
111+
}, () => {
112112
this.span({
113113
outlet: 'txtPendingCount',
114114
style: 'cursor: pointer; margin-right: 7px;',
115115
});
116116
this.span({
117117
class: 'loading loading-spinner-tiny inline-block',
118-
style: 'cursor: pointer; margin-right: 7px;',
119-
click: 'showPending'
118+
style: 'cursor: pointer; margin-right: 7px;'
120119
});
121120
});
122121

123122
this.div({
124-
class: 'heading-buttons',
125-
style: 'width:50px; display:inline-block'
123+
class: 'heading-buttons'
126124
}, () => {
127125
this.span({
128126
class: 'heading-fold icon-unfold',
@@ -141,17 +139,17 @@ export class MainPanelView extends view.View<any> {
141139
this.div({
142140
class: 'panel-body atomts-panel-body padded',
143141
outlet: 'errorBody',
144-
style: 'overflow-y: auto; display:none'
142+
style: 'overflow-y: auto; display: none'
145143
});
146144
this.div({
147145
class: 'panel-body atomts-panel-body padded',
148146
outlet: 'buildBody',
149-
style: 'overflow-y: auto; display:none'
147+
style: 'overflow-y: auto; display: none'
150148
});
151149
this.div({
152150
class: 'panel-body atomts-panel-body padded',
153151
outlet: 'referencesBody',
154-
style: 'overflow-y: auto; display:none'
152+
style: 'overflow-y: auto; display: none'
155153
});
156154
});
157155
}

0 commit comments

Comments
 (0)