refactor: move Vuepress files in dedicated directory
Signed-off-by: Lucien Cartier-Tilet <lucien@phundrak.com>
This commit is contained in:
25
content/.vuepress/components/ResponsiveImage.vue
Normal file
25
content/.vuepress/components/ResponsiveImage.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<img :srcset="srcset" :sizes="sizes" :alt="props.alt" :src="props.src" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
src: string;
|
||||
width: number;
|
||||
preview: string;
|
||||
previewWidth: number;
|
||||
previewThreshold?: number;
|
||||
alt?: string;
|
||||
}>();
|
||||
|
||||
const srcset = [
|
||||
`${props.preview} ${props.previewWidth}w`,
|
||||
`${props.src} ${props.width}w`,
|
||||
].join(', ');
|
||||
const sizes = [
|
||||
`(max-width: ${props.previewThreshold || props.previewWidth}px) ${
|
||||
props.previewWidth
|
||||
}px`,
|
||||
`${props.width}px`,
|
||||
].join(', ');
|
||||
</script>
|
||||
Reference in New Issue
Block a user