48 lines
No EOL
1.2 KiB
Svelte
48 lines
No EOL
1.2 KiB
Svelte
<script lang="ts">
|
|
import { browser } from "$app/environment";
|
|
import { RiAddCircleLine, RiChat2Line, RiCompassDiscoverLine, RiHome2Line, RiHomeLine, RiNotificationLine } from "svelte-remixicon";
|
|
|
|
function rickroll (){
|
|
if (browser) {
|
|
window.open( "https://youtu.be/dQw4w9WgXcQ" );
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<footer class="mobileonly">
|
|
<ul class="row">
|
|
<li><a href="/" title="Homepage"><RiHome2Line size="2em" /></a></li>
|
|
<li><a href="/" title="Discover"><RiCompassDiscoverLine size="2em" /></a></li>
|
|
<li><a href="/new" title="Create"><RiAddCircleLine size="2em" /></a></li>
|
|
<li><a href="/user/yusur" title="Messages"><RiChat2Line size="2em" /></a></li>
|
|
<li><a href="?" onclick={rickroll} title="Notifications"><RiNotificationLine size="2em" /></a></li>
|
|
</ul>
|
|
</footer>
|
|
|
|
<style>
|
|
|
|
footer {
|
|
position: sticky;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: var(--background);
|
|
box-shadow: 0 0 6px var(--border);
|
|
z-index: 150;
|
|
}
|
|
|
|
ul.row {
|
|
align-items: stretch;
|
|
justify-content: stretch;
|
|
}
|
|
|
|
ul.row > li {
|
|
flex: 1;
|
|
padding: .5em;
|
|
margin: 0;
|
|
text-align: center;
|
|
}
|
|
</style> |