Skip to content

Commit 089a765

Browse files
authored
Header fixes and some tidying (hestiacp#3091)
* Specify package manager * Fix Stylelint not linting all src CSS * Fix JS errors on "web log" and "list server" pages * Fix menu not displaying at all screen sizes on "web log" and "list server" pages - Fix Stylelint preventing commit of minified CSS files
1 parent 76d3c5e commit 089a765

File tree

10 files changed

+48
-35
lines changed

10 files changed

+48
-35
lines changed

.github/workflows/lint.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,4 +80,4 @@ jobs:
8080
uses: ./.github/actions/yarn-nm-install
8181

8282
- name: Run Stylelint
83-
run: yarn stylelint web/css/src/themes/*.css
83+
run: yarn stylelint web/css/src/**/*.css

.stylelintignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
web/css/src/dependencies
2+
*.min.css

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,12 @@
77
"license": "GPL-3.0-or-later",
88
"scripts": {
99
"build": "postcss web/css/src/themes/*.css --dir web/css/themes --ext .min.css",
10-
"lint": "prettier --check . && eslint web/js/ && stylelint web/css/src/themes/*.css",
10+
"lint": "prettier --check . && eslint web/js/ && stylelint web/css/src/**/*.css",
1111
"lint-staged": "lint-staged",
1212
"format": "prettier --write .",
1313
"postinstall": "husky install"
1414
},
15+
"packageManager": "yarn@3.3.0",
1516
"dependencies": {
1617
"@fortawesome/fontawesome-free": "^6.2.1",
1718
"normalize.css": "^8.0.1"

web/css/src/themes/default.css

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -85,20 +85,20 @@
8585

8686
.top-bar-left {
8787
display: flex;
88-
align-items: center;
8988
}
9089

9190
.top-bar-logo {
92-
display: block;
93-
width: 54px;
91+
display: flex;
92+
align-items: center;
9493
margin-right: 30px;
9594
}
9695

9796
.top-bar-usage {
9897
display: none;
9998

10099
@media (--viewport-small) {
101-
display: block;
100+
display: flex;
101+
align-items: center;
102102
}
103103
}
104104

@@ -229,6 +229,10 @@
229229
@media (--viewport-medium) {
230230
display: none;
231231
}
232+
233+
@media (--viewport-large) {
234+
display: inline;
235+
}
232236
}
233237

234238
.l-center {

web/css/src/utilities.css

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -147,8 +147,14 @@
147147
line-height: 1.2 !important;
148148
}
149149

150-
.u-hide-desktop {
150+
.u-hide-tablet {
151151
@media (--viewport-medium) {
152152
display: none !important;
153153
}
154154
}
155+
156+
.u-hide-desktop {
157+
@media (--viewport-large) {
158+
display: none !important;
159+
}
160+
}

web/css/themes/default.min.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

web/js/init.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -663,14 +663,14 @@ $(document).ready(function () {
663663
}
664664
);
665665

666-
document.querySelector('.shortcuts-close').addEventListener('click', function () {
666+
$('.shortcuts-close').on('click', function () {
667667
var shortcutsDialog = document.querySelector('.shortcuts');
668668
if (shortcutsDialog.open) {
669669
shortcutsDialog.close();
670670
}
671671
});
672672

673-
document.querySelector('.js-shortcuts').addEventListener('click', function () {
673+
$('.js-shortcuts').on('click', function () {
674674
event.preventDefault();
675675
var shortcutsDialog = document.querySelector('.shortcuts');
676676
if (shortcutsDialog.open) {

web/templates/includes/panel.php

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@
5959
<!-- Menu -->
6060
<nav class="top-bar-nav">
6161

62-
<button type="button" class="top-bar-nav-link u-hide-desktop js-toggle-top-bar-menu" title="<?=_('Toggle menu');?>">
62+
<button type="button" class="top-bar-nav-link u-hide-tablet js-toggle-top-bar-menu" title="<?=_('Toggle menu');?>">
6363
<i class="fas fa-bars"></i>
6464
<span class="u-hidden"><?=_('Toggle menu');?></span>
6565
</button>
@@ -74,7 +74,7 @@
7474
<li class="top-bar-nav-item">
7575
<a title="<?=_('File manager');?>" class="top-bar-nav-link <?php if($TAB == 'FM') echo 'active' ?>" href="/fm/">
7676
<i class="fas fa-folder-open"></i>
77-
<span class="top-bar-nav-link-label"><?=_('File manager');?></span>
77+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('File manager');?></span>
7878
</a>
7979
</li>
8080
<?php } ?>
@@ -88,7 +88,7 @@
8888
<li class="top-bar-nav-item">
8989
<a title="<?=_('Server');?>" class="top-bar-nav-link <?php if(in_array($TAB, ['SERVER', 'IP', 'RRD', 'FIREWALL'])) echo 'active' ?>" href="/list/server/">
9090
<i class="fas fa-gear"></i>
91-
<span class="top-bar-nav-link-label"><?=_('Server');?></span>
91+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Server');?></span>
9292
</a>
9393
</li>
9494
<?php } ?>
@@ -100,15 +100,15 @@
100100
<li class="top-bar-nav-item">
101101
<a title="<?=_('Logs');?>" class="top-bar-nav-link <?php if($TAB == 'LOG') echo 'active' ?>" href="/list/log/">
102102
<i class="fas fa-clock-rotate-left"></i>
103-
<span class="top-bar-nav-link-label"><?=_('Logs');?></span>
103+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Logs');?></span>
104104
</a>
105105
</li>
106106
<?php } else { ?>
107107
<?php if ($panel[$user]['SUSPENDED'] === 'no') {?>
108108
<li class="top-bar-nav-item">
109109
<a title="<?=htmlspecialchars($user)?> (<?=htmlspecialchars($panel[$user]['NAME'])?>)" class="top-bar-nav-link" href="/edit/user/?user=<?=$user; ?>&token=<?=$_SESSION['token']?>">
110110
<i class="fas fa-circle-user"></i>
111-
<span class="top-bar-nav-link-label"><?=htmlspecialchars($user)?> (<?=htmlspecialchars($panel[$user]['NAME'])?>)</span>
111+
<span class="top-bar-nav-link-label u-hide-desktop"><?=htmlspecialchars($user)?> (<?=htmlspecialchars($panel[$user]['NAME'])?>)</span>
112112
</a>
113113
</li>
114114
<?php } ?>
@@ -118,15 +118,15 @@
118118
<li class="top-bar-nav-item">
119119
<a title="<?=_('Statistics');?>" class="top-bar-nav-link <?php if($TAB == 'STATS') echo 'active' ?>" href="/list/stats/">
120120
<i class="fas fa-chart-line"></i>
121-
<span class="top-bar-nav-link-label"><?=_('Statistics');?></span>
121+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Statistics');?></span>
122122
</a>
123123
</li>
124124

125125
<!-- Help / Documentation -->
126126
<li class="top-bar-nav-item">
127127
<a title="<?=_('Help');?>" class="top-bar-nav-link" href="https://docs.hestiacp.com/" target="_blank" rel="noopener">
128128
<i class="fas fa-circle-question"></i>
129-
<span class="top-bar-nav-link-label"><?=_('Help');?></span>
129+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Help');?></span>
130130
</a>
131131
</li>
132132

@@ -135,14 +135,14 @@
135135
<li class="top-bar-nav-item">
136136
<a title="<?=_('Log out');?> (<?=$user?>)" class="top-bar-nav-link top-bar-nav-link-logout" href="/logout/?token=<?=$_SESSION['token']?>">
137137
<i class="fas fa-circle-up"></i>
138-
<span class="top-bar-nav-link-label"><?=_('Log out');?> (<?=$user?>)</span>
138+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Log out');?> (<?=$user?>)</span>
139139
</a>
140140
</li>
141141
<?php } else { ?>
142142
<li class="top-bar-nav-item">
143143
<a title="<?=_('Log out');?>" class="top-bar-nav-link top-bar-nav-link-logout" href="/logout/?token=<?=$_SESSION['token']?>">
144144
<i class="fas fa-right-from-bracket"></i>
145-
<span class="top-bar-nav-link-label"><?=_('Log out');?></span>
145+
<span class="top-bar-nav-link-label u-hide-desktop"><?=_('Log out');?></span>
146146
</a>
147147
</li>
148148
<?php } ?>
@@ -196,7 +196,7 @@
196196
<?=_('domains');?>: <span><?=$panel[$user]['U_WEB_DOMAINS']?> / <?=$panel[$user]['WEB_DOMAINS']=='unlimited' ? "<b>∞</b>" : $panel[$user]['WEB_DOMAINS']?> (<?=$panel[$user]['SUSPENDED_WEB']?>)</span>
197197
</li>
198198
<li>
199-
<?=_('aliases');?>: <span><?=$panel[$user]['U_WEB_ALIASES']?> / <?=$panel[$user]['WEB_ALIASES']=='unlimited' || $panel[$user]['WEB_DOMAINS']=='unlimited' ? "<b>∞</b>" : $panel[$user]['WEB_ALIASES'] * $panel[$user]['WEB_DOMAINS']?></span>
199+
<?=_('aliases');?>: <span><?=$panel[$user]['U_WEB_ALIASES']?> / <?=$panel[$user]['WEB_ALIASES']=='unlimited' || $panel[$user]['WEB_DOMAINS']=='unlimited' ? "<b>∞</b>" : $panel[$user]['WEB_ALIASES'] * $panel[$user]['WEB_DOMAINS']?></span>
200200
</li>
201201
</ul>
202202
</a>

web/templates/pages/list_server_info.php

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,18 @@
3131
<a href="/list/web/" class="top-bar-logo" title="<?=_('Hestia Control Panel');?>">
3232
<img src="/images/logo-header.svg" alt="<?=_('Hestia Control Panel');?>" width="54" height="29">
3333
</a>
34+
</div>
35+
<div class="top-bar-right">
3436
<nav class="top-bar-nav">
35-
<ul class="top-bar-nav-list">
37+
<button type="button" class="top-bar-nav-link u-hide-tablet js-toggle-top-bar-menu" title="<?=_('Toggle menu');?>">
38+
<i class="fas fa-bars"></i>
39+
<span class="u-hidden"><?=_('Toggle menu');?></span>
40+
</button>
41+
<ul class="top-bar-nav-list animate__animated animate__fadeIn">
3642
<li class="top-bar-nav-item">
3743
<a class="top-bar-nav-link" href="/list/rrd/" title="<?=_('Back');?>">
3844
<i class="fas fa-circle-left"></i>
39-
<span class="u-hidden"><?=_('Back');?></span>
45+
<span class="top-bar-nav-link-label"><?=_('Back');?></span>
4046
</a>
4147
</li>
4248
<li class="top-bar-nav-item">
@@ -95,12 +101,6 @@
95101
</a>
96102
</li>
97103
<?php }?>
98-
</ul>
99-
</nav>
100-
</div>
101-
<div class="top-bar-right">
102-
<nav class="top-bar-nav">
103-
<ul class="top-bar-nav-list">
104104
<li class="top-bar-nav-item">
105105
<a class="top-bar-nav-link" href="javascript:location.reload();" title="<?=_('Refresh');?>">
106106
<i class="fas fa-arrow-rotate-right"></i>

web/templates/pages/list_weblog.php

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,14 @@
3131
<a href="/" class="top-bar-logo" title="<?=_('Hestia Control Panel');?>">
3232
<img src="/images/logo-header.svg" alt="<?=_('Hestia Control Panel');?>" width="54" height="29">
3333
</a>
34+
</div>
35+
<div class="top-bar-right">
3436
<nav class="top-bar-nav">
35-
<ul class="top-bar-nav-list">
37+
<button type="button" class="top-bar-nav-link u-hide-tablet js-toggle-top-bar-menu" title="<?=_('Toggle menu');?>">
38+
<i class="fas fa-bars"></i>
39+
<span class="u-hidden"><?=_('Toggle menu');?></span>
40+
</button>
41+
<ul class="top-bar-nav-list animate__animated animate__fadeIn">
3642
<li class="top-bar-nav-item">
3743
<a class="top-bar-nav-link" href="/list/web/">
3844
<i class="fas fa-circle-left"></i>
@@ -63,12 +69,6 @@
6369
<span class="u-hidden"><?=_('Download');?></span>
6470
</a>
6571
</li>
66-
</ul>
67-
</nav>
68-
</div>
69-
<div class="top-bar-right">
70-
<nav class="top-bar-nav">
71-
<ul class="top-bar-nav-list">
7272
<li class="top-bar-nav-item">
7373
<a class="top-bar-nav-link" href="javascript:location.reload();" title="<?=_('Refresh');?>">
7474
<i class="fas fa-arrow-rotate-right"></i>

0 commit comments

Comments
 (0)