Skip to content
This repository was archived by the owner on Aug 27, 2022. It is now read-only.

Commit fcd99b1

Browse files
andi34andi34
committed
ui: rework UI style handling, make UI and button style independent
Change-Id: I6a12c936f2fdea4d0571778fa5e9fb7a0fbc3587
1 parent 6ae0d02 commit fcd99b1

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+368
-418
lines changed

‎admin/debugpanel.php‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,10 @@
1414
header('location: ../login');
1515
exit();
1616
}
17+
18+
$shapeClass = 'shape--' . $config['ui']['style'];
19+
$btnShape = 'shape--' . $config['ui']['button'];
20+
$btnClass = 'adminnavlistelement ' . $btnShape . ' noborder';
1721
?>
1822
<!DOCTYPE html>
1923
<html>
@@ -89,13 +93,13 @@ function html_src_indent($num)
8993
echo '<ul class="adminnavlist" id="navlist">';
9094
html_src_indent(++$indent);
9195

92-
echo '<li><a class="adminnavlistelement" href="#myconfig" id="nav-myconfig"><div><span data-i18n="myconfig">myconfig</span></div></a></li>';
93-
echo '<li><a class="adminnavlistelement" href="#remotebuzzerlog" id="nav-remotebuzzerlog"><div><span data-i18n="remotebuzzer">remotebuzzer</span></div></a></li>';
94-
echo '<li><a class="adminnavlistelement" href="#synctodrivelog" id="nav-synctodrivelog"><div><span data-i18n="synctodrive">synctodrive</span></div></a></li>';
95-
echo '<li><a class="adminnavlistelement" href="#devlog" id="nav-devlog"><div><span data-i18n="devlog">devlog</span></div></a></li>';
96-
echo '<li><a class="adminnavlistelement" href="#serverprocesses" id="nav-serverprocesses"><div><span data-i18n="serverprocesses">serverprocesses</span></div></a></li>';
97-
echo '<li><a class="adminnavlistelement" href="#bootconfig" id="nav-bootconfig"><div><span data-i18n="bootconfig">bootconfig</span></div></a></li>';
98-
echo '<li><a class="adminnavlistelement" href="#githead" id="nav-githead"><div><span data-i18n="githead">githead</span></div></a></li>';
96+
echo '<li><a class="'. $btnClass .'" href="#myconfig" id="nav-myconfig"><div><span data-i18n="myconfig">myconfig</span></div></a></li>';
97+
echo '<li><a class="'. $btnClass .'" href="#remotebuzzerlog" id="nav-remotebuzzerlog"><div><span data-i18n="remotebuzzer">remotebuzzer</span></div></a></li>';
98+
echo '<li><a class="'. $btnClass .'" href="#synctodrivelog" id="nav-synctodrivelog"><div><span data-i18n="synctodrive">synctodrive</span></div></a></li>';
99+
echo '<li><a class="'. $btnClass .'" href="#devlog" id="nav-devlog"><div><span data-i18n="devlog">devlog</span></div></a></li>';
100+
echo '<li><a class="'. $btnClass .'" href="#serverprocesses" id="nav-serverprocesses"><div><span data-i18n="serverprocesses">serverprocesses</span></div></a></li>';
101+
echo '<li><a class="'. $btnClass .'" href="#bootconfig" id="nav-bootconfig"><div><span data-i18n="bootconfig">bootconfig</span></div></a></li>';
102+
echo '<li><a class="'. $btnClass .'" href="#githead" id="nav-githead"><div><span data-i18n="githead">githead</span></div></a></li>';
99103

100104
html_src_indent(--$indent);
101105
echo '</ul>';
@@ -104,7 +108,7 @@ function html_src_indent($num)
104108
<!-- Settings page content -->
105109
<form autocomplete="off">
106110
<div class="admincontent" id="admincontentpage">
107-
<div class="debugcontent">
111+
<div class="debugcontent <?php echo $shapeClass; ?>">
108112
</div>
109113
</div>
110114
<script src="../node_modules/whatwg-fetch/dist/fetch.umd.js"></script>

