storj/web/satellite/src/components/common/VLoader.vue
Egon Elbre 0889866b17 web/: add @vue/component annotations
Some linters do not work properly without those annotations.
This was done with a batch replace.

Also needed to turn off two lint rules, they will be re-enabled in the
followup change. This way the batch change can be clearly separated from
manual modifications.

Change-Id: I891ae09689520edaba5588c1f2206766db2d2b90
2021-08-31 21:25:49 +03:00

52 lines
1.1 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';
// @vue/component
@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>