<script lang="ts">
    import { navigate } from "svelte-routing"

    export let path: string
    export let bright
</script>

<button class="more" class:bright="{bright}" on:click="{() => navigate(path)}">mehr</button>

<style lang="less">
    @import "../../assets/css/main.less";
    .more {
        background-color: @signal-color;
        color: @font-color-secondary;
        border: none;
        height: 36px;
        padding: 2px 15px;
        font-size: 20px;
        font-weight: bold;
    }
    .bright {
        border: 2px solid @bg-color;
        background-color: @bg-color-secondary;
        &:hover {
            background-color: @signal-color;
        }
    }
</style>
