<template>
    <div class="dashboard m-3">
        <div class="content" data-effect="fadeIn">
            <div class="row">
                <div class="text-center">
                    <h2 class="text-blue-500">{{ title }}</h2>
                    <h6 class="text-red-600">{{ description }}</h6>
                </div>
            </div>

            <div class="row" style="margin: 0">
                <slot/>
            </div>
        </div>
    </div>
</template>

<script>
// import 'primeflex/primeflex.css'

    export default {
        name: "JarchDashboard",
        props: {
            title: {required: true},
            description: {required: true},
        },
        components: {},
    }
</script>

<style lang="scss">
    .dashboard .content {
        padding: 5px 20px 5px 20px;
        min-width: 320px;
    }

    .row {
        display: inline;
    }

</style>
