From 7683af19571c1e419edc3414369eadfae03da793 Mon Sep 17 00:00:00 2001 From: Jonathan Stout Date: Thu, 14 Oct 2021 02:02:42 -0400 Subject: [PATCH] use css variables to configure ui colors --- conf/routerproxy.yaml | 1 + lib/GRNOC/RouterProxy/Config.pm | 20 ++++++++++++++++++++ templates/index.tt | 6 ++++++ webroot/index.cgi | 12 +++++++----- webroot/style.css | 12 ++++++------ 5 files changed, 40 insertions(+), 11 deletions(-) diff --git a/conf/routerproxy.yaml b/conf/routerproxy.yaml index d06fd19..f6d4fc2 100644 --- a/conf/routerproxy.yaml +++ b/conf/routerproxy.yaml @@ -283,6 +283,7 @@ frontend: dropdown: 0 help: 'Note: some text that does not contain greater/less than sign' network_name: My Network + primary_color: '#990000' noc_mail: My Email Address noc_name: My NOC noc_site: http://noc.network.net diff --git a/lib/GRNOC/RouterProxy/Config.pm b/lib/GRNOC/RouterProxy/Config.pm index 957c9e3..a07b8c9 100644 --- a/lib/GRNOC/RouterProxy/Config.pm +++ b/lib/GRNOC/RouterProxy/Config.pm @@ -547,6 +547,26 @@ sub NetworkName { return $self->{'frontend'}->{'network_name'}; } +=head2 PrimaryColor + +Returns the primary UI color. + +=cut +sub PrimaryColor { + my $self = shift; + return $self->{'frontend'}->{'primary_color'} || '#990000'; +} + +=head2 SecondaryColor + +Returns the secondary UI color. + +=cut +sub SecondaryColor { + my $self = shift; + return $self->{'frontend'}->{'secondary_color'} || $self->PrimaryColor(); +} + =head2 NOCName Returns the name of the NOC. diff --git a/templates/index.tt b/templates/index.tt index 4f8f0ef..43ff041 100644 --- a/templates/index.tt +++ b/templates/index.tt @@ -3,6 +3,12 @@ + diff --git a/webroot/index.cgi b/webroot/index.cgi index 69c65bf..05a0777 100755 --- a/webroot/index.cgi +++ b/webroot/index.cgi @@ -282,11 +282,13 @@ sub makeHTML2 { } my $html = ""; - my $vars = { network_name => $conf->NetworkName(), - noc_mail => $conf->NOCMail(), - noc_name => $conf->NOCName(), - noc_site => $conf->NOCSite(), - groups => $conf->DeviceGroups(sort_devices => 1) + my $vars = { network_name => $conf->NetworkName(), + primary_color => $conf->PrimaryColor(), + secondary_color => $conf->SecondaryColor(), + noc_mail => $conf->NOCMail(), + noc_name => $conf->NOCName(), + noc_site => $conf->NOCSite(), + groups => $conf->DeviceGroups(sort_devices => 1) }; $tt->process($input, $vars, \$html); diff --git a/webroot/style.css b/webroot/style.css index 2e5b723..f64d6f4 100755 --- a/webroot/style.css +++ b/webroot/style.css @@ -22,7 +22,7 @@ div.logo { font-size: 22px; font-weight: bold; text-align: center; - color: #990000; + color: var(--primary-color); } div.devices { @@ -70,7 +70,7 @@ table.menu-table { display: none; width: auto; border: 1px dotted black; - background-color: #990000; + background-color: var(--primary-color); } table.title { @@ -117,7 +117,7 @@ select.host_command_select { tr.menu-title { - background-color: #990000; + background-color: var(--primary-color); color: white; font-family: Arial,Helvetica; font-size: 12px; @@ -126,7 +126,7 @@ tr.menu-title { tr.title { - background-color: #990000; + background-color: var(--primary-color); color: white; font-family: Arial,Helvetica; font-size: 12px; @@ -167,7 +167,7 @@ h4 { a { font-family: Arial,Helvetica; - color: #990000; + color: var(--primary-color); text-decoration: none; } @@ -208,7 +208,7 @@ li ul { position: absolute; top: 11px; left: 0; - background-color: #990000; + background-color: var(--primary-color); } li:hover ul, li.over ul {