diff options
| -rw-r--r-- | src/App.vue | 2 | ||||
| -rw-r--r-- | src/components/InfoModal.vue | 2 | ||||
| -rw-r--r-- | src/components/TimeLine.vue | 5 |
3 files changed, 5 insertions, 4 deletions
diff --git a/src/App.vue b/src/App.vue index 186bf40..f807836 100644 --- a/src/App.vue +++ b/src/App.vue @@ -370,7 +370,7 @@ function onEventDisplay( timelineTimeouts.set(timelineId, window.setTimeout(async () => { timelineTimeouts.delete(timelineId); handleOnEventDisplay(timelineId, eventIds, firstDate, lastDate, scaleIdx); - }, 100)); + }, 150)); } // ========== For info modal ========== diff --git a/src/components/InfoModal.vue b/src/components/InfoModal.vue index 237934d..54b386d 100644 --- a/src/components/InfoModal.vue +++ b/src/components/InfoModal.vue @@ -81,7 +81,7 @@ <!-- Description --> <div v-if="eventInfo.desc != null">{{eventInfo.desc}}</div> <div v-else class="text-center text-stone-500 text-sm">(No description found)</div> - <div v-if="event.id > 0" class="text-sm text-right"> + <div v-if="event.id > 0" class="text-sm text-stone-600 text-right mt-1"> From <a :href="'https://en.wikipedia.org/?curid=' + eventInfo.wikiId" target="_blank">Wikipedia</a> (via <a :href="'https://www.wikidata.org/wiki/Q' + event.id" target="_blank">Wikidata</a>) <external-link-icon class="inline-block w-3 h-3 ml-1"/> diff --git a/src/components/TimeLine.vue b/src/components/TimeLine.vue index 18ae107..e767074 100644 --- a/src/components/TimeLine.vue +++ b/src/components/TimeLine.vue @@ -2,7 +2,8 @@ <div class="relative overflow-hidden z-0" ref="rootRef" @pointerdown="onPointerDown" @pointermove="onPointerMove" @pointerup="onPointerUp" @pointercancel="onPointerUp" @pointerout="onPointerUp" @pointerleave="onPointerUp" - @wheel.exact="onWheel" @wheel.shift.exact="onShiftWheel"> + @wheel.exact="onWheel" @wheel.shift.exact="onShiftWheel" + :style="{backgroundColor: !current && closeable ? 'rgba(0,0,0,0.3)' : store.color.bg}"> <!-- Event density indicators --> <template v-if="store.showEventCounts"> @@ -229,7 +230,7 @@ function initScale(){ // ========== Tick data ========== -const tickLabelMargin = computed(() => vert.value ? 20 : 30); // Distance from label to mainline +const tickLabelMargin = computed(() => vert.value ? 20 : 18); // Distance from label to mainline const tickLabelSpan = computed( // Leftover breadth in half-mainline-area for tick label () => store.mainlineBreadth - store.largeTickLen / 2 - tickLabelMargin.value); |