diff --git a/src/components/VizTitle.vue b/src/components/VizTitle.vue index e5345cff25d149a575e6be11e09a8efa574ec8eb..2c44142e837f9d94a7c84cd80928e4bfd389757b 100644 --- a/src/components/VizTitle.vue +++ b/src/components/VizTitle.vue @@ -10,8 +10,7 @@ <div id="image-caption"> <p class="title"><strong>Unequal access to water</strong></p> <p class="subtitle"> - How societal factors shape exposure to water-related hazards,<br /> - likelihood to suffer harm, and ability to cope and recover from losses + How societal factors shape exposure to water-related hazards, likelihood to suffer harm, and ability to cope and recover from losses </p> </div> </div> @@ -78,4 +77,12 @@ const mobileView = ref(isMobile); padding: 1px 0 0 5px; } } + +#title-image.mobile { + width: 100vw; /* Ensure the image takes up the full width on mobile */ +} + +#intro-container.mobile { + padding: 1px 0 0 5px; /* Specific padding for mobile view */ +} </style>