‎admin/diskusage.php‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@
1616
exit();
1717
}
1818

19+
$btnShape = 'shape--' . $config['ui']['button'];
20+
$shapeClass = 'shape--' . $config['ui']['style'];
1921
?>
2022

2123
<!DOCTYPE html>
@@ -43,19 +45,16 @@
4345
<link rel="stylesheet" href="../node_modules/normalize.css/normalize.css" />
4446
<link rel="stylesheet" href="../node_modules/font-awesome/css/font-awesome.css" />
4547
<link rel="stylesheet" href="../resources/css/login.css" />
46-
<?php if ($config['ui']['rounded_corners']): ?>
47-
<link rel="stylesheet" href="../resources/css/rounded.css" />
48-
<?php endif; ?>
4948
<?php if (is_file("../private/overrides.css")): ?>
5049
<link rel="stylesheet" href="../private/overrides.css" />
5150
<?php endif; ?>
5251
</head>
5352

5453
<body class="loginbody">
55-
<div class="login-panel">
54+
<div class="login-panel <?php echo $shapeClass; ?>">
5655
<h2><?=$config['ui']['branding']?> <span data-i18n="disk_usage"></span></h2>
57-
<a class="btn btn--tiny btn--flex back-to-admin" href="./"><i class="fa fa-arrow-left"></i></a>
58-
<button class="download-zip-btn btn btn--tiny btn--flex">
56+
<a class="btn btn--tiny btn--flex <?php echo $btnShape; ?> back-to-admin" href="./"><i class="fa fa-arrow-left"></i></a>
57+
<button class="btn btn--tiny btn--flex <?php echo $btnShape; ?> download-zip-btn ">
5958
<span data-i18n="download_zip"></span>
6059
</button>
6160
<hr>

‎admin/index.php‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@
1414
header('location: ../login');
1515
exit();
1616
}
17+
18+
$btnShape = 'shape--' . $config['ui']['button'];
19+
$shapeClass = 'shape--' . $config['ui']['style'];
1720
?>
1821
<!DOCTYPE html>
1922
<html>
@@ -34,9 +37,9 @@
3437
<link rel="stylesheet" type="text/css" href="../node_modules/font-awesome/css/font-awesome.css">
3538
<link rel="stylesheet" type="text/css" href="../node_modules/selectize/dist/css/selectize.css">
3639
<link rel="stylesheet" type="text/css" href="../resources/css/<?php echo $config['ui']['style']; ?>_admin.css">
37-
<?php if (is_file("../private/overrides.css")): ?>
38-
<link rel="stylesheet" href="../private/overrides.css" />
39-
<?php endif; ?>
40+
<?php if (is_file("../private/overrides.css")): ?>
41+
<link rel="stylesheet" href="../private/overrides.css" />
42+
<?php endif; ?>
4043
</head>
4144
<body>
4245
<!-- NavBar content -->
@@ -130,7 +133,7 @@ function isElementHidden($element_class, $setting)
130133
*/
131134

132135

133-
echo '<li><a class="'.isElementHidden('adminnavlistelement',$fields).'" href="#'.$section.'" id="nav-'.$section.'"><div><span data-i18n="'.$section.'">'.$section.'</span></div></a></li>';
136+
echo '<li><a class="'.isElementHidden('adminnavlistelement ',$fields). $btnShape . ' noborder" href="#'.$section.'" id="nav-'.$section.'"><div><span data-i18n="'.$section.'">'.$section.'</span></div></a></li>';
134137

135138
}
136139

@@ -142,7 +145,7 @@ function isElementHidden($element_class, $setting)
142145
<form autocomplete="off">
143146

144147
<div class="admincontent" id="admincontentpage">
145-
<button class="save-admin-btn" id="save-admin-btn">
148+
<button class="save-admin-btn <?php echo $btnShape; ?>" id="save-admin-btn">
146149
<span class="save"><span data-i18n="save"></span></span>
147150
<span class="saving"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i><span data-i18n="saving"></span></span>
148151
<span class="success"><i class="fa fa-check"></i><span data-i18n="success"></span></span>
@@ -160,10 +163,10 @@ function isElementHidden($element_class, $setting)
160163
html_src_indent($indent++);
161164

