DigitalConsumer.FixMyGlass/src/ux-components/loader/loader.vue

31 lines
619 B
Vue

<template>
<div class="loader"
v-bind:style="{width: `${sizeInRem}rem`, height: `${sizeInRem}rem`}"
v-bind:class="[this.loaderColor, this.loaderPosition]"
></div>
</template>
<script>
export default {
name: "loader",
/* Specify size in rem where 16px = 1rem */
props: {
sizeInRem: {
type: Number,
default: 1
},
/* Color options: red, green, blue, white, black */
loaderColor: {
type: String
},
/* Position options: center, right, left (OPTIONAL) */
loaderPosition: {
type: String
}
},
}
</script>
<style lang="scss">
@include loader();
</style>