feat: add arts section and move FA and Itaku to it

This commit is contained in:
Kentai Radiquum 2024-11-26 20:47:42 +05:00
parent 7e286048e7
commit d1a5eac1d7
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
11 changed files with 188 additions and 25 deletions

View file

@ -268,7 +268,7 @@
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/photo_trains.png" data-section-image="photos" data-slide="5"
data-photo="photo_trains" />
<p class="font-bold text-4xl p-[8px]">PHOTOS</p>
<p class="font-bold text-4xl p-[8px] w-full h-full bg-black bg-opacity-20 flex items-end justify-end">PHOTOS</p>
</div>
</div>
<a class="hover:border-bg-blue w-[170px] xs:flex-1 border-transparent border-2 border-solid transition-[border-color] aspect-square overflow-hidden rounded-lg"
@ -302,6 +302,61 @@
</div>
</a>
</div>
<div class="flex flex-wrap w-full gap-1">
<div
class="w-full overflow-hidden border-2 border-transparent border-solid rounded-lg aspect-[2/1] max-h-[182px]">
<div class="relative flex items-end justify-end w-full h-full overflow-hidden" id="arts-image">
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_sleepwithplush.jpg" data-section-image="arts"
data-slide="0" data-photo="art_sleepwithplush" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_standing.jpg" data-section-image="arts"
data-slide="1" data-photo="art_standing" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_sad.jpg" data-section-image="arts" data-slide="2"
data-photo="art_sad" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_kiguboys.jpg" data-section-image="arts"
data-slide="3" data-photo="art_kiguboys" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_hugs.jpg" data-section-image="arts" data-slide="4"
data-photo="art_hugs" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_park.jpg" data-section-image="arts" data-slide="5"
data-photo="art_park" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_blep.jpg" data-section-image="arts" data-slide="6"
data-photo="art_blep" />
<img class="absolute inset-0 object-cover w-full h-full -z-10 translate-y-[var(--transform-y,0)] transition-transform ease-out duration-[var(--transform-duration,150ms)]"
alt="" src="./static/assets/arts/art_cheeseoncheese.jpg" data-section-image="arts"
data-slide="7" data-photo="art_cheeseoncheese" />
<p
class="font-bold text-4xl p-[8px] w-full h-full bg-black bg-opacity-20 flex items-end justify-end">
ARTS</p>
</div>
</div>
<a class="hover:border-bg-blue aspect-square w-[170px] xs:[flex-grow:1] border-transparent border-2 border-solid transition-[border-color] overflow-hidden rounded-lg"
href="https://furaffinity.net/user/radiquum" target="_blank" referrerpolicy="origin">
<div class="flex flex-col justify-around w-full h-full p-4 text-white bg-[#715b38]">
<img class="object-contain w-16 h-16 mx-auto" alt=""
src="./static/assets/fur-affinity.png" />
<div class="flex flex-col gap-1">
<p class="text-2xl font-medium ">Furaffinity</p>
<p class="text-base font-light ">radiquum</p>
</div>
</div>
</a>
<a class="hover:border-bg-blue w-[170px] xs:[flex-grow:1] aspect-square border-transparent border-2 border-solid transition-[border-color] overflow-hidden rounded-lg"
href="https://itaku.ee/profile/radiquum" target="_blank" referrerpolicy="origin">
<div class="flex flex-col justify-around w-full h-full p-4 text-black bg-[#ffeb3c]">
<img class="object-contain w-16 h-16 mx-auto" alt="" src="./static/assets/itaku.png" />
<div class="flex flex-col gap-1">
<p class="text-2xl font-medium">Itaku</p>
<p class="text-base font-light">radiquum</p>
</div>
</div>
</a>
</div>
</div>
<div class="flex flex-col gap-4">
@ -355,17 +410,6 @@
</div>
</div>
</a>
<a class="hover:border-bg-blue aspect-square w-[170px] xs:[flex-grow:1] border-transparent border-2 border-solid transition-[border-color] overflow-hidden rounded-lg"
href="https://furaffinity.net/user/radiquum" target="_blank" referrerpolicy="origin">
<div class="flex flex-col justify-around w-full h-full p-4 text-white bg-[#715b38]">
<img class="object-contain w-16 h-16 mx-auto" alt=""
src="./static/assets/fur-affinity.png" />
<div class="flex flex-col gap-1">
<p class="text-2xl font-medium ">Furaffinity</p>
<p class="text-base font-light ">radiquum</p>
</div>
</div>
</a>
<a class="hover:border-bg-blue w-[170px] xs:[flex-grow:1] aspect-square border-transparent border-2 border-solid transition-[border-color] overflow-hidden rounded-lg"
href="https://t.me/radiquumprojects" target="_blank" referrerpolicy="origin">
<div class="flex flex-col justify-around w-full h-full p-4 text-white bg-[#2f7ca3]">
@ -375,16 +419,6 @@
</div>
</div>
</a>
<a class="hover:border-bg-blue w-[170px] xs:[flex-grow:1] aspect-square border-transparent border-2 border-solid transition-[border-color] overflow-hidden rounded-lg"
href="https://itaku.ee/profile/radiquum" target="_blank" referrerpolicy="origin">
<div class="flex flex-col justify-around w-full h-full p-4 text-black bg-[#ffeb3c]">
<img class="object-contain w-16 h-16 mx-auto" alt="" src="./static/assets/itaku.png" />
<div class="flex flex-col gap-1">
<p class="text-2xl font-medium">Itaku</p>
<p class="text-base font-light">radiquum</p>
</div>
</div>
</a>
</div>
</div>