Added servant and turns to TA collection
This commit is contained in:
parent
65032859a0
commit
7b194c844e
9 changed files with 172 additions and 47 deletions
|
@ -5,9 +5,11 @@ export interface Props {
|
|||
link: string
|
||||
image: string
|
||||
user?: string
|
||||
ta_servant?: string
|
||||
turns?: string
|
||||
}
|
||||
|
||||
const { user, date, image, link, title } = Astro.props
|
||||
const { turns, ta_servant, user, date, image, link, title } = Astro.props
|
||||
|
||||
const options_date: Intl.DateTimeFormatOptions = {
|
||||
year: 'numeric',
|
||||
|
@ -17,6 +19,7 @@ const options_date: Intl.DateTimeFormatOptions = {
|
|||
|
||||
const formatted_date = new Date(date).toLocaleDateString('de-DE', options_date)
|
||||
const icon: string = `background: url('/assets/ta_icons/${image}.webp')`
|
||||
const servant: string = `/assets/ta_icons/ta_servants/${ta_servant}.webp`
|
||||
|
||||
let hasuser = ''
|
||||
if (user !== undefined) {
|
||||
|
@ -26,7 +29,7 @@ if (user !== undefined) {
|
|||
|
||||
<a href={link} target="_blank" rel="noopener noreferrer" aria-label={title}>
|
||||
<article>
|
||||
<div style={icon}>
|
||||
<div class="icon" style={icon}>
|
||||
<span>
|
||||
<h2>{title}</h2>
|
||||
</span>
|
||||
|
@ -37,6 +40,10 @@ if (user !== undefined) {
|
|||
</span>
|
||||
{formatted_date}
|
||||
</p>
|
||||
<div class="expand-on-hover">
|
||||
<img src={servant} alt="" />
|
||||
<h2>{turns}</h2>
|
||||
</div>
|
||||
</article>
|
||||
</a>
|
||||
|
||||
|
@ -62,14 +69,14 @@ if (user !== undefined) {
|
|||
article:hover {
|
||||
transform: scale(var(--hover-scale));
|
||||
}
|
||||
article > div {
|
||||
article > .icon {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
object-fit: cover;
|
||||
object-position: 0% 0%;
|
||||
}
|
||||
|
||||
article:hover div span {
|
||||
article:hover .icon span {
|
||||
padding: 0.5rem 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -94,11 +101,11 @@ if (user !== undefined) {
|
|||
display: none;
|
||||
}
|
||||
|
||||
article div span {
|
||||
article .icon span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div {
|
||||
.icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
@ -119,4 +126,37 @@ if (user !== undefined) {
|
|||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.expand-on-hover {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
background-color: var(--c-duskgray);
|
||||
z-index: 99;
|
||||
transform: scaleY(0);
|
||||
transform-origin: top;
|
||||
position: absolute;
|
||||
top: 95%;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.expand-on-hover img {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
margin: 0.5rem;
|
||||
}
|
||||
|
||||
.expand-on-hover h2 {
|
||||
margin: 0.5rem;
|
||||
}
|
||||
|
||||
article:hover .expand-on-hover {
|
||||
transform: scaleY(1);
|
||||
transition: transform 200ms ease-in-out;
|
||||
background-color: var(--c-duskgray);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -44,6 +44,13 @@ const description = 'A collection of TAs previously completed be Firq.'
|
|||
>
|
||||
{featured_data.map((item) => <TaCard {...item} />)}
|
||||
</TaSection>
|
||||
<div class="placeholder"></div>
|
||||
</Layout>
|
||||
|
||||
<style></style>
|
||||
<style>
|
||||
.placeholder {
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
height: 5rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -4,132 +4,170 @@
|
|||
"link": "https://www.youtube.com/watch?v=nYV4jwgpuR0",
|
||||
"image": "db",
|
||||
"date": "2022-07-14",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "7T"
|
||||
},
|
||||
{
|
||||
"title": "DB 7T",
|
||||
"link": "https://www.youtube.com/watch?v=jKoSw1XM6-c",
|
||||
"image": "db",
|
||||
"date": "2022-07-07",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "7T"
|
||||
},
|
||||
{
|
||||
"title": "Valentines 2023 CQ 5T SC",
|
||||
"link": "https://www.youtube.com/watch?v=AkDFyJ98GDQ",
|
||||
"image": "orion",
|
||||
"date": "2023-02-23",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "5T"
|
||||
},
|
||||
{
|
||||
"title": "Ibuki 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=zHGvHC0CUu0",
|
||||
"image": "ibuki",
|
||||
"date": "2022-11-22",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Kingprotea 1T",
|
||||
"link": "https://www.youtube.com/watch?v=iAhwqIGWsG4",
|
||||
"image": "kingprotea",
|
||||
"date": "2022-09-13",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "1T"
|
||||
},
|
||||
{
|
||||
"title": "Golden Caenis 3T (LB5.2)",
|
||||
"link": "https://www.youtube.com/watch?v=_yZYgdr6XA4",
|
||||
"image": "caenis",
|
||||
"date": "2022-04-22",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 4 CQ 3T [No DMG CE]",
|
||||
"link": "https://www.youtube.com/watch?v=oCT7ngip82U",
|
||||
"image": "shibata",
|
||||
"date": "2022-04-26",
|
||||
"user": "Requiem"
|
||||
"user": "Requiem",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Valentines 2023 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=6WyPFYT8h1c",
|
||||
"image": "orion",
|
||||
"date": "2023-02-25",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "summershishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "Ooku Rerun CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=EU2THj6GnhQ",
|
||||
"image": "kiyohime",
|
||||
"date": "2022-08-12",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "summershishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "Amazoness 2021 CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=l2cmlS9LKSU",
|
||||
"image": "penth",
|
||||
"date": "2022-01-22",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Christmas 2021 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=PrJvjo3fvVc",
|
||||
"image": "santagale",
|
||||
"date": "2021-12-20",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "summershishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 4 CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=e9H37cnW160",
|
||||
"image": "shibata",
|
||||
"date": "2021-06-29",
|
||||
"user": "KOG"
|
||||
"user": "KOG",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 5 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=HmrWnxp8Qz0",
|
||||
"image": "nobunaga",
|
||||
"date": "2022-09-24",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "jalter",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 5 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=pcvhCQq5gFE",
|
||||
"image": "nobunaga",
|
||||
"date": "2022-09-23",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "summerjalter",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "Ibuki 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=pcvhCQq5gFE",
|
||||
"link": "https://www.youtube.com/watch?v=4NgfXE1WY5I",
|
||||
"image": "ibuki",
|
||||
"date": "2022-11-26",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "jalter",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Douman 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=CIoNRC4tDrY",
|
||||
"image": "douman",
|
||||
"date": "2022-11-27",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "musashi",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Boxing 3T (Xmas 5)",
|
||||
"link": "https://www.youtube.com/watch?v=0ErT8Qbzuw8",
|
||||
"image": "dioscuri",
|
||||
"date": "2022-12-18",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "jalter",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Slapstick Museum CQ 5T",
|
||||
"link": "https://www.youtube.com/watch?v=QtthHB6rk7k",
|
||||
"image": "moriarty",
|
||||
"date": "2023-03-10",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "jalter",
|
||||
"turns": "5T"
|
||||
},
|
||||
{
|
||||
"title": "Little Big Tengu CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=50Adjx4owhg",
|
||||
"image": "taira",
|
||||
"date": "2023-01-29",
|
||||
"user": "Ray"
|
||||
"user": "Ray",
|
||||
"ta_servant": "jalter",
|
||||
"turns": "4T"
|
||||
}
|
||||
]
|
||||
|
|
|
@ -3,120 +3,160 @@
|
|||
"title": "DB 7T (No Duplicates)",
|
||||
"link": "https://www.youtube.com/watch?v=d1ftVeitR6c",
|
||||
"image": "db",
|
||||
"date": "2022-07-09"
|
||||
"date": "2022-07-09",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "7T"
|
||||
},
|
||||
{
|
||||
"title": "Kingprotea 1T",
|
||||
"link": "https://www.youtube.com/watch?v=m3SATSOfpt4",
|
||||
"image": "kingprotea",
|
||||
"date": "2022-06-21"
|
||||
"date": "2022-06-21",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "1T"
|
||||
},
|
||||
{
|
||||
"title": "Solomon 1T (No NP)",
|
||||
"link": "https://www.youtube.com/watch?v=01Qx4Hs-X4M",
|
||||
"image": "solomon",
|
||||
"date": "2022-06-28"
|
||||
"date": "2022-06-28",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "1T"
|
||||
},
|
||||
{
|
||||
"title": "Ibuki 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=AaqRN73dO5k",
|
||||
"image": "ibuki",
|
||||
"date": "2022-11-22"
|
||||
"date": "2022-11-22",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Boxing 3T (Xmas 5)",
|
||||
"link": "https://www.youtube.com/watch?v=S8OQ7yWldJY",
|
||||
"image": "dioscuri",
|
||||
"date": "2022-12-24"
|
||||
"date": "2022-12-24",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "MHXX 2T (No DMG CE)",
|
||||
"link": "https://www.youtube.com/watch?v=lz6iBZvoDuw",
|
||||
"image": "mhxx",
|
||||
"date": "2023-01-12"
|
||||
"date": "2023-01-12",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "2T"
|
||||
},
|
||||
{
|
||||
"title": "Taira 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=YtRvahqFA0Y",
|
||||
"image": "taira",
|
||||
"date": "2022-11-22"
|
||||
"date": "2022-11-22",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Douman 3T (Lostbelt 5.5)",
|
||||
"link": "https://www.youtube.com/watch?v=6cstr3vTd8Y",
|
||||
"image": "douman",
|
||||
"date": "2022-11-23"
|
||||
"date": "2022-11-23",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Christmas 2021 Rerun CQ 5T",
|
||||
"link": "https://www.youtube.com/watch?v=cpqhx9dUgTU",
|
||||
"image": "santagale",
|
||||
"date": "2022-10-15"
|
||||
"date": "2022-10-15",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "5T"
|
||||
},
|
||||
{
|
||||
"title": "Summer 4 Rerun CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=u72o7PDBtks",
|
||||
"image": "fuuma",
|
||||
"date": "2022-06-04"
|
||||
"date": "2022-06-04",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Fate/Requiem CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=k7vGC4kpEFg",
|
||||
"image": "erice",
|
||||
"date": "2022-05-11"
|
||||
"date": "2022-05-11",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Kirschtaria 3T (Lostbelt 5)",
|
||||
"link": "https://www.youtube.com/watch?v=aYlyfAzuFw0",
|
||||
"image": "kirschtaria",
|
||||
"date": "2022-04-04"
|
||||
"date": "2022-04-04",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Aeaean Spring Breeze CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=uo3jI9xuVwI",
|
||||
"image": "odysseus",
|
||||
"date": "2022-03-06"
|
||||
"date": "2022-03-06",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Valentines 2022 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=MOCMXZ17FkU",
|
||||
"image": "sei",
|
||||
"date": "2022-02-09"
|
||||
"date": "2022-02-09",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "Amazoness 2021 CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=MU_Hw2KKYRU",
|
||||
"image": "penth",
|
||||
"date": "2022-01-23"
|
||||
"date": "2022-01-23",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "Valentines 2023 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=fwCmEiaocQo",
|
||||
"image": "orion",
|
||||
"date": "2023-02-25"
|
||||
"date": "2023-02-25",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "Slapstick Museum CQ 5T",
|
||||
"link": "https://www.youtube.com/watch?v=fQImgJirFeo",
|
||||
"image": "moriarty",
|
||||
"date": "2023-03-10"
|
||||
"date": "2023-03-10",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "5T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 5 CQ 4T",
|
||||
"link": "https://www.youtube.com/watch?v=3scILqsgobU",
|
||||
"image": "nobunaga",
|
||||
"date": "2022-09-21"
|
||||
"date": "2022-09-21",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "4T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 4 CQ 3T [No DMG CE]",
|
||||
"link": "https://www.youtube.com/watch?v=HY95cWsjC08",
|
||||
"image": "shibata",
|
||||
"date": "2022-04-30"
|
||||
"date": "2022-04-30",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
},
|
||||
{
|
||||
"title": "GudaGuda 4 CQ 3T",
|
||||
"link": "https://www.youtube.com/watch?v=7iO2WQt64-8",
|
||||
"image": "shibata",
|
||||
"date": "2022-04-26"
|
||||
"date": "2022-04-26",
|
||||
"ta_servant": "shishou",
|
||||
"turns": "3T"
|
||||
}
|
||||
]
|
||||
|
|
BIN
static/assets/ta_icons/ta_servants/jalter.webp
Normal file
BIN
static/assets/ta_icons/ta_servants/jalter.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.8 KiB |
BIN
static/assets/ta_icons/ta_servants/musashi.webp
Normal file
BIN
static/assets/ta_icons/ta_servants/musashi.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.1 KiB |
BIN
static/assets/ta_icons/ta_servants/shishou.webp
Normal file
BIN
static/assets/ta_icons/ta_servants/shishou.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.4 KiB |
BIN
static/assets/ta_icons/ta_servants/summerjalter.webp
Normal file
BIN
static/assets/ta_icons/ta_servants/summerjalter.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.5 KiB |
BIN
static/assets/ta_icons/ta_servants/summershishou.webp
Normal file
BIN
static/assets/ta_icons/ta_servants/summershishou.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.7 KiB |
Loading…
Reference in a new issue