style nav
This commit is contained in:
parent
e4e7cbe163
commit
a1bd3f15bd
2 changed files with 19 additions and 12 deletions
|
@ -23,21 +23,23 @@ pub fn App() -> impl IntoView {
|
||||||
outside_errors.insert_with_default_key(AppError::NotFound);
|
outside_errors.insert_with_default_key(AppError::NotFound);
|
||||||
view! { <ErrorTemplate outside_errors/> }.into_view()
|
view! { <ErrorTemplate outside_errors/> }.into_view()
|
||||||
}>
|
}>
|
||||||
|
// Some repetitive nav styling is defined in the main .css file
|
||||||
<nav class="sticky top-0 z-50 bg-gradient-to-b shadow-lg from-zinc-800 to-zinc-900">
|
<nav class="sticky top-0 z-50 bg-gradient-to-b shadow-lg from-zinc-800 to-zinc-900">
|
||||||
<ul class="container flex items-center p-3">
|
<ul class="container flex items-center p-3">
|
||||||
<li class="mx-1.5 sm:mx-6">"DoorDesk"</li>
|
// Logo
|
||||||
<li class="mx-1.5 sm:mx-6">
|
<p class="mx-1.5 sm:mx-6">"DoorDesk"</p>
|
||||||
|
<li>
|
||||||
<A href="" exact=true>
|
<A href="" exact=true>
|
||||||
"Home"
|
"Home"
|
||||||
</A>
|
</A>
|
||||||
</li>
|
</li>
|
||||||
<li class="mx-1.5 sm:mx-6">
|
<li>
|
||||||
<A href="/blog">"Blog"</A>
|
<A href="/blog">"Blog"</A>
|
||||||
</li>
|
</li>
|
||||||
<li class="mx-1.5 sm:mx-6">
|
<li>
|
||||||
<A href="/projects">"Projects"</A>
|
<A href="/projects">"Projects"</A>
|
||||||
</li>
|
</li>
|
||||||
<li class="mx-1.5 sm:mx-6">
|
<li>
|
||||||
<a href="https://git.doordesk.net">"Git"</a>
|
<a href="https://git.doordesk.net">"Git"</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -2,15 +2,21 @@
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
body {
|
html {
|
||||||
@apply bg-gradient-to-br from-zinc-900 to-zinc-950 bg-fixed;
|
|
||||||
@apply w-screen h-screen;
|
|
||||||
@apply text-orange-50 antialiased font-mono tracking-tighter;
|
@apply text-orange-50 antialiased font-mono tracking-tighter;
|
||||||
}
|
}
|
||||||
|
|
||||||
a[aria-current="page"] {
|
body {
|
||||||
border-bottom: 2px solid #de0002;
|
@apply bg-gradient-to-br from-zinc-900 to-zinc-950 bg-fixed;
|
||||||
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
|
}
|
||||||
|
|
||||||
|
nav li {
|
||||||
|
@apply border-b-2 mx-1.5 sm:mx-6;
|
||||||
|
@apply border-transparent hover:border-orange-700 duration-300;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav li:has(> a[aria-current="page"]) {
|
||||||
|
@apply border-b-orange-700 border-b-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* for innerHTML articles */
|
/* for innerHTML articles */
|
||||||
|
@ -43,7 +49,6 @@ article ol {
|
||||||
@apply list-decimal;
|
@apply list-decimal;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Code blocks */
|
/* Code blocks */
|
||||||
.hh4 {
|
.hh4 {
|
||||||
@apply text-orange-600;
|
@apply text-orange-600;
|
||||||
|
|
Loading…
Add table
Reference in a new issue