- 
+
- 
+
-
- 
+
- 
+
{site}
- +
+
@@ -24,18 +29,29 @@ const icon: string = `background-image: url('/assets/social/${image}.webp')`
text-decoration: none;
}
- article div {
- border-radius: 1.25rem;
- background-size: contain;
- display: flex;
- align-items: center;
- justify-content: center;
+ article {
--size-value: 6.25rem;
+ border-radius: 1.25rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ background-color: var(--c-darkergray);
+ border-color: var(--c-darkgray);
+ padding: 10px;
+ text-align: center;
+ transition: transform var(--speed) var(--ease);
+ height: auto;
+ width: auto;
+ position: relative;
+ }
+
+ article img {
+ border-radius: 1.25rem;
width: var(--size-value);
height: var(--size-value);
}
- article:hover span {
+ article:hover div {
border-radius: 1.25rem;
padding: 0 0.5rem;
display: flex;
@@ -43,9 +59,11 @@ const icon: string = `background-image: url('/assets/social/${image}.webp')`
justify-content: center;
text-align: center;
background-color: var(--c-darkgray);
- height: calc(var(--size-value) + 0.1rem);
- width: calc(var(--size-value) + 0.1rem);
+ height: calc(var(--size-value));
+ width: calc(var(--size-value) - 1rem);
opacity: 90%;
+ z-index: 100;
+ position: absolute;
}
article:hover h2 {
@@ -57,25 +75,14 @@ const icon: string = `background-image: url('/assets/social/${image}.webp')`
}
article h2 {
+ position: absolute;
display: none;
}
- article span {
+ article div {
display: none;
}
- article {
- border-radius: 1.25rem;
- display: flex;
- align-items: center;
- justify-content: center;
- background-color: var(--c-darkergray);
- border-color: var(--c-darkgray);
- padding: 10px;
- text-align: center;
- transition: transform var(--speed) var(--ease);
- height: auto;
- width: auto;
- }
+
a:hover {
transform: scale(var(--hover-scale));
}
diff --git a/src/components/favouriteCard.astro b/src/components/favouriteCard.astro
index 9cf6c4b..d62c839 100644
--- a/src/components/favouriteCard.astro
+++ b/src/components/favouriteCard.astro
@@ -1,19 +1,22 @@
---
+import type { ImageMetadata } from 'astro';
+import { Image } from 'astro:assets';
+
export interface Props {
name: string
origin: string
- image: string
+ imageFile: string
link: string
}
-const { link, image, origin, name } = Astro.props
-
-const img: string = `/assets/favourites/${image}.webp`
+const { link, imageFile, origin, name } = Astro.props
+const imagePath = `/src/assets/favourites/${imageFile}`
+const images = import.meta.glob<{ default: ImageMetadata }>('/src/assets/favourites/*.webp')
---
{site}
{name}
- {origin}
diff --git a/src/components/navbar.astro b/src/components/navbar.astro index bed56e2..d4a6971 100644 --- a/src/components/navbar.astro +++ b/src/components/navbar.astro @@ -1,9 +1,11 @@ --- +import { Image } from 'astro:assets'; +import logo from '../assets/logo.svg' ---
+
Level {level}
{skills}
NP {np}
- 
+
Mana Loading: {ml === 'Not Unlocked' &&
Mana Loading: {ml === 'Not Unlocked' &&
}{ml}
-
-
{title}
- +
+
{title}
@@ -41,22 +50,29 @@ if (user !== undefined) { {formatted_date}
- 
+
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 8c385ba..737ae61 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,7 +1,7 @@
---
import Navbar from '../components/navbar.astro'
import NavbarEntry from '../components/navbarEntry.astro'
-import navdata from '../../static/assets/data/_navdata.json'
+import navdata from '../../static/data/_navdata.json'
export interface Props {
title: string
@@ -45,7 +45,7 @@ if (currentpage !== 'home') {
content="SmcWcewh7DCANcLeTe3ntU0R-LESbo_bsolICJnmulE"
/>
-
+
@@ -24,7 +29,7 @@
rel="noopener noreferrer">Atlas Academy for providing the servant and ce images.
{turns}
- 
+
+ @@ -40,7 +45,7 @@ rel="noopener noreferrer">FGO Timers here
- 
+
+ @@ -54,7 +59,7 @@ >his site here
+ 
+ 
+