newest updates notification via php incl into colorbox on top
This commit is contained in:
parent
524cd8379c
commit
054a544ee6
|
@ -14,3 +14,4 @@ postgres.env
|
|||
# dynamic files
|
||||
**/dyn/*.json
|
||||
**/dyn/
|
||||
update.html
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="block_wrap light_background">
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.html'); ?>
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.php'); ?>
|
||||
</div>
|
||||
<div class="block_wrap">
|
||||
<div class="content">
|
||||
|
|
|
@ -32,7 +32,7 @@ h3 {
|
|||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
p {
|
||||
p, li {
|
||||
font-family: Rubik-Regular;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
@ -50,7 +50,8 @@ a {
|
|||
}
|
||||
|
||||
.colorbox {
|
||||
height: 40px;
|
||||
color: #fff;
|
||||
min-height: 40px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: sticky;
|
||||
|
@ -59,6 +60,16 @@ a {
|
|||
z-index: 1;
|
||||
}
|
||||
|
||||
.colorbox p {
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.colorbox ul {
|
||||
margin: 0;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.top_content {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
|
@ -86,7 +97,7 @@ a {
|
|||
}
|
||||
|
||||
.title {
|
||||
padding: 30px 0;
|
||||
padding: 10px 0 30px 0;
|
||||
flex: 80%;
|
||||
}
|
||||
|
||||
|
@ -349,7 +360,7 @@ a {
|
|||
}
|
||||
.nav li {
|
||||
display: inline-flex;
|
||||
padding: 5px 20px;
|
||||
padding: 5px 15px;
|
||||
}
|
||||
.nav ul {
|
||||
margin: 10px auto;
|
||||
|
|
|
@ -12,14 +12,14 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="block_wrap light_background">
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.html'); ?>
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.php'); ?>
|
||||
</div>
|
||||
<div class="block_wrap">
|
||||
<div class="content">
|
||||
<h1>Graphs</h1>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>Last three days</h2>
|
||||
<h2 id="last3">Last three days</h2>
|
||||
</div>
|
||||
<div class="graph3 content">
|
||||
<div class="graph_item">
|
||||
|
@ -45,7 +45,7 @@
|
|||
<hr class="col_border">
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>Particle Matter sizes</h2>
|
||||
<h2 id="pm">Particle Matter sizes</h2>
|
||||
<p><b>There is no healthy level of pollution.</b> Particle matter (PM) are defined in two different sizes: PM 2.5 which represents particle sizes smaller than 2.5 µm or less than 1/20th of the diameter of a human hair and PM 10 which represents particle sizer smaller than 10 µm or 1/5th of the diameter of a human hair.</p>
|
||||
<p>The <a href="https://www.who.int/news-room/fact-sheets/detail/ambient-(outdoor)-air-quality-and-health" target="_blank">WHO</a> is providing more details on their website regarding particle matter and their health implications. On <a href="https://en.wikipedia.org/wiki/Particulates" target="blank">Wikipedia</a> there are some interesting links to studies for further reading.</p>
|
||||
</div>
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
<div class="colorbox" id="colorbox"></div>
|
||||
<div class="colorbox" id="colorbox">
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/update.html'); ?>
|
||||
</div>
|
||||
<div class="top_content content">
|
||||
<div class="title">
|
||||
<h1>Live Air Quality</h1>
|
|
@ -17,7 +17,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="block_wrap light_background">
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.html'); ?>
|
||||
<?php include($_SERVER['DOCUMENT_ROOT'] . '/incl/topnav.php'); ?>
|
||||
<div class="top_content content">
|
||||
<div class="cloud">
|
||||
<img src="/img/cloud.png" alt="cloud" class="col_filter">
|
||||
|
@ -107,13 +107,13 @@
|
|||
<div class="block_wrap">
|
||||
<div class="graph2 content">
|
||||
<div class="graph_item">
|
||||
<h3>Last three hours</h3>
|
||||
<h3 id="last3">Last three hours</h3>
|
||||
<a href="/dyn/current.png" data-lightbox="graph">
|
||||
<img src="/dyn/current.png" alt="current">
|
||||
</a>
|
||||
</div>
|
||||
<div class="graph_item">
|
||||
<h3>Last 7 days</h3>
|
||||
<h3 id=last7>Last 7 days</h3>
|
||||
<a href="/dyn/last-7.png" data-lightbox="graph">
|
||||
<img src="/dyn/last-7.png" alt="last-7 days">
|
||||
</a>
|
||||
|
|
Loading…
Reference in New Issue