improve hours widget

This commit is contained in:
Mark Eaton
2021-02-04 16:06:14 -05:00
parent 5cbe754449
commit 0145f361e2
2 changed files with 26 additions and 23 deletions
+15 -14
View File
@@ -84,12 +84,14 @@ img {
outline: 0;
}
/* style the hours div */
.hours-div {
background-color: #bbb;
height: 150px;
text-align: center;
padding-top: 35px;
/* style the hours */
.hours {
text-align:right;
border-top: solid white 0px !important;
}
.date {
border-top: solid white 0px !important;
}
/* style the yamm menu */
@@ -132,17 +134,16 @@ window.onload = function () {
const h = JSON.parse(hours)
const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
for (var i = 0; i < h.length; i++) {
var targetDate = new Date(h[i]["Date"] + "T00:00:00.000-05:00");
var today = new Date();
let targetDate = new Date(h[i]["Date"] + "T00:00:00.000-05:00");
let today = new Date();
if (targetDate.getFullYear() === today.getFullYear() &&
targetDate.getMonth() === today.getMonth() &&
targetDate.getDate() === today.getDate()) {
document.getElementById('hours0').innerHTML = targetDate.toLocaleDateString("en-US", options) + " - " + h[i]["Hours"]
start = true;
count = 1;
};
if (start === true && count < 4) {
document.getElementById('hours' + count).innerHTML = targetDate.toLocaleDateString("en-US", options) + " - " + h[i]["Hours"]
document.getElementById('hours0').innerHTML = "<td class='hours col-xs-7'>" + targetDate.toLocaleDateString("en-US", options) + "</td><td class='date col-xs-5'>" + h[i]["Hours"] + "</td>"
var start = true;
var count = 1
} else if (start === true && count < 7) {
document.getElementById('hours' + count).innerHTML = "<td class='hours col-xs-7'>" + targetDate.toLocaleDateString("en-US", options) + "</td><td class='date col-xs-5'>" + h[i]["Hours"] + "</td>"
count++
}
};
+11 -9
View File
@@ -137,15 +137,17 @@
<span class="panel-title content-panel-title">LIbrary Hours</span>
</div>
<div class="panel-body">
<div class="hours-div">
<div id="hours0"></div>
<div id="hours1"></div>
<div id="hours2"></div>
<div id="hours3"></div>
<div id="hours4"></div>
<div id="hours5"></div>
<div id="hours6"></div>
</div>
<table class="table">
<tbody>
<tr id="hours0"></tr>
<tr id="hours1"></tr>
<tr id="hours2"></tr>
<tr id="hours3"></tr>
<tr id="hours4"></tr>
<tr id="hours5"></tr>
<tr id="hours6"></tr>
</tbody>
</table>
</div>
</div>
</div>