Alert .vue example.

Alert.vue

<template>
    <div class="Alert Alert--{{ type | capitalize }}">
        <slot></slot>
    </div>
</template>

<script>
    export default {
        props: {
            type: {
                default: 'info'
            }
        }
    }
</script>

<style lang="sass">
    .Alert {
        padding: 10px;
    }

    .Alert--Info {
        background: #e3e3e3;
    }

    .Alert--Success {
        background: #8AC48A;
    }

    .Alert--Error {
        background: red;
        color: white;
    }
</style>