mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2025-10-03 07:46:18 +00:00
Update protocolBadge.vue
This commit is contained in:
@@ -6,25 +6,15 @@ const props = defineProps({
|
|||||||
protocol: String,
|
protocol: String,
|
||||||
mini: false
|
mini: false
|
||||||
})
|
})
|
||||||
|
|
||||||
const blur = ref(undefined)
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
setTimeout(() => {
|
|
||||||
blur.value = !props.mini
|
|
||||||
}, 500)
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="position-relative">
|
<div class="position-relative">
|
||||||
<span class="badge wireguardBg rounded-3 shadow z-1"
|
<span class="badge wireguardBg rounded-3 shadow z-1"
|
||||||
:class="{blur: blur === true}"
|
|
||||||
v-if="protocol === 'wg'">
|
v-if="protocol === 'wg'">
|
||||||
WireGuard <LocaleText t="Configuration" v-if="!mini"></LocaleText>
|
WireGuard <LocaleText t="Configuration" v-if="!mini"></LocaleText>
|
||||||
</span>
|
</span>
|
||||||
<span class="badge amneziawgBg rounded-3 shadow"
|
<span class="badge amneziawgBg rounded-3 shadow"
|
||||||
:class="{blur: blur === true}"
|
|
||||||
v-else-if="protocol === 'awg'">
|
v-else-if="protocol === 'awg'">
|
||||||
AmneziaWG <LocaleText t="Configuration" v-if="!mini"></LocaleText>
|
AmneziaWG <LocaleText t="Configuration" v-if="!mini"></LocaleText>
|
||||||
</span>
|
</span>
|
||||||
@@ -32,12 +22,4 @@ onMounted(() => {
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.wireguardBg.blur{
|
|
||||||
box-shadow: rgba(255, 56, 56, 1) 3rem 1rem 8rem 10px !important;
|
|
||||||
transition: box-shadow 1s cubic-bezier(0.82, -0.07, 0, 1);
|
|
||||||
}
|
|
||||||
.amneziawgBg.blur{
|
|
||||||
box-shadow: rgb(227, 142, 65) 3rem 1rem 8rem 10px !important;
|
|
||||||
transition: box-shadow 1s cubic-bezier(0.82, -0.07, 0, 1);
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
Reference in New Issue
Block a user