Skip to content

Commit 0c8db2d

Browse files
author
NI
committed
Adjust console font resize interface for easier access, and make min-allowed font size to 8
1 parent dff3857 commit 0c8db2d

3 files changed

Lines changed: 107 additions & 44 deletions

File tree

‎ui/common.css‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -285,12 +285,18 @@ body {
285285
box-shadow: 1px 1px 0 2px #0003;
286286
}
287287

288-
.icon.icon-keyboardkey2 {
289-
background: #fff;
290-
color: #999;
288+
.icon.icon-iconed-bottom1 {
291289
padding: 4px 6px;
292290
display: inline-block;
293291
border-radius: 3px;
292+
text-align: center;
293+
}
294+
.icon.icon-iconed-bottom1 > i {
295+
font-style: normal;
296+
display: block;
297+
margin: 3px;
298+
font-size: 2em;
299+
font-weight: normal;
294300
}
295301

296302
/* Windows */

‎ui/widgets/screen_console.css‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,28 @@
5757
> .screen-screen
5858
> .screen-console
5959
> .console-toolbar
60+
> .console-toolbar-group.console-toolbar-group-left {
61+
border-right: 1px solid #0001;
62+
margin-right: -1px;
63+
float: left;
64+
}
65+
66+
#home-content
67+
> .screen
68+
> .screen-screen
69+
> .screen-console
70+
> .console-toolbar
71+
> .console-toolbar-group.console-toolbar-group-main {
72+
border-left: 1px solid #0001;
73+
overflow: auto;
74+
}
75+
76+
#home-content
77+
> .screen
78+
> .screen-screen
79+
> .screen-console
80+
> .console-toolbar
81+
> .console-toolbar-group
6082
> .console-toolbar-item {
6183
padding: 15px;
6284
float: left;
@@ -67,6 +89,7 @@
6789
> .screen-screen
6890
> .screen-console
6991
> .console-toolbar
92+
> .console-toolbar-group
7093
> .console-toolbar-item
7194
.tb-title {
7295
font-size: 0.7em;
@@ -81,6 +104,7 @@
81104
> .screen-screen
82105
> .screen-console
83106
> .console-toolbar
107+
> .console-toolbar-group
84108
> .console-toolbar-item
85109
.tb-item {
86110
display: block;
@@ -96,6 +120,7 @@
96120
> .screen-screen
97121
> .screen-console
98122
> .console-toolbar
123+
> .console-toolbar-group
99124
> .console-toolbar-item
100125
.tb-item:active {
101126
background: #fff3;
@@ -106,6 +131,7 @@
106131
> .screen-screen
107132
> .screen-console
108133
> .console-toolbar
134+
> .console-toolbar-group
109135
> .console-toolbar-item
110136
.tb-item
111137
> .tb-key-icon {
@@ -119,6 +145,20 @@
119145
> .screen-screen
120146
> .screen-console
121147
> .console-toolbar
148+
> .console-toolbar-group
149+
> .console-toolbar-item
150+
.tb-item
151+
> .tb-key-icon.tb-key-resize-icon {
152+
display: block;
153+
padding: 5px;
154+
}
155+
156+
#home-content
157+
> .screen
158+
> .screen-screen
159+
> .screen-console
160+
> .console-toolbar
161+
> .console-toolbar-group
122162
> .console-toolbar-item
123163
.tb-item
124164
> .tb-key-icon:first-child {
@@ -130,6 +170,7 @@
130170
> .screen-screen
131171
> .screen-console
132172
> .console-toolbar
173+
> .console-toolbar-group
133174
> .console-toolbar-item
134175
.tb-item
135176
> .tb-key-icon:last-child {
@@ -141,6 +182,7 @@
141182
> .screen-screen
142183
> .screen-console
143184
> .console-toolbar
185+
> .console-toolbar-group
144186
> .console-toolbar-item
145187
.tb-item:active
146188
.tb-key-icon {

‎ui/widgets/screen_console.vue‎

Lines changed: 56 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -47,40 +47,54 @@
4747
>
4848
<h2 style="display:none;">Tool bar</h2>
4949

50-
<div class="console-toolbar-item">
51-
<h3 class="tb-title">Text size</h3>
52-
53-
<ul class="hlst lst-nostyle">
54-
<li>
55-
<a class="tb-item" href="javascript:;" @click="fontSizeUp">
56-
<span class="tb-key-icon icon icon-keyboardkey2">Increase +</span>
57-
</a>
58-
</li>
59-
<li>
60-
<a class="tb-item" href="javascript:;" @click="fontSizeDown">
61-
<span class="tb-key-icon icon icon-keyboardkey2">Decrease -</span>
62-
</a>
63-
</li>
64-
</ul>
50+
<div class="console-toolbar-group console-toolbar-group-left">
51+
<div class="console-toolbar-item">
52+
<h3 class="tb-title">Text size</h3>
53+
54+
<ul class="lst-nostyle">
55+
<li>
56+
<a class="tb-item" href="javascript:;" @click="fontSizeUp">
57+
<span
58+
class="tb-key-icon tb-key-resize-icon icon icon-keyboardkey1 icon-iconed-bottom1"
59+
>
60+
<i>+</i>
61+
Increase
62+
</span>
63+
</a>
64+
</li>
65+
<li>
66+
<a class="tb-item" href="javascript:;" @click="fontSizeDown">
67+
<span
68+
class="tb-key-icon tb-key-resize-icon icon icon-keyboardkey1 icon-iconed-bottom1"
69+
>
70+
<i>-</i>
71+
Decrease
72+
</span>
73+
</a>
74+
</li>
75+
</ul>
76+
</div>
6577
</div>
6678

67-
<div
68-
v-for="(keyType, keyTypeIdx) in screenKeys"
69-
:key="keyTypeIdx"
70-
class="console-toolbar-item"
71-
>
72-
<h3 class="tb-title">{{ keyType.title }}</h3>
73-
74-
<ul class="hlst lst-nostyle">
75-
<li v-for="(key, keyIdx) in keyType.keys" :key="keyIdx">
76-
<a
77-
class="tb-item"
78-
href="javascript:;"
79-
@click="sendSpecialKey(key[1])"
80-
v-html="$options.filters.specialKeyHTML(key[0])"
81-
></a>
82-
</li>
83-
</ul>
79+
<div class="console-toolbar-group console-toolbar-group-main">
80+
<div
81+
v-for="(keyType, keyTypeIdx) in screenKeys"
82+
:key="keyTypeIdx"
83+
class="console-toolbar-item"
84+
>
85+
<h3 class="tb-title">{{ keyType.title }}</h3>
86+
87+
<ul class="hlst lst-nostyle">
88+
<li v-for="(key, keyIdx) in keyType.keys" :key="keyIdx">
89+
<a
90+
class="tb-item"
91+
href="javascript:;"
92+
@click="sendSpecialKey(key[1])"
93+
v-html="$options.filters.specialKeyHTML(key[0])"
94+
></a>
95+
</li>
96+
</ul>
97+
</div>
8498
</div>
8599
</div>
86100
</div>
@@ -107,7 +121,7 @@ const termTypeFaceLoadError =
107121
termFallbackTypeFace +
108122
'" instead until the remote font is loaded';
109123
const termDefaultFontSize = 16;
110-
const termMinFontSize = 14;
124+
const termMinFontSize = 8;
111125
const termMaxFontSize = 36;
112126
113127
class Term {
@@ -223,14 +237,6 @@ class Term {
223237
});
224238
}
225239
226-
setFont(value) {
227-
if (this.closed) {
228-
return;
229-
}
230-
231-
this.term.setOption("fontFamily", value);
232-
}
233-
234240
init(root, callbacks) {
235241
if (this.closed) {
236242
return;
@@ -322,6 +328,15 @@ class Term {
322328
}
323329
}
324330
331+
setFont(value) {
332+
if (this.closed) {
333+
return;
334+
}
335+
336+
this.term.setOption("fontFamily", value);
337+
this.refit();
338+
}
339+
325340
fontSizeUp() {
326341
if (this.closed) {
327342
return;

0 commit comments

Comments
 (0)