alina sireneva
690948b8b1
All checks were successful
Build and deploy typedoc / build (push) Successful in 5m15s
Co-authored-by: Kamilla 'ova <me@kamillaova.dev> Co-authored-by: Alina Chebakova <chebakov05@gmail.com> Co-authored-by: Kravets <57632712+kravetsone@users.noreply.github.com> Co-authored-by: starkow <hello@starkow.dev> Co-authored-by: sireneva <150665887+sireneva@users.noreply.github.com>
45 lines
895 B
Vue
Executable file
45 lines
895 B
Vue
Executable file
<template>
|
|
<p class="img-wrap">
|
|
<img
|
|
:src="src"
|
|
:alt="alt || caption"
|
|
:style="{'max-width': width ? width + 'px' : undefined}"
|
|
:class="{'img-adaptive': adaptive}"
|
|
>
|
|
<span v-if="caption">{{ caption || alt }}</span>
|
|
</p>
|
|
</template>
|
|
|
|
<script>
|
|
import mediumZoom from 'medium-zoom'
|
|
|
|
export default {
|
|
name: 'VImg',
|
|
props: ['src', 'alt', 'caption', 'width', 'adaptive'],
|
|
mounted() {
|
|
mediumZoom(this.$el.querySelector('img'), {
|
|
margin: 24,
|
|
background: 'var(--vp-backdrop-bg-color)',
|
|
})
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.img-wrap {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin: 24px 0;
|
|
}
|
|
|
|
.img-wrap span {
|
|
margin-top: 4px;
|
|
font-size: 14px;
|
|
color: var(--vp-c-text-2);
|
|
}
|
|
|
|
.dark .img-adaptive {
|
|
filter: invert(1);
|
|
}
|
|
</style>
|