diff --git a/src/plugins/events/components/EventTimelineView.vue b/src/plugins/events/components/EventTimelineView.vue index e2718cf7c67..eba7a84511f 100644 --- a/src/plugins/events/components/EventTimelineView.vue +++ b/src/plugins/events/components/EventTimelineView.vue @@ -37,7 +37,7 @@ import eventData from '../mixins/eventData.js'; const PADDING = 1; const CONTAINER_CLASS = 'c-events-tsv__container'; -const NO_ITEMS_CLASS = 'c-events-tsv__no-items'; +const NO_ITEMS_CLASS = 'c-timeline__no-items'; const EVENT_WRAPPER_CLASS = 'c-events-tsv__event-line'; const ID_PREFIX = 'wrapper-'; const AXES_PADDING = 20; diff --git a/src/plugins/events/components/events-view.scss b/src/plugins/events/components/events-view.scss index f6fa7017316..4687a7604d0 100644 --- a/src/plugins/events/components/events-view.scss +++ b/src/plugins/events/components/events-view.scss @@ -66,13 +66,6 @@ transform: translateX(($hitAreaW - $lineW) * -0.5); } } - - &__no-items { - position: absolute; - left: $interiorMargin; - top: 50%; - transform: translateY(-50%); - } } .c-events-canvas { diff --git a/src/plugins/imagery/components/ImageryTimeView.vue b/src/plugins/imagery/components/ImageryTimeView.vue index 9cccdc25c86..1e462383761 100644 --- a/src/plugins/imagery/components/ImageryTimeView.vue +++ b/src/plugins/imagery/components/ImageryTimeView.vue @@ -42,7 +42,7 @@ const AXES_PADDING = 20; const PADDING = 1; const IMAGE_WIDTH_THRESHOLD = 25; const CONTAINER_CLASS = 'c-imagery-tsv-container'; -const NO_ITEMS_CLASS = 'c-imagery-tsv__no-items'; +const NO_ITEMS_CLASS = 'c-timeline__no-items'; const IMAGE_WRAPPER_CLASS = 'c-imagery-tsv__image-wrapper'; const ID_PREFIX = 'wrapper-'; @@ -254,7 +254,7 @@ export default { let existingContainer = this.$el.querySelector(`.${CONTAINER_CLASS}`); if (existingContainer) { imageryContainer = existingContainer; - imageryContainer.style.maxWidth = `${containerWidth}px`; + // imageryContainer.style.maxWidth = `${containerWidth}px`; } else { if (this.destroyImageryContainer) { this.destroyImageryContainer(); @@ -284,7 +284,7 @@ export default { this.$refs.imageryHolder.appendChild(component.$el); imageryContainer = component.$el.querySelector(`.${CONTAINER_CLASS}`); - imageryContainer.style.maxWidth = `${containerWidth}px`; + // imageryContainer.style.maxWidth = `${containerWidth}px`; } return imageryContainer; @@ -320,7 +320,7 @@ export default { } }, plotNoItems(containerElement) { - let textElement = document.createElement('text'); + let textElement = document.createElement('div'); textElement.classList.add(NO_ITEMS_CLASS); textElement.innerHTML = 'No images within timeframe'; diff --git a/src/plugins/timeline/timeline.scss b/src/plugins/timeline/timeline.scss index a889e7262a2..53ef590d12a 100644 --- a/src/plugins/timeline/timeline.scss +++ b/src/plugins/timeline/timeline.scss @@ -51,4 +51,12 @@ pointer-events: none; // Allows clicks to pass through z-index: 10; // Ensure it sits atop swimlanes } + + &__no-items { + font-style: italic; + position: absolute; + left: $interiorMargin; + top: 50%; + transform: translateY(-50%); + } }