162165
echo '<!-- SECTION '.$section.'-->';
163-
echo '<div class="'.isElementHidden('setting_section',$fields).'" id="'.$section.'">';
166+
echo '<div class="'.isElementHidden('setting_section ',$fields). $shapeClass . ' noborder" id="'.$section.'">';
164167

165168
html_src_indent($indent);
166-
echo '<h1 class="setting_section_heading"> <span data-i18n="'.$section.'">'.$section.'</span></h1>';
169+
echo '<h1 class="setting_section_heading '. $shapeClass . ' noborder"> <span data-i18n="'.$section.'">'.$section.'</span></h1>';
167170

168171
$col = 0;
169172
foreach($fields as $key => $setting)
@@ -189,7 +192,7 @@ function isElementHidden($element_class, $setting)
189192
echo '<div class="tooltip">';
190193
echo '<label class="settinglabel" data-i18n="'.$i18ntag.'">'.$i18ntag.'</label>';
191194
echo '<span class="tooltiptext" data-i18n="manual:'.$i18ntag.'">manual:'.$i18ntag.'</span></div>';
192-
echo '<input class="settinginput" type="'.($setting['type'] === 'number' ? 'number' : 'text').'" name="'.$setting['name'].'" value="'.$setting['value'].'" placeholder="'.$setting['placeholder'].'"/>';
195+
echo '<input class="settinginput ' . $shapeClass . '-s noborder" type="'.($setting['type'] === 'number' ? 'number' : 'text').'" name="'.$setting['name'].'" value="'.$setting['value'].'" placeholder="'.$setting['placeholder'].'"/>';
193196
break;
194197
case 'range':
195198
echo '<div class="tooltip">';
@@ -201,7 +204,7 @@ function isElementHidden($element_class, $setting)
201204
break;
202205
case 'color':
203206
echo '<label class="settinglabel" data-i18n="'.$i18ntag.'"> '.$i18ntag.'</label>';
204-
echo '<input class="settinginput color" type="color" name="'.$setting['name'].'" value="'.$setting['value'].'" placeholder="'.$setting['placeholder'].'"/>';
207+
echo '<input class="settinginput color ' . $shapeClass . '-s noborder" type="color" name="'.$setting['name'].'" value="'.$setting['value'].'" placeholder="'.$setting['placeholder'].'"/>';
205208
break;
206209
case 'hidden':
207210
echo '<input type="hidden" name="'.$setting['name'].'" value="'.$setting['value'].'"/>';
@@ -210,7 +213,7 @@ function isElementHidden($element_class, $setting)
210213
echo '<div class="tooltip"><label class="settinglabel"><span data-i18n="'.$i18ntag.'">'.$i18ntag.'</span></label>';
211214
echo '<span class="tooltiptext" data-i18n="manual:'.$i18ntag.'">manual:'.$i18ntag.'</span></div>';
212215
echo '<label class="toggle settinginput"> <input type="checkbox" '.(($setting['value'] == 'true')?' checked="checked"':'').' name="'.$setting['name'].'" value="true"/>';
213-
echo '<span class="slider">';
216+
echo '<span class="slider ' . $shapeClass . ' noborder">';
214217
if ($setting['value'] == 'true')
215218
{
216219
echo '<label class="toggleTextON" data-i18n="adminpanel_toggletextON"></label><label class="toggleTextOFF hidden" data-i18n="adminpanel_toggletextOFF"></label>';
@@ -225,7 +228,7 @@ function isElementHidden($element_class, $setting)
225228
echo '<div class="tooltip">';
226229
echo '<label class="settinglabel" data-i18n="'.$i18ntag.'">'.$i18ntag.'</label>';
227230
echo '<span class="tooltiptext" data-i18n="manual:'.$i18ntag.'">manual:'.$i18ntag.'</span></div>';
228-
echo '<select class="settinginput'.($setting['type'] === 'multi-select' ? ' multi-select' : '');
231+
echo '<select class="settinginput ' . $shapeClass . '-s noborder ' .($setting['type'] === 'multi-select' ? ' multi-select' : '');
229232
echo '" name="'.$setting['name'] . ($setting['type'] === 'multi-select' ? '[]' : '');
230233
echo '"' . ($setting['type'] === 'multi-select' ? ' multiple="multiple"' : '') . '>';
231234
foreach($setting['options'] as $val => $option) {
@@ -241,7 +244,7 @@ function isElementHidden($element_class, $setting)
241244
echo '<div class="tooltip">';
242245
echo '<label class="settinglabel" data-i18n="'.$i18ntag.'">'.$i18ntag.'</label>';
243246
echo '<span class="tooltiptext" data-i18n="manual:'.$i18ntag.'">manual:'.$i18ntag.'</span></div>';
244-
echo '<div><button class="adminpanel-setting-btn" id="'.$setting['value'].'">';
247+
echo '<div><button class="adminpanel-setting-btn '. $btnShape .'" id="'.$setting['value'].'">';
245248
switch ($key) {
246249
case 'reset_button':
247250
echo '<span class="save"><span data-i18n="reset"></span></span>';

‎chromakeying.php‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
die('No or invalid file provided');
66
}
77

8-
$btnClass = 'btn btn--' . $config['ui']['button'];
98
$filename = $_GET['filename'];
109
$keyingimage = $config['foldersRoot']['keying'] . DIRECTORY_SEPARATOR . $filename;
1110

@@ -24,6 +23,10 @@
2423
$keying_possible = false;
2524
$mainimage = 'resources/img/bg.jpg';
2625
}
26+
27+
$btnClass = 'btn btn--' . $config['ui']['button'];
28+
$btnShape = 'shape--' . $config['ui']['button'];
29+
$shapeClass = 'shape--' . $config['ui']['style'];
2730
?>
2831
<!doctype html>
2932
<html>
@@ -47,18 +50,15 @@
4750
<link rel="stylesheet" href="node_modules/normalize.css/normalize.css" />
4851
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.css" />
4952
<link rel="stylesheet" href="resources/css/<?php echo $config['ui']['style']; ?>_chromakeying.css" />
50-
<?php if ($config['ui']['rounded_corners']): ?>
51-
<link rel="stylesheet" href="resources/css/rounded.css" />
52-
<?php endif; ?>
5353
<?php if (is_file("private/overrides.css")): ?>
5454
<link rel="stylesheet" href="private/overrides.css" />
5555
<?php endif; ?>
5656
</head>
5757
<body data-main-image="<?=$mainimage?>">
5858
<div class="chromawrapper rotarygroup">
5959
<?php if ($keying_possible): ?>
60-
<div class="canvasWrapper initial">
61-
<canvas id="mainCanvas"></canvas>
60+
<div class="canvasWrapper <?php echo $shapeClass; ?> noborder initial">
61+
<canvas class="<?php echo $shapeClass; ?>" id="mainCanvas"></canvas>
6262
</div>
6363

6464
<div style="padding-top:10px;text-align:center;">
@@ -67,7 +67,7 @@
6767
$cdir = scandir($dir);
6868
foreach ($cdir as $key => $value) {
6969
if (!in_array($value, array(".","..")) && !is_dir($dir.$value)) {
70-
echo '<img src="'.$dir.$value.'" class="backgroundPreview rotaryfocus" onclick="setBackgroundImage(this.src)">';
70+
echo '<img src="'.$dir.$value.'" class="backgroundPreview '. $shapeClass .' rotaryfocus" onclick="setBackgroundImage(this.src)">';
7171
}
7272
}
7373
?>

‎dependencies.php‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@
1616
header('location: login');
1717
exit();
1818
}
19+
20+
$btnClass = 'btn btn--' . $config['ui']['button'] . ' dependencies-btn';
21+
$btnShape = 'shape--' . $config['ui']['button'];
22+
$shapeClass = 'shape--' . $config['ui']['style'];
1923
?>
2024
<!DOCTYPE html>
2125
<html>
@@ -43,25 +47,22 @@
4347
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.css" />
4448
<link rel="stylesheet" href="resources/css/<?php echo $config['ui']['style']; ?>_style.css" />
4549
<link rel="stylesheet" href="resources/css/update.css" />
46-
<?php if ($config['ui']['rounded_corners'] && $config['ui']['style'] === 'classic'): ?>
47-
<link rel="stylesheet" href="resources/css/rounded.css" />
48-
<?php endif; ?>
4950
<?php if (is_file("private/overrides.css")): ?>
5051
<link rel="stylesheet" href="private/overrides.css" />
5152
<?php endif; ?>
5253
</head>
5354

