diff options
Diffstat (limited to 'components/ObozWidget.vue')
-rw-r--r-- | components/ObozWidget.vue | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/components/ObozWidget.vue b/components/ObozWidget.vue new file mode 100644 index 0000000..084feab --- /dev/null +++ b/components/ObozWidget.vue @@ -0,0 +1,50 @@ +<template> + <section class="oboz-widget"> + <nuxt-link to="/oboz/2020"> + <img src="/assets/oboz.svg" /> + </nuxt-link> + </section> +</template> + +<script> +export default { + name: 'ObozWidget' +} +</script> + +<style scoped> +.webp .oboz-widget { + background-image: url('/assets/oboz.webp'); +} + +.oboz-widget { + width: 100%; + + margin-top: 50px; + padding: 80px 20%; + + background-image: url('/assets/oboz.jpg'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + + display: flex; + flex-direction: row; + justify-content: center; +} + +img { + max-width: 60vmin; + transition: all 1s ease-in-out; +} + +img:hover { + transform: scale(1.1); +} + +@media (max-width: 500px) { + .oboz-widget { + padding: 80px 20px; + } +} +</style> |