SebinNyshkim/sebin-reference
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: use gallery component proper

Browse source
This commit is contained in:
Sebin Nyshkim 2022-01-06 18:58:39 +01:00
parent ae949c98ea
commit 9cca827347
1 changed files with 99 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

147
src/views/Clothing.vue
View file

@ -2,70 +2,120 @@
<prose>
<h2>Clothing Styles</h2>
<h3>Casual Wear</h3>
<ref-gallery>
<figure>
<img src="@/assets/refs/clothes/casual/fullbody.png" alt="Full Body" />
<figcaption>
<ref-figure polaroidBorder>
<template #img>
<img
src="@/assets/refs/clothes/casual/fullbody.png"
alt="Sebin in his casual outfit"
/>
</template>
<template #caption>
<p>Sebin in his casual outfit</p>
<p>
Black tank top, flannell shirt, shorts (w/ dangling bands), sneakers
</p>
<p>
By <a href="https://twitter.com/coffeerelated">coffeerelated</a>
</p>
</figcaption>
</figure>
</ref-gallery>
</template>
<h3>Cold Weather</h3>
<ref-gallery>
<figure>
<img src="@/assets/refs/clothes/cold/fullbody.png" alt="Full Body" />
<figcaption>
<template #copyright
><a href="https://twitter.com/coffeerelated"
>coffeerelated</a
></template
>
</ref-figure>
<ref-figure polaroidBorder>
<template #img
><img
src="@/assets/refs/clothes/cold/fullbody.png"
alt="Sebin in his cold weather outfit"
/></template>
<template #caption>
<p>Sebin in his cold weather outfit</p>
<p>Winter coat, scarf, zip hoodie, jeans, winter boots</p>
<p>By <a href="https://twitter.com/lara_belem_">Lara Belém</a></p>
</figcaption>
</figure>
</ref-gallery>
</template>
<h3>Workout</h3>
<ref-gallery>
<figure>
<img src="@/assets/refs/clothes/workout/fullbody.png" alt="Full Body" />
<figcaption>
<template #copyright
><a href="https://twitter.com/lara_belem_">Lara Belém</a></template
>
</ref-figure>
<ref-figure polaroidBorder>
<template #img
><img
src="@/assets/refs/clothes/workout/fullbody.png"
alt="Sebin in his workout outfit"
/></template>
<template #caption>
<p>Sebin in his workout outfit</p>
<p>
<strong>Full body:</strong> Snapback hat, tank top, fingerless
gloves, shorts, sneakers
</p>
<p>By <a href="https://twitter.com/turquoize_art">Atlas</a></p>
</figcaption>
</figure>
<figure>
<img src="@/assets/refs/clothes/workout/closeup.jpg" alt="Close-up" />
<figcaption>
</template>
<template #copyright
><a href="https://twitter.com/turquoize_art">Atlas</a></template
>
</ref-figure>
<ref-figure polaroidBorder>
<template #img
><img
src="@/assets/refs/clothes/workout/closeup.jpg"
alt="Sebin in his workout outfit"
/></template>
<template #caption>
<p>Sebin in his workout outfit</p>
<p>
<strong>Close-up:</strong> Snapback hat, headphones, tank top,
fingerless gloves, shorts, smartwatch
</p>
<p>By <a href="https://twitter.com/purpledragonrei">Rei</a></p>
</figcaption>
</figure>
</ref-gallery>
</template>
<h3>"Doesn't need to leave the house today" Style</h3>
<ref-gallery>
<figure>
<img src="@/assets/refs/clothes/lazy/pants.jpg" alt="Tank Top" />
<figcaption>
<p>Tracksuit pants (optional)</p>
</figcaption>
</figure>
<figure>
<img src="@/assets/refs/clothes/lazy/undies.jpg" alt="Shorts" />
<figcaption>
<template #copyright
><a href="https://twitter.com/purpledragonrei">Rei</a></template
>
</ref-figure>
<ref-figure polaroidBorder>
<template #img
><img
src="@/assets/refs/clothes/lazy/pants.jpg"
alt="Tracksuit pants"
/></template>
<template #caption>
<p>Tracksuit pants</p>
<p>
Sebin likes to wear comfortable clothes at home when he doesn't need
to leave the house or is enjoying some leisure time after work or on
weekends.
</p>
</template>
<!-- <template #copyright></template> -->
</ref-figure>
<ref-figure polaroidBorder>
<template #img>
<img src="@/assets/refs/clothes/lazy/undies.jpg" alt="Shorts"
/></template>
<template #caption>
<p>Topless w/ jockstrap/boxer briefs</p>
</figcaption>
</figure>
<p>
For even more comfort, Sebin tends to forgoe pants completely and
save on laundry by only wearing the absolute necessary.
</p>
</template>
<!-- <template #copyright></template> -->
</ref-figure>
</ref-gallery>
</prose>
</template>
@ -73,9 +123,10 @@
<script>
import Prose from "@/components/Prose.vue";
import RefGallery from "@/components/Gallery.vue";
import RefFigure from "@/components/Figure.vue";
export default {
components: { Prose, RefGallery },
components: { Prose, RefGallery, RefFigure },
};
</script>