mirror of
https://github.com/xHyroM/links.git
synced 2024-11-10 02:28:06 +01:00
feat(components): item
This commit is contained in:
parent
581178d9d8
commit
6ed14ce47c
3 changed files with 36 additions and 7 deletions
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
import { BUTTONS } from '../config';
|
||||||
|
---
|
||||||
|
|
||||||
|
{
|
||||||
|
BUTTONS.map((button) => (
|
||||||
|
<a
|
||||||
|
href={button.href}
|
||||||
|
class={`${button.background} w-full rounded-xl border-2 border-black py-4 text-center text-xl font-bold text-white drop-shadow-[4px_5px_0_rgba(0,0,0,1)] duration-75 hover:translate-y-1 hover:translate-x-1 hover:drop-shadow-none`}
|
||||||
|
>
|
||||||
|
{button.name}
|
||||||
|
</a>
|
||||||
|
))
|
||||||
|
}
|
|
@ -16,22 +16,37 @@ export const OPEN_GRAPH = {
|
||||||
export const BUTTONS = [
|
export const BUTTONS = [
|
||||||
{
|
{
|
||||||
name: 'YouTube',
|
name: 'YouTube',
|
||||||
background: 'youtube',
|
background: 'bg-youtube hover:bg-youtube/80',
|
||||||
href: '/',
|
href: '/',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'Instagram',
|
name: 'Instagram',
|
||||||
background: 'twitch',
|
background: 'bg-instagram hover:bg-instagram/80',
|
||||||
href: '/',
|
href: '/',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'Instagram',
|
name: 'GitHub',
|
||||||
background: 'twitch',
|
background: 'bg-github hover:bg-github/80',
|
||||||
href: '/',
|
href: '/',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'Instagram',
|
name: 'Discord',
|
||||||
background: 'twitch',
|
background: 'bg-discord hover:bg-discord/80',
|
||||||
|
href: '/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Tiwtch',
|
||||||
|
background: 'bg-twitch hover:bg-twitch/80',
|
||||||
|
href: '/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Spotify',
|
||||||
|
background: 'bg-spotify hover:bg-spotify/80',
|
||||||
|
href: '/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Twitter',
|
||||||
|
background: 'bg-twitter hover:bg-twitter/80',
|
||||||
href: '/',
|
href: '/',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
|
@ -6,7 +6,7 @@ import Item from '../components/Item.astro';
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout>
|
<Layout>
|
||||||
<main class="mx-auto w-max">
|
<main class="mx-auto w-max mb-12">
|
||||||
<header class="mt-12 flex flex-col items-center">
|
<header class="mt-12 flex flex-col items-center">
|
||||||
<Picture />
|
<Picture />
|
||||||
<Username />
|
<Username />
|
||||||
|
|
Loading…
Reference in a new issue