Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add in light mode #1013

Merged
merged 3 commits into from
Dec 16, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions Changelog
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ Nagios Core 4 Change Log
4.5.9 - 2024-XX-XX
------------------
* Fix unreachable notifications (Dylan Anderson)
* Add light option in new exfoliation theme (Dylan Anderson)
* Fix authentication in trends.cgi (Dylan Anderson)

4.5.8 - 2024-11-19
Expand Down
44 changes: 43 additions & 1 deletion contrib/exfoliation/stylesheets/common.css
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@ not important: blue aaccff 777777
--background: #000000;
--foreground: #FFFFFF;
--primary: #4D89F9;
--primary-foreground: #FAFAFA;
--secondary-foreground: #D3DAE5;
--muted-foreground: #8A92A1;
--border: #28303E;
Expand All @@ -114,6 +115,32 @@ not important: blue aaccff 777777
--error-msg-bg: #1C0202;
}

.light {
--background: #FFFFFF;
--foreground: #000000;
--primary: #4D89F9;
--secondary-foreground: #1A1A1A;
--muted-foreground: #3D3D3D;
--border: #D6D6D6;
--input: #FCFCFC;

--info-msg-text: #033281;
--info-msg-border: #0860F7;
--info-msg-bg: #DCE8FE;

--success-msg-text: #005C2E;
--success-msg-border: #47B880;
--success-msg-bg: #DBFFED;

--warning-msg-text: #5C5900;
--warning-msg-border: #E0D900;
--warning-msg-bg: #FFFEE5;

--error-msg-text: #710B09;
--error-msg-border: #DB2424;
--error-msg-bg: #FCD9D9;
}

#side {
border: none;
height: 100vh;
Expand Down Expand Up @@ -183,6 +210,21 @@ a:hover {
margin-bottom: 10px;
}

.nagioslogo {
background-color: var(--foreground);
}

.nlogo {
mask: url(../images/logos/nagios-n-logo.svg) no-repeat center / contain;
height: 32px;
}

.fulllogo {
mask: url(../images/logos/horizontal-nagios-full-logo.svg) no-repeat center / contain;
height: 39px;
width: 140px;
}

div.navsection {
display: flex;
flex-direction: column;
Expand Down Expand Up @@ -401,7 +443,7 @@ ul.navsectionlinks li ul li a:hover {

#splashlearnmore {
background-color: var(--primary);
color: var(--foreground);
color: var(--primary-foreground);
padding: 16px;
border-radius: var(--radius);
}
Expand Down
1 change: 1 addition & 0 deletions html/config.inc.php.in
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ $cfg['cgi_config_file']='@sysconfdir@/cgi.cfg'; // location of the CGI config f

$cfg['cgi_base_url']='@cgiurl@';

$cfg['theme']='dark'; // Valid themes are "dark" or "light". Defaults to dark if something else or not set

// FILE LOCATION DEFAULTS
$cfg['main_config_file']='@sysconfdir@/nagios.cfg'; // default location of the main Nagios config file
Expand Down
19 changes: 16 additions & 3 deletions html/index.php.in
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
<?php
require_once(dirname(__FILE__).'/config.inc.php');

// Allow specifying main window URL for permalinks, etc.
$url = 'main.php';

Expand Down Expand Up @@ -27,10 +29,14 @@ if ("@COREWINDOW@" == "yes" && isset($_GET['corewindow'])) {
}

$this_year = '2024';
$theme = $cfg['theme'] ?? 'dark';
if ($theme != 'dark' && $theme != 'light') {
$theme = 'dark';
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

<html>
<html class="<?= $theme ?>">
<head>
<meta name="ROBOTS" content="NOINDEX, NOFOLLOW">
<title>Nagios: <?php echo $_SERVER['SERVER_NAME']; ?></title>
Expand All @@ -47,12 +53,19 @@ $this_year = '2024';
margin:0;
}

:root {
--border: #28303E
}

.light {
--border: #D6D6D6
}

iframe[name="side"] {
height: 100vh;
width: 200px;
border: none;
/* I don't like doing this but not sure of a better way */
border-right: 1px solid #28303E;
border-right: 1px solid var(--border);
}

iframe[name="main"] {
Expand Down
8 changes: 6 additions & 2 deletions html/main.php
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,14 @@

$this_version = '4.5.8';
$this_year = '2024';
$theme = $cfg['theme'] ?? 'dark';
if ($theme != 'dark' && $theme != 'light') {
$theme = 'dark';
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html id="main">
<html id="main" class="<?= $theme ?>">

<head>

Expand Down Expand Up @@ -116,7 +120,7 @@ function setCoreStatusHTML(image, text) {
Nagios Core is licensed under the GNU General Public License and is provided AS IS with NO WARRANTY OF ANY KIND, INCLUDING THE WARRANTY OF DESIGN, MERCHANTABILITY, AND FITNESS FOR A PARTICULAR PURPOSE. Nagios, Nagios Core and the Nagios logo are trademarks, servicemarks, registered trademarks or registered servicemarks owned by Nagios Enterprises, LLC. Use of the Nagios marks is governed by the <A href="https://www.nagios.com/legal/trademarks/">trademark use restrictions</a>.
</div>
<div class="logos">
<a href="https://www.nagios.org/" target="_blank"><img src="images/logos/nagios-n-logo.svg" title="Nagios.org" /></a>
<a href="https://www.nagios.org/" target="_blank"><div class="nlogo nagioslogo"></div></a>
</div>
</div>

Expand Down
8 changes: 6 additions & 2 deletions html/side.php
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,14 @@

$this_version = '4.5.8';
$link_target = 'main';
$theme = $cfg['theme'] ?? 'dark';
if ($theme != 'dark' && $theme != 'light') {
$theme = 'dark';
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html id="side">
<html id="side" class="<?= $theme ?>">

<head>
<meta name="ROBOTS" content="NOINDEX, NOFOLLOW">
Expand All @@ -18,7 +22,7 @@
<body class='navbar'>

<div class="navbarlogo">
<a href="https://www.nagios.org" target="_blank"><img src="images/logos/horizontal-nagios-full-logo.svg" height="39" width="140" border="0" alt="Nagios" /></a>
<a href="https://www.nagios.org" target="_blank"><div class="fulllogo nagioslogo"></div></a>
</div>

<div class="navsection">
Expand Down
13 changes: 13 additions & 0 deletions html/stylesheets/common.css
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,19 @@ body.navbar a:hover,a:active {
margin: 0 0 10px 0;
}

.nlogo {
mask: url(../images/logos/nagios-n-logo.svg) no-repeat center / contain;
height: 32px;
background-color: #000;
}

.fulllogo {
mask: url(../images/logos/horizontal-nagios-full-logo.svg) no-repeat center / contain;
height: 39px;
width: 140px;
background-color: #FFF;
}

.navsection {
margin: 5px 0 10px 0;
/*color: #AAA; */
Expand Down