42 lines
1.3 KiB
Vue
42 lines
1.3 KiB
Vue
<template>
|
|
<div class="shadow-lg rounded-2xl" :style="{ backgroundColor: creator.colors.bannerBottom}">
|
|
<div class="relative z-20">
|
|
<div class="py-4 min-h-9 md:rounded-t-2xl"
|
|
:style="{ backgroundColor: creator.colors.bannerTop || '#6B0065' }">
|
|
</div>
|
|
<div class="h-1" :style="{ backgroundColor: creator.colors.accent || '#6B0065' }"> ></div>
|
|
|
|
<!--Banner-->
|
|
<div class="relative">
|
|
<div>
|
|
<img
|
|
class="w-full drop-shadow-[0_10px_6px_rgba(0,0,0,0.25)]"
|
|
:src="creator.images.banner ? creator.images.banner : '/images/placeholders/banner.png'"
|
|
alt="Profile Banner"
|
|
style="max-height: 425px"
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="h-1" :style="{ backgroundColor: creator.colors.accent || '#6B0065' }"></div>
|
|
<!--actions - Lowerpart-->
|
|
<banner-actions :creator="creator" @content-posted="addContent"></banner-actions>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import BannerActions from "@/views/creators/banner/bannerlower/BannerActions.vue";
|
|
|
|
const props = defineProps({
|
|
creator: {type: Object, required: true},
|
|
});
|
|
|
|
const emits = defineEmits(['content-posted'])
|
|
|
|
function addContent(content) {
|
|
emits('content-posted', content)
|
|
}
|
|
|
|
|
|
</script> |