parent
531b913404
commit
ce0fc46e0f
|
@ -1,7 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import { page } from '$app/stores';
|
import { page } from '$app/stores';
|
||||||
const routes = [
|
const routes = [
|
||||||
{ path: '/', name: 'Home' },
|
|
||||||
{ path: '/download', name: 'Download' },
|
{ path: '/download', name: 'Download' },
|
||||||
{ path: '/blog', name: 'Blog' },
|
{ path: '/blog', name: 'Blog' },
|
||||||
]
|
]
|
||||||
|
@ -13,21 +12,22 @@
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<ul data-sveltekit-prefetch>
|
<ul data-sveltekit-prefetch>
|
||||||
|
<li class:active={$page.url.pathname === '/'}>
|
||||||
|
<a href='/'>Home</a>
|
||||||
|
</li>
|
||||||
{#each routes as route}
|
{#each routes as route}
|
||||||
<li class:active={$page.url.pathname === route.path}>
|
<li class:active={$page.url.pathname.startsWith(route.path)}>
|
||||||
<a href={route.path}>{route.name}</a>
|
<a href={route.path}>{route.name}</a>
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex; align-items: center;">
|
<div style="display: flex; align-items: center;">
|
||||||
<!--
|
|
||||||
<a title="Kafka Dance GitLab" href="https://gitlab.com/kafka-dance">
|
<a title="Kafka Dance GitLab" href="https://gitlab.com/kafka-dance">
|
||||||
<img alt="GitLab Logo" style="height: 18px; width: auto;"
|
<img alt="GitLab Logo" style="height: 18px; width: auto;"
|
||||||
class="white-glow"
|
class="white-glow"
|
||||||
src="/gitlab-logo-white.png">
|
src="/gitlab-logo-white.svg">
|
||||||
</a>
|
</a>
|
||||||
-->
|
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
@ -50,7 +50,7 @@
|
||||||
}
|
}
|
||||||
li {
|
li {
|
||||||
content: '';
|
content: '';
|
||||||
padding: 0 2em;
|
padding: 0 1em;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
li a {
|
li a {
|
||||||
|
@ -59,4 +59,9 @@
|
||||||
li.active::before {
|
li.active::before {
|
||||||
content: '> '
|
content: '> '
|
||||||
}
|
}
|
||||||
|
@media (min-width: 480px) {
|
||||||
|
li {
|
||||||
|
padding: 0 2em;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
|
@ -24,6 +24,7 @@
|
||||||
<style>
|
<style>
|
||||||
.with-image {
|
.with-image {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
background-color: rgba(0, 0, 0, 0.03);
|
background-color: rgba(0, 0, 0, 0.03);
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
transition: background-color 300ms;
|
transition: background-color 300ms;
|
||||||
|
|
|
@ -11,8 +11,12 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
h1 {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
max-width: 50vw;
|
max-width: 90vw;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -27,7 +31,7 @@
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
.title-with-image img {
|
.title-with-image img {
|
||||||
margin: 2em 2em 0;
|
margin: 0 2em 0;
|
||||||
}
|
}
|
||||||
/*
|
/*
|
||||||
.title-with-image h1 {
|
.title-with-image h1 {
|
||||||
|
@ -42,6 +46,9 @@
|
||||||
max-width: 80vw;
|
max-width: 80vw;
|
||||||
}
|
}
|
||||||
@media (min-width: 720px) {
|
@media (min-width: 720px) {
|
||||||
|
.content {
|
||||||
|
max-width: 50vw;
|
||||||
|
}
|
||||||
.title-with-image img {
|
.title-with-image img {
|
||||||
max-width: 30vw;
|
max-width: 30vw;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue