KevinMidboe/leifsopplevelser
1
0
Fork 0
mirror of https://github.com/KevinMidboe/leifsopplevelser.git synced 2025-10-29 17:50:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Popover image now uses picture with media attributes to load sm, md or large image based on screen width.

Browse Source
This commit is contained in:
Kevin
2019-04-16 16:53:15 +02:00
parent 5d72959742
commit 84886313bb
1 changed files with 7 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/Popover.vue
View File

@@ -2,7 +2,13 @@
<div class="popover"> <div class="popover">
<div class="popover-content" @click="hidePopover" v-touch:swipe.left="backwards" v-touch:swipe.right="forwards"> <div class="popover-content" @click="hidePopover" v-touch:swipe.left="backwards" v-touch:swipe.right="forwards">
<div class="image-container"> <div class="image-container">
<img :src="album[index].url" /> <picture>
<source :srcset="album[index].url"
media="(min-width: 1200px)">
<source :srcset="album[index].url.replace('_lg.', '_md.')"
media="(min-width: 650px)">
<img :src="album[index].url.replace('_lg.', '_sm.')" />
</picture>
<!-- <div class="other-elements"> <!-- <div class="other-elements">
<p>There is something here</p> <p>There is something here</p>