mirror of
https://github.com/NoCrypt/migu.git
synced 2026-03-11 17:45:32 +00:00
44 lines
1 KiB
Svelte
44 lines
1 KiB
Svelte
<script>
|
|
import { click } from '@/modules/click.js'
|
|
|
|
let _click = () => {}
|
|
export { _click as click }
|
|
export let page
|
|
export let _page = ''
|
|
export let css = ''
|
|
export let icon = ''
|
|
export let nowPlaying = false
|
|
export let overlay = ''
|
|
</script>
|
|
|
|
<div
|
|
class='navbar-link navbar-link-with-icon pointer overflow-hidden mx-auto {css}'
|
|
use:click={() => { if (!icon.includes("favorite")) { window.dispatchEvent(new Event('overlay-check')) } _click() } }>
|
|
|
|
<span class='rounded d-flex'>
|
|
<slot active={(page === _page && overlay !== 'active') || (overlay === 'active' && nowPlaying)}>{icon}</slot>
|
|
</span>
|
|
</div>
|
|
|
|
<style>
|
|
|
|
.navbar-link > span {
|
|
color: #fff;
|
|
border-radius: 0.3rem;
|
|
}
|
|
|
|
.navbar-link > span {
|
|
color: #fff;
|
|
transition: background .8s cubic-bezier(0.25, 0.8, 0.25, 1), color .8s cubic-bezier(0.25, 0.8, 0.25, 1);
|
|
}
|
|
|
|
.navbar-link:active > span {
|
|
background: #fff;
|
|
color: var(--dark-color);
|
|
}
|
|
.navbar-link {
|
|
font-size: 1.4rem;
|
|
padding: 0.75rem;
|
|
height: 5.5rem;
|
|
}
|
|
</style>
|