diff --git a/www/app.js b/www/app.js
index c0e20cd..eb0f032 100644
--- a/www/app.js
+++ b/www/app.js
@@ -112,7 +112,7 @@ async function loadSource(source, week) {
}
document.getElementById('subtitle').innerHTML =
- source + '
' + data[week].start + ' t/m ' + data[week].last
+ source + ' — t/m ' + data[week].last
const d = document.createElement('div')
const tab = document.createElement('table')
@@ -133,7 +133,7 @@ async function loadPart(part, week) {
}
document.getElementById('subtitle').innerHTML =
- part + '
' + data[week].start + ' t/m ' + data[week].last
+ part + ' — t/m ' + data[week].last
const d = document.createElement('div')
const tab = document.createElement('table')
@@ -181,7 +181,9 @@ async function kies() {
}
const dd = document.getElementById('data')
+ const st = document.getElementById('subtitle')
dd.classList.add('fade')
+ st.classList.add('fade')
await sleep(20)
if (source == 'alles' || source == '') {
@@ -192,6 +194,7 @@ async function kies() {
loadWeken(source, part)
}
dd.classList.remove('fade')
+ st.classList.remove('fade')
}
async function init() {
diff --git a/www/style2.css b/www/style2.css
index 968e801..0b30812 100644
--- a/www/style2.css
+++ b/www/style2.css
@@ -141,11 +141,13 @@ label:hover {
text-decoration: underline;
}
+#subtitle,
#data {
- background-color: inherit;
- transition: all 200ms linear;
+ opacity: 1;
+ transition: opacity 200ms linear;
}
+#subtitle.fade,
#data.fade {
- background-color: #00fa9a;
- transition: all 20ms linear;
+ opacity: 0;
+ transition: opacity 20ms linear;
}