storj/web/satellite/src/components/common/VLoader.vue
Egon Elbre b8280bd057 web/satellite: enable vue/recommended linting
Change-Id: I73cd1e72f369a172f9416be9b1220cbbd6c77637
2021-08-11 11:10:51 +03:00

51 lines
1.0 KiB
Vue

// Copyright (C) 2021 Storj Labs, Inc.
// See LICENSE for copying information.
<template>
<div class="loader">
<LoaderImage :class="{ white: isWhite }" :style="style" />
</div>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
import LoaderImage from '@/../static/images/common/loader.svg';
@Component({
components: {
LoaderImage,
},
})
export default class VLoader extends Vue {
@Prop({ default: 'unset' })
private readonly width: string;
@Prop({ default: 'unset' })
private readonly height: string;
@Prop({ default: false })
private readonly isWhite: boolean;
/**
* Returns loader's width and height from props.
*/
public get style(): Record<string, unknown> {
return { width: this.width, height: this.height };
}
}
</script>
<style scoped lang="scss">
.loader {
width: 100%;
display: flex;
justify-content: center;
}
.white {
path {
fill: #fff;
}
}
</style>