5455
<body class="updatewrapper">
5556

56-
<div class="white-box" id="white-box">
57+
<div class="white-box <?php echo $shapeClass; ?>" id="white-box">
5758
<h2><?=$config['ui']['branding']?> dependencies check</h2>
5859
<p><span data-i18n="os_check"></span></p>
5960
</div>
6061

6162
<div>
62-
<a href="./" class="btn btn--<?php echo $config['ui']['button']; ?> dependencies-btn"><i class="fa fa-home"></i> <span data-i18n="home"></span></a>
63+
<a href="./" class="<?php echo $btnClass; ?>"><i class="fa fa-home"></i> <span data-i18n="home"></span></a>
6364

64-
<a href="admin" class="btn btn--<?php echo $config['ui']['button']; ?> dependencies-btn"><i class="fa fa-cog"></i> <span data-i18n="admin_panel"></span></a>
65+
<a href="admin" class="<?php echo $btnClass; ?>"><i class="fa fa-cog"></i> <span data-i18n="admin_panel"></span></a>
6566
</div>
6667

6768
<script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>

‎gallery.php‎

Lines changed: 5 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,10 @@
2020

2121
$imagelist = ($config['gallery']['newest_first'] === true) ? array_reverse($images) : $images;
2222

23+
$btnShape = 'shape--' . $config['ui']['button'];
24+
$shapeClass = 'shape--' . $config['ui']['style'];
25+
$btnClass = 'btn btn--' . $config['ui']['button'];
26+
2327
$GALLERY_FOOTER = false;
2428
?>
2529
<!DOCTYPE html>
@@ -52,9 +56,6 @@
5256
<?php if ($config['gallery']['bottom_bar']): ?>
5357
<link rel="stylesheet" href="resources/css/photoswipe-bottom.css" />
5458
<?php endif; ?>
55-
<?php if ($config['ui']['rounded_corners']): ?>
56-
<link rel="stylesheet" href="resources/css/rounded.css" />
57-
<?php endif; ?>
5859
<?php if (is_file("private/overrides.css")): ?>
5960
<link rel="stylesheet" href="private/overrides.css" />
6061
<?php endif; ?>
@@ -67,23 +68,7 @@
6768

6869
<?php include('template/pswp.template.php'); ?>
6970

70-
<div class="send-mail">
71-
<i class="fa fa-times" id="send-mail-close"></i>
72-
<p data-i18n="insertMail"></p>
73-
<form id="send-mail-form" style="margin: 0;">
74-
<input class="mail-form-input" size="35" type="email" name="sendTo">
75-
<input id="mail-form-image" type="hidden" name="image" value="">
76-
77-
<?php if ($config['mail']['send_all_later']): ?>
78-
<input type="checkbox" id="mail-form-send-link" name="send-link" value="yes">
79-
<label data-i18n="sendAllMail" for="mail-form-send-link"></label>
80-
<?php endif; ?>
81-
82-
<button class="mail-form-input btn" name="submit" type="submit" value="Send"><span data-i18n="send"></span></button>
83-
</form>
84-
85-
<div id="mail-form-message" style="max-width: 75%"></div>
86-
</div>
71+
<?php include('template/send-mail.template.php'); ?>
8772

8873
<div class="modal" id="print_mesg">
8974
<div class="modal__body"><span data-i18n="printing"></span></div>

0 commit comments

Comments
 (0)
⚡