440b732c71
* feat(ui): New status page UI * docs: Rename labels to extra-labels * Fix domain expiration test * feat(ui): Add ui.default-sort-by and ui.default-filter-by * Change ui.header default value to Gatus * Re-use EndpointCard in Details.vue as well to avoid duplicate code * Fix flaky metrics test * Add subtle green color to "Gatus" * Remove duplicate title (tooltip is sufficient, no need for title on top of that) * Fix collapsed group user preferences * Update status page screenshots
35 lines
667 B
Vue
35 lines
667 B
Vue
<template>
|
|
<div class="flex justify-center items-center">
|
|
<img
|
|
:class="[
|
|
'animate-spin rounded-full opacity-60 grayscale',
|
|
sizeClass,
|
|
]"
|
|
src="../assets/logo.svg"
|
|
alt="Gatus logo"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed } from 'vue'
|
|
|
|
const props = defineProps({
|
|
size: {
|
|
type: String,
|
|
default: 'md',
|
|
validator: (value) => ['xs', 'sm', 'md', 'lg', 'xl'].includes(value)
|
|
},
|
|
})
|
|
|
|
const sizeClass = computed(() => {
|
|
const sizes = {
|
|
xs: 'w-4 h-4',
|
|
sm: 'w-6 h-6',
|
|
md: 'w-8 h-8',
|
|
lg: 'w-12 h-12',
|
|
xl: 'w-16 h-16'
|
|
}
|
|
return sizes[props.size] || sizes.md
|
|
})
|
|
</script> |