<template>
    <div class="line" :style="{ background }"></div>
</template>

<script>
export default {
    name: "qg-line",
    props: {
        color: {
            type: String,
            default: "#f5f5f5",
        },
    },
    computed: {
        background() {
            let style = this.$lineColor || this.color;
            return this.color === "#f5f5f5" ? style : this.color;
        },
    },
};
</script>

<style scoped>
.line {
    height: 1rem;
    width: 100%;
}
</style>
