mirror of
https://github.com/xHyroM/website.git
synced 2024-11-22 15:01:05 +01:00
vela veci
This commit is contained in:
parent
8e1f0c1c62
commit
08f46dfd44
4 changed files with 33 additions and 22 deletions
|
@ -1,6 +1,7 @@
|
||||||
---
|
---
|
||||||
|
const { class: className } = Astro.props;
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="container mx-auto">
|
<div class={"max-w-[90rem] mx-auto " + className}>
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,5 +1,11 @@
|
||||||
---
|
---
|
||||||
|
import Container from "../atoms/Container.astro";
|
||||||
|
|
||||||
const navItems = [
|
const navItems = [
|
||||||
|
{
|
||||||
|
name: "Home",
|
||||||
|
link: "/",
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: "Projects",
|
name: "Projects",
|
||||||
link: "/projects",
|
link: "/projects",
|
||||||
|
@ -11,23 +17,24 @@ const navItems = [
|
||||||
];
|
];
|
||||||
---
|
---
|
||||||
|
|
||||||
<header>
|
<header class="text-white text-xl h-16 border-b-[1px] border-neutral-800">
|
||||||
<nav
|
<Container class="flex justify-between items-center h-full">
|
||||||
class="text-white font-light text-2xl flex items-center justify-center"
|
<a class="font-extrabold text-2xl" href="/">xHyroM</a>
|
||||||
>
|
<nav>
|
||||||
<ul class="flex w-96 justify-evenly py-3">
|
<ul class="flex gap-10">
|
||||||
{
|
{
|
||||||
navItems.map((item) => (
|
navItems.map((item) => (
|
||||||
<li>
|
<li class=" hover:-translate-y-[2px] transition-all">
|
||||||
<a
|
<a
|
||||||
href={item.link}
|
href={item.link}
|
||||||
class="hover:text-[#fbc119] hover:underline hover:drop-shadow-yellowalt"
|
class="hover:text-[#fbc119] text-neutral-300"
|
||||||
>
|
>
|
||||||
{item.name}
|
{item.name}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
</Container>
|
||||||
</header>
|
</header>
|
||||||
|
|
|
@ -13,9 +13,11 @@ import Container from "../components/atoms/Container.astro";
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<main class="flex gap-14 justify-center flex-wrap">
|
<main class="flex gap-14 justify-center flex-wrap">
|
||||||
<section class="w-96 bg-neutral-900 p-6 rounded-md">
|
<section
|
||||||
|
class="w-96 border-[1px] border-neutral-800 bg-gray p-6 rounded-md"
|
||||||
|
>
|
||||||
<h2 class="text-3xl font-bold text-white mb-4">Projects</h2>
|
<h2 class="text-3xl font-bold text-white mb-4">Projects</h2>
|
||||||
<p class="text-white">
|
<p class="text-neutral-300">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
|
||||||
tincidunt, nisl eget aliquam tincidunt, nisl elit aliquam
|
tincidunt, nisl eget aliquam tincidunt, nisl elit aliquam
|
||||||
tortor, eget aliquam nisl elit non nisl. Sed tincidunt, nisl
|
tortor, eget aliquam nisl elit non nisl. Sed tincidunt, nisl
|
||||||
|
|
|
@ -5,6 +5,7 @@ module.exports = {
|
||||||
extend: {
|
extend: {
|
||||||
colors: {
|
colors: {
|
||||||
dark: "#0D0D0D",
|
dark: "#0D0D0D",
|
||||||
|
gray: "#131313",
|
||||||
},
|
},
|
||||||
dropShadow: {
|
dropShadow: {
|
||||||
yellow: ["0 35px 35px rgba(250, 193, 25, 0.5)"],
|
yellow: ["0 35px 35px rgba(250, 193, 25, 0.5)"],
|
||||||
|
|
Loading…
Reference in a new issue