navbar finished

This commit is contained in:
afnzmn
2022-07-19 13:47:33 -04:00
parent da1c85e0f5
commit 9e40089ebd

View File

@@ -1,10 +1,19 @@
<script> <script>
import Navigation from '../atoms/Navigation.svelte'; import Navigation from '../atoms/Navigation.svelte';
import { page } from '$app/stores';
export let href = '/';
$: current = href == $page.url.pathname;
</script> </script>
<nav> <nav>
<a href="/"> <a href="/">
<img class="logo" src="/logo.svg" alt="ReVanced Logo"/> <div class="logo">
<img src="/logo.svg" class="logo-image" alt="ReVanced Logo" />
{#if $page.url.pathname !== '/'}
<h1><span>Re</span>Vanced</h1>
{/if}
</div>
</a> </a>
<ul> <ul>
<Navigation href="/">Home</Navigation> <Navigation href="/">Home</Navigation>
@@ -19,14 +28,31 @@
width: 100%; width: 100%;
display: flex; display: flex;
padding-top: 1.25rem; padding-top: 1.25rem;
padding-right: 2rem; padding-right: 3rem;
padding-left: 6rem; padding-left: 6rem;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
min-height: 90px; min-height: 90px;
} }
.logo { .logo {
width: 3rem; display: inline-block;
}
.logo-image {
width: 2.9rem;
cursor: pointer; cursor: pointer;
} }
h1 {
display: inline-block;
margin-left: 1rem;
font-size: 2.75rem;
letter-spacing: -0.04em;
transform: translateY(-5%);
}
h1 span {
color: var(--red);
}
</style> </style>