Commit f986ee62 authored by gijs's avatar gijs

Hide inline date when day is active

parent e2ea59cc
......@@ -788,7 +788,7 @@ p, h4 {
}
@media only screen and (max-width: 600px) {
.loop-wrapper[data-lootp="0"] {
.loop-wrapper[data-loop="0"] {
--highlight-color: black;
}
......@@ -979,7 +979,7 @@ p, h4 {
cursor: pointer;
}
.loop-header .loop-day-date:hover, .loop-header .loop-day-date[data-active="true"] {
.loop-header .loop-day-date:hover, .loop-header .loop-day-date[data-active] {
background-color: var(--higlight-color);
color: white;
/* transition: background-color 250ms; */
......@@ -1010,7 +1010,7 @@ p, h4 {
}
.loop-title {
flex: 0 0 100%;
flex: 0 0 calc(100% - 1em);
border-bottom: 2px solid black;
padding: 0.5em;
margin: 0;
......@@ -1022,6 +1022,10 @@ p, h4 {
border-bottom: 0;
}
.day[data-active] .loop-day-date--inline {
visibility: hidden;
}
header {
padding-bottom: 0;
}
......@@ -1102,7 +1106,6 @@ p, h4 {
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
white-space: nowrap;
}
......
......@@ -196,7 +196,8 @@
(function () {
var loops = document.querySelectorAll('section[data-type="loop"]'),
loopDays = document.querySelectorAll('.loop-days .day'),
viewport = document.querySelector('main');
viewport = document.querySelector('main'),
activeDayId = null;
if (window.innerWidth < 600) {
viewport.addEventListener('scroll', debounce(function () {
......@@ -221,15 +222,15 @@
}, 1000/25, false));
function activateDay (dayId) {
console.log(dayId);
var activeLink = document.querySelector('.loop-day-date[data-active="true"]'),
newLink = document.querySelector('.loop-day-date[data-target="' + dayId + '"]');
if (! newLink.isSameNode(activeLink)) {
newLink.dataset.active = "true";
if (activeLink) {
activeLink.dataset.active = false;
if (dayId != activeDayId) {
if (activeDayId) {
delete document.getElementById(activeDayId).dataset.active;
delete document.querySelector('.loop-day-date[data-target="' + activeDayId + '"]').dataset.active;
}
document.getElementById(dayId).dataset.active = true;
document.querySelector('.loop-day-date[data-target="' + dayId + '"]').dataset.active = true;
activeDayId = dayId;
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment