<!--
  - Copyright (c) 2022.
  - Author Peter Placzek (tada5hi)
  - For the full copyright and license information,
  - view the LICENSE file that was distributed with this source code.
  -->

<script>
    import OnlineClients from "@/components/online/ContactsOnline";
    import Header from "@/layouts/header";

    export default {
        components: {Header, OnlineClients},
        meta: {

        },
        data() {
            return {

            }
        },
        computed: {
            loggedIn() {
                return this.$store.getters['auth/loggedIn'];
            }
        }
    }
</script>
<template>
    <div class="container">
        <h2 class="card-title mb-1 font-weight-bold"> Willkommen bei Animesu! 🙈</h2>
        <p class="card-text mb-2 h6 text-muted">Melde dich an deinen Account an und beginne das Abenteuer</p>

        <section class="hero forest-bg">
            <footer v-if="!loggedIn" class="hero-footer">
                <button class="btn btn-dark btn-xs mr-1">
                    Login
                </button>
                <button class="btn btn-primary btn-xs">
                    Registrieren
                </button>
            </footer>
        </section>
    </div>
</template>
<style>
.forest-bg {
    background-image: url("~assets/img/Hiking-pana.png");
    height: 700px;
    background-position: center center;
}
</style>
