refactor: use gallery component proper
This commit is contained in:
parent
ae949c98ea
commit
9cca827347
1 changed files with 99 additions and 48 deletions
|
@ -2,70 +2,120 @@
|
||||||
<prose>
|
<prose>
|
||||||
<h2>Clothing Styles</h2>
|
<h2>Clothing Styles</h2>
|
||||||
|
|
||||||
<h3>Casual Wear</h3>
|
|
||||||
<ref-gallery>
|
<ref-gallery>
|
||||||
<figure>
|
<ref-figure polaroidBorder>
|
||||||
<img src="@/assets/refs/clothes/casual/fullbody.png" alt="Full Body" />
|
<template #img>
|
||||||
<figcaption>
|
<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>
|
<p>
|
||||||
Black tank top, flannell shirt, shorts (w/ dangling bands), sneakers
|
Black tank top, flannell shirt, shorts (w/ dangling bands), sneakers
|
||||||
</p>
|
</p>
|
||||||
<p>
|
</template>
|
||||||
By <a href="https://twitter.com/coffeerelated">coffeerelated</a>
|
|
||||||
</p>
|
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
</ref-gallery>
|
|
||||||
|
|
||||||
<h3>Cold Weather</h3>
|
<template #copyright
|
||||||
<ref-gallery>
|
><a href="https://twitter.com/coffeerelated"
|
||||||
<figure>
|
>coffeerelated</a
|
||||||
<img src="@/assets/refs/clothes/cold/fullbody.png" alt="Full Body" />
|
></template
|
||||||
<figcaption>
|
>
|
||||||
|
</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>Winter coat, scarf, zip hoodie, jeans, winter boots</p>
|
||||||
<p>By <a href="https://twitter.com/lara_belem_">Lara Belém</a></p>
|
</template>
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
</ref-gallery>
|
|
||||||
|
|
||||||
<h3>Workout</h3>
|
<template #copyright
|
||||||
<ref-gallery>
|
><a href="https://twitter.com/lara_belem_">Lara Belém</a></template
|
||||||
<figure>
|
>
|
||||||
<img src="@/assets/refs/clothes/workout/fullbody.png" alt="Full Body" />
|
</ref-figure>
|
||||||
<figcaption>
|
|
||||||
|
<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>
|
<p>
|
||||||
<strong>Full body:</strong> Snapback hat, tank top, fingerless
|
<strong>Full body:</strong> Snapback hat, tank top, fingerless
|
||||||
gloves, shorts, sneakers
|
gloves, shorts, sneakers
|
||||||
</p>
|
</p>
|
||||||
<p>By <a href="https://twitter.com/turquoize_art">Atlas</a></p>
|
</template>
|
||||||
</figcaption>
|
|
||||||
</figure>
|
<template #copyright
|
||||||
<figure>
|
><a href="https://twitter.com/turquoize_art">Atlas</a></template
|
||||||
<img src="@/assets/refs/clothes/workout/closeup.jpg" alt="Close-up" />
|
>
|
||||||
<figcaption>
|
</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>
|
<p>
|
||||||
<strong>Close-up:</strong> Snapback hat, headphones, tank top,
|
<strong>Close-up:</strong> Snapback hat, headphones, tank top,
|
||||||
fingerless gloves, shorts, smartwatch
|
fingerless gloves, shorts, smartwatch
|
||||||
</p>
|
</p>
|
||||||
<p>By <a href="https://twitter.com/purpledragonrei">Rei</a></p>
|
</template>
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
</ref-gallery>
|
|
||||||
|
|
||||||
<h3>"Doesn't need to leave the house today" Style</h3>
|
<template #copyright
|
||||||
<ref-gallery>
|
><a href="https://twitter.com/purpledragonrei">Rei</a></template
|
||||||
<figure>
|
>
|
||||||
<img src="@/assets/refs/clothes/lazy/pants.jpg" alt="Tank Top" />
|
</ref-figure>
|
||||||
<figcaption>
|
|
||||||
<p>Tracksuit pants (optional)</p>
|
<ref-figure polaroidBorder>
|
||||||
</figcaption>
|
<template #img
|
||||||
</figure>
|
><img
|
||||||
<figure>
|
src="@/assets/refs/clothes/lazy/pants.jpg"
|
||||||
<img src="@/assets/refs/clothes/lazy/undies.jpg" alt="Shorts" />
|
alt="Tracksuit pants"
|
||||||
<figcaption>
|
/></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>
|
<p>Topless w/ jockstrap/boxer briefs</p>
|
||||||
</figcaption>
|
<p>
|
||||||
</figure>
|
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>
|
</ref-gallery>
|
||||||
</prose>
|
</prose>
|
||||||
</template>
|
</template>
|
||||||
|
@ -73,9 +123,10 @@
|
||||||
<script>
|
<script>
|
||||||
import Prose from "@/components/Prose.vue";
|
import Prose from "@/components/Prose.vue";
|
||||||
import RefGallery from "@/components/Gallery.vue";
|
import RefGallery from "@/components/Gallery.vue";
|
||||||
|
import RefFigure from "@/components/Figure.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { Prose, RefGallery },
|
components: { Prose, RefGallery, RefFigure },
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue