Adding screenshot + CSS improvements

This commit is contained in:
vagrant 2021-01-08 17:05:38 +01:00
parent fd28885025
commit 59ebaf9224
2 changed files with 19 additions and 9 deletions

View file

@ -32,10 +32,11 @@ h3 {
h1, h2, h3, h4 { h1, h2, h3, h4 {
margin-top: 2rem; margin-top: 2rem;
margin-bottom: 1rem;
} }
img { img {
vertical-align: baseline; vertical-align: sub;
} }
table { table {
@ -69,8 +70,17 @@ td {
margin: 3rem auto; margin: 3rem auto;
max-width: 80%; max-width: 80%;
padding: 1rem; padding: 1rem;
-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75); -webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75); -moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);
box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75); box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);
} }
.highlight {
background-color: #000;
padding: 0px 1rem;
display: inline-block;
color: #FFF;
font-size: 1rem;
vertical-align: middle;
}

View file

@ -7,14 +7,14 @@
</head> </head>
<body> <body>
<h1>MonitoLite dashboard interface</h1> <h1>MonitoLite Dashboard</h1>
<?php if ($tasks = $db->get_all_tasks()): ?> <?php if ($tasks = $db->get_all_tasks()): ?>
<?php foreach ($tasks as $task): ?> <?php foreach ($tasks as $task): ?>
<div id="task"> <div id="task">
<h2>Task <small>#</small><?php echo $task['id']; ?> » <i>"<?php echo $task['type']; ?>"</i> for host <i>"<?php echo $task['host']; ?>"</i></h2> <h2>Task <small>#</small><?php echo $task['id']; ?> » <span class="highlight"><?php echo $task['type']; ?></span> for host <span class="highlight"><?php echo $task['host']; ?></span></h2>
<table id="tasks_tbl"> <table id="tasks_tbl">
<thead> <thead>
@ -47,8 +47,7 @@
<div id="history"> <div id="history">
<h3>Task's history</h3> <h3>Task history</h3>
<p>Only the 5 last history entries are displayed</p>
<?php if ($histories = $db->get_all_history($task['id'], 5)): ?> <?php if ($histories = $db->get_all_history($task['id'], 5)): ?>
<table id="history_tbl"> <table id="history_tbl">
<thead> <thead>
@ -69,13 +68,14 @@
<?php endforeach; ?> <?php endforeach; ?>
</tbody> </tbody>
</table> </table>
<p><small>Only the 5 last history entries are displayed</small></p>
<?php else: ?> <?php else: ?>
<p class="no_result">No history found here</p> <p class="no_result">No history found here</p>
<?php endif; ?> <?php endif; ?>
</div> </div>
<div id="contacts"> <div id="contacts">
<h3>Task's contacts</h3> <h3>Task contacts</h3>
<?php if ($contacts = $db->get_all_contacts($task['id'])): ?> <?php if ($contacts = $db->get_all_contacts($task['id'])): ?>
<table id="contacts_tbl"> <table id="contacts_tbl">