feat: Use new entity-based cover #42
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 329 KiB |
|
@ -20,7 +20,10 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<button class="nav-link" on:click={toggleTheme} aria-label="Toggle Theme">
|
||||
<button
|
||||
id="theme-switch"
|
||||
class="nav-link"
|
||||
on:click={toggleTheme} aria-label="Toggle Theme">
|
||||
{#if $theme === "tokiwa"}
|
||||
<Sun />
|
||||
{:else}
|
||||
|
@ -30,6 +33,7 @@
|
|||
|
||||
<style>
|
||||
button {
|
||||
flex-shrink: 0;
|
||||
padding: 0;
|
||||
font-weight: inherit;
|
||||
background: none;
|
||||
|
|
|
@ -64,9 +64,11 @@
|
|||
</div>
|
||||
|
||||
<div id="cover-mobile">
|
||||
<div id="linkbox">
|
||||
<div id="navbar">
|
||||
<div>
|
||||
<p class="text-2xl floater-elem" style="color: #888">{metadata.frontDescription}</p>
|
||||
<div id="navbar" class="h-5 items-center space-x-4 text-sm">
|
||||
</div>
|
||||
<div id="link-container" class="h-5 items-center">
|
||||
<a class="nav-link" href="#bio">Bio</a>
|
||||
{#each routes as item}
|
||||
{#if item.route !== "/"}
|
||||
|
@ -123,8 +125,6 @@
|
|||
background-size: contain;
|
||||
background-position: center center; */
|
||||
z-index: -10;
|
||||
min-width: 100svw;
|
||||
min-height: 100svh;
|
||||
overscroll-behaviour: none;
|
||||
}
|
||||
:global(#cover > svg) {
|
||||
|
@ -139,12 +139,12 @@
|
|||
:global(path) {
|
||||
filter: contrast(50%);
|
||||
}
|
||||
:global(.shadow) {
|
||||
:global(.effect) {
|
||||
visibility: hidden;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
:global(.shadow) {
|
||||
:global(.effect) {
|
||||
visibility: visible;
|
||||
}
|
||||
:global(path) {
|
||||
|
@ -159,39 +159,47 @@
|
|||
display: inline-block;
|
||||
}
|
||||
#cover-mobile {
|
||||
height: 100svh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
#floater {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-top: auto;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
#navbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
div {
|
||||
padding-left: 5%;
|
||||
}
|
||||
}
|
||||
#link-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
@media (max-width: 700px) {
|
||||
#cover {
|
||||
height: 0;
|
||||
width: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
#cover-mobile {
|
||||
visibility: visible;
|
||||
height: 100svh;
|
||||
}
|
||||
}
|
||||
@media (min-width: 701px) {
|
||||
#cover {
|
||||
min-width: 100svw;
|
||||
min-height: 100svh;
|
||||
visibility: visible;
|
||||
}
|
||||
#cover-mobile {
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue