mirror/webgui
1
0
Fork 0
mirror of https://github.com/unraid/webgui.git synced 2026-05-03 08:19:27 -05:00
Code Issues Packages Projects Releases Wiki Activity

Added customizable header background color

Browse Source
This commit is contained in:
bergware
2018-11-10 09:57:14 +01:00
parent f33ef7f16d
commit 9e691f46ed
3 changed files with 34 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/dynamix/DisplaySettings.page
+11 -6
View File
@@ -23,7 +23,7 @@ $icon = "<i class='fa fa-trash top' title='Restore default image' onclick='resto
<style>
span#dropbox{margin-right:20px;}
i.top{position:absolute;padding-left:4px;cursor:pointer;}
i.top{position:relative;padding-left:4px;cursor:pointer;}
</style>
<script src="<?autov('/webGui/javascript/jquery.filedrop.js')?>"></script>
@@ -211,6 +211,16 @@ Show array utilization indicator:
<?=mk_option($display['usage'], "1", "Yes")?>
</select>
Header custom text color:
: <input type="text" class="narrow" name="header" value="<?=$display['header']?>" maxlength="6" pattern="[0-9a-fA-F]{3,6}" title="HTML color code of 3 or 6 hexadecimal digits">
> Overrule the default text color in the header. This can be used to match the text color with a background image.
Header custom background color:
: <input type="text" class="narrow" name="background" value="<?=$display['background']?>" maxlength="6" pattern="[0-9a-fA-F]{3,6}" title="HTML color code of 3 or 6 hexadecimal digits">
> Overrule the default background color in the header. This can be used to match the background color with a custom text color.
Show banner:
: <select name="banner" size="1" onchange="presetBanner(this.form)">
<?=mk_option($display['banner'], "", "No")?>
@@ -231,11 +241,6 @@ Custom banner:
> Image will be scaled to 1920x90 pixels. The maximum image file upload size is 512 kB (524,288 bytes).
Custom header text color:
: <input type="text" class="narrow" name="header" value="<?=$display['header']?>" maxlength="6" pattern="[0-9a-fA-F]{3,6}" title="HTML color code of 3 or 6 hexadecimal digits">
> Overrule the default text color in the header. This may be used to match text color with a background image.
Show Dashboard apps:
: <select name="dashapps" size="1">
<?=mk_option($display['dashapps'], "icons", "Docker + VMs")?>
plugins/dynamix/default.cfg
+1
View File
@@ -13,6 +13,7 @@ wwn="0"
total="1"
banner=""
header=""
background=""
dashapps="icons"
tabs="1"
users="Tasks:3"
plugins/dynamix/include/DefaultPageLayout.php
+22 -6
View File
@@ -10,6 +10,14 @@
* all copies or substantial portions of the Software.
*/
?>
<?
$font = $display['font'];
$theme = $display['theme'];
$header = $display['header'];
$backgnd = $display['background'];
$themes1 = in_array($theme,['black','white']);
$themes2 = in_array($theme,['gray','azure']);
?>
<!DOCTYPE html>
<html lang="en">
<head>
@@ -28,13 +36,21 @@
<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/dynamix-{$display['theme']}.css")?>">
<style>
<?if ($display['font']):?>
html{font-size:<?=$display['font']?>}
<?if ($font):?>
html{font-size:<?=$font?>}
<?endif;?>
<?if ($display['header']):?>
#header,#header .logo,#header .text-right a{color:#<?=$display['header']?>}
<?if ($header):?>
#header,#header .logo,#header .text-right a{color:#<?=$header?>}
#header .block{background-color:transparent}
<?endif;?>
<?if ($backgnd):?>
#header{background-color:#<?=$backgnd?>}
<?if ($header && $themes1):?>
#menu{background-color:#<?=$backgnd?>}
#nav-block #nav-item a{color:#<?=$header?>}
#nav-block #nav-item.active:after{background-color:#<?=$header?>}
<?endif;?>
<?endif;?>
.inline_help{display:none}
.upgrade_notice{position:fixed;top:1px;left:0;width:100%;height:40px;line-height:40px;color:#E68A00;background:#FEEFB3;border-bottom:#E68A00 1px solid;text-align:center;font-size:1.4rem;z-index:999}
.upgrade_notice i{margin:14px;float:right;cursor:pointer}
@@ -47,7 +63,7 @@ $banner = '/boot/config/plugins/dynamix/banner.png';
echo "#header.image{background-image:url(";
echo file_exists($banner) ? autov($banner) : '/webGui/images/banner.png';
echo ")}\n";
if (strstr('gray,azure',$display['theme'])) {
if ($themes2) {
foreach ($tasks as $page) if ($page['Code']) echo "#nav-item a[href='/{$page['name']}']:before{content:'\\{$page['Code']}'}\n";
foreach ($buttons as $page) if ($page['Code']) echo "#nav-item.{$page['name']} a:before{content:'\\{$page['Code']}'}\n";
}
@@ -496,7 +512,7 @@ $(window).scroll(function() {
} else {
$('.back_to_top').fadeOut(backtotopduration);
}
<?if (strstr('black,white',$display['theme'])):?>
<?if ($themes1):?>
var top = $('div#header').height() - 1; // header height has 1 extra pixel to cover overlap
$('div#menu').css($(this).scrollTop() > top ? {position:'fixed',top:'0'} : {position:'absolute',top:top+'px'});
<?endif;?>