tweak website design in html and css

This commit is contained in:
Anne Mohr 2023-04-21 10:56:52 +02:00
parent fb4d5c2929
commit a6475f2c3b
5 changed files with 74 additions and 15 deletions

View File

@ -3,6 +3,16 @@ body {
place-items: center;
text-align: center;
padding-bottom: 30px;
font-family: "Helvetica", "sans-serif"
}
table {
position: relative
}
#managerTable {
max-height: 800px;
overflow: auto;
}
td {
@ -15,10 +25,12 @@ th {
background-color: #999;
border-radius: 4px;
padding: 3px 1px;
position: sticky;
top: 0;
}
a:link, a:visited {
background-color: #ccc;
background-color: #e8e8e8;
color: #000;
text-decoration: none;
display: block;

View File

@ -3,6 +3,16 @@ body {
place-items: center;
text-align: center;
padding-bottom: 30px;
font-family: "Helvetica", "sans-serif"
}
table {
position: relative
}
#managerTable {
max-height: 800px;
overflow: auto;
}
td {
@ -18,7 +28,7 @@ th {
}
a:link {
background-color: #ccc;
background-color: #e8e8e8;
color: #000;
text-decoration: none;
display: block;

View File

@ -22,7 +22,7 @@ from obspy.clients.filesystem.sds import Client
from write_utils import get_html_text, get_html_link, get_html_row, html_footer, get_html_header, get_print_title_str, \
init_html_table, finish_html_table, get_mail_html_header, add_html_image
from utils import get_bg_color, modify_stream_for_plot, set_axis_yticks, set_axis_color, plot_axis_thresholds
from utils import get_bg_color, get_font_color, modify_stream_for_plot, set_axis_yticks, set_axis_color, plot_axis_thresholds
try:
import smtplib
@ -441,7 +441,7 @@ class SurveillanceBot(object):
fig_name = self.get_fig_path_rel(nwst_id)
nwst_id_str = nwst_id.rstrip('.')
col_items = [dict(text=nwst_id_str, color=default_color, hyperlink=fig_name if hyperlinks else None,
bold=True, tooltip=f'Show plot of {nwst_id_str}')]
bold=True, tooltip=f'Show plot of {nwst_id_str}', font_color='#000000')]
for check_key in header:
if check_key in self.keys:
@ -453,6 +453,7 @@ class SurveillanceBot(object):
bg_color = get_bg_color(check_key, status, dt_thresh, hex=True)
if not bg_color:
bg_color = default_color
font_color = get_font_color(bg_color, hex=True)
# add degree sign for temp
if check_key == 'temp':
@ -461,7 +462,7 @@ class SurveillanceBot(object):
html_class = self.get_html_class(hide_keys_mobile, status=status, check_key=check_key)
item = dict(text=str(message), tooltip=str(detailed_message), color=bg_color,
html_class=html_class)
html_class=html_class, font_color=font_color)
elif check_key in self.add_links:
value = self.add_links.get(check_key).get('URL')
link_text = self.add_links.get(check_key).get('text')

View File

@ -1,6 +1,8 @@
#!/usr/bin/env python
# -*- coding: utf-8 -*-
from functools import partial
import matplotlib
import numpy as np
@ -35,12 +37,18 @@ def get_bg_color(check_key, status, dt_thresh=None, hex=False):
def get_color(key):
# some GUI default colors
colors_dict = {'FAIL': (255, 50, 0, 255),
# colors_dict = {'FAIL': (255, 50, 0, 255),
# 'NO DATA': (255, 255, 125, 255),
# 'WARN': (255, 255, 80, 255),
# 'OK': (125, 255, 125, 255),
# 'undefined': (230, 230, 230, 255),
# 'disc': (255, 160, 40, 255),}
colors_dict = {'FAIL': (195, 29, 14, 255),
'NO DATA': (255, 255, 125, 255),
'WARN': (255, 255, 80, 255),
'OK': (125, 255, 125, 255),
'undefined': (230, 230, 230, 255),
'disc': (255, 160, 40, 255),}
'WARN': (249, 238, 139, 255),
'OK': (179, 219, 153, 255),
'undefined': (240, 240, 240, 255),
'disc': (126, 127, 131, 255), }
return colors_dict.get(key)
@ -60,7 +68,16 @@ def get_time_delay_color(dt, dt_thresh):
def get_warn_color(count):
color = (min([255, 200 + count ** 2]), 255, 80, 255)
n_colors = 20
# r = np.linspace(158, 255, n_colors, dtype=int)
# g = np.linspace(255, 255, n_colors, dtype=int)
# b = np.linspace(114, 80, n_colors, dtype=int)
r = np.linspace(204, 249, n_colors, dtype=int)
g = np.linspace(226, 238, n_colors, dtype=int)
b = np.linspace(149, 139, n_colors, dtype=int)
pad = partial(np.pad, pad_width=(0, 100), mode='edge')
r, g, b = map(pad, [r, g, b])
color = (r[count], g[count], b[count], 255)
return color
@ -81,6 +98,24 @@ def get_temp_color(temp, vmin=-10, vmax=60, cmap='coolwarm'):
return rgba
def get_font_color(bg_color, hex=False):
if hex:
bg_color = matplotlib.colors.to_rgb(bg_color)
bg_color_hsv = matplotlib.colors.rgb_to_hsv(bg_color)
bg_color_hsl = hsv_to_hsl(bg_color_hsv)
font_color = (255, 255, 255, 255) if bg_color_hsl[2] < 0.6 else (0, 0, 0, 255)
if hex:
font_color = '#{:02x}{:02x}{:02x}'.format(*font_color[:3])
return font_color
def hsv_to_hsl(hsv):
hue, saturation, value = hsv
lightness = value * (1 - saturation / 2)
saturation = 0 if lightness in (0, 1) else (value - lightness) / min(lightness, 1 - lightness)
return hue, saturation, lightness
def modify_stream_for_plot(input_stream, parameters):
""" copy (if necessary) and modify stream for plotting """

View File

@ -40,11 +40,11 @@ def get_mail_html_header():
def init_html_table():
return '<table style="width:100%">\n'
return '<div id="managerTable" ><table style="width:100%">\n'
def finish_html_table():
return '</table>\n'
return '</table></div>\n'
def html_footer(footer_logo=None):
@ -82,12 +82,13 @@ def get_html_row(items, html_key='td'):
color = item.get('color')
# check for black background of headers (shouldnt happen anymore)
color = '#e6e6e6' if color == '#000000' else color
font_color = item.get('font_color')
hyperlink = item.get('hyperlink')
text_str = get_html_link(text, hyperlink) if hyperlink else text
html_class = item.get('html_class')
class_str = f' class="{html_class}"' if html_class else ''
row_string += 2 * default_space + f'<{html_key}{class_str} bgcolor="{color}" title="{tooltip}"> {text_str}'\
+ f'</{html_key}>\n'
row_string += 2 * default_space + f'<{html_key}{class_str} bgcolor="{color}" title="{tooltip}"' \
+ f'style="color:{font_color}"> {text_str}</{html_key}>\n'
row_string += default_space + '</tr>\n'
return row_string