Add CreatorPresentation improve
This commit is contained in:
@@ -21,17 +21,14 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--reator presentation-->
|
||||
<div class="flex flex-row max-w-[1500px] mx-auto justify-center mt-8">
|
||||
<div>
|
||||
|
||||
<!-- Actualité feed-->
|
||||
<div class="flex flex-column px-2 max-w-80">
|
||||
<div>
|
||||
<Creatornewssummary :creator="creator"></Creatornewssummary>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="min-w-[875px]"></div>
|
||||
<div class="bg-fuchsia-800 flex-grow">
|
||||
</div>
|
||||
@@ -75,5 +72,4 @@ const fetchCreatorData = async (creatorAlias) => {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@@ -1,13 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="flex justify-center mb-2">
|
||||
<v-btn height="42" @click="scrollUp">
|
||||
<v-icon size="40">mdi-arrow-up-drop-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
|
||||
<div class="text-center text-white rounded-t-lg text-xl" :style="{ backgroundColor: creator.colors.bannerTop, letterSpacing: '5px' }">Actualité</div>
|
||||
|
||||
<div class="flex flex-column">
|
||||
<div v-for="(item, index) in visibleCards" :key="index" class="my-1 text-white" :style="{ backgroundColor: creator.colors.bannerTop }">
|
||||
<div class="flex justify-between items-center border-b-2 border-white p-3 mx-2">
|
||||
@@ -31,12 +24,14 @@
|
||||
<v-btn icon variant="plain"><v-icon>mdi-comment-outline</v-icon></v-btn>
|
||||
<v-btn icon variant="plain"><v-icon>mdi-gift-outline</v-icon></v-btn>
|
||||
</div>
|
||||
|
||||
<video v-if="item.video" controls :src="item.video" class="w-full h-auto my-2"></video>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center mt-2">
|
||||
<div class="flex justify-center mt-2 space-x-2">
|
||||
<v-btn height="42" @click="scrollUp">
|
||||
<v-icon size="40">mdi-arrow-up-drop-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn height="42" @click="scrollDown">
|
||||
<v-icon size="40">mdi-arrow-down-drop-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
@@ -47,8 +42,6 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, defineProps } from 'vue';
|
||||
|
||||
// Define props to receive creator
|
||||
const props = defineProps({
|
||||
creator: {
|
||||
type: Object,
|
||||
@@ -56,7 +49,6 @@ const props = defineProps({
|
||||
},
|
||||
});
|
||||
|
||||
// Simulate JSON data (replace with your actual data)
|
||||
const actualites = ref([
|
||||
{ type: 'nouvelle', title: 'La visite du studio', description: 'Je suis fier de vous montrer les installations sur lesquelles nous avons travaillé si fort.', photo: '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png', video: null, rating: null, date: '2024-09-19' },
|
||||
{ type: 'contenu', title: 'Éditer comme un pro!', description: 'Ceci est la description du contenu.', photo: null, video: null, rating: 4.5, date: '2024-09-18' },
|
||||
@@ -64,7 +56,6 @@ const actualites = ref([
|
||||
{ type: 'contenu', title: 'Contenu 2', description: 'Deuxième contenu avec description.', photo: null, video: null, rating: 5.0, date: '2024-09-16' },
|
||||
]);
|
||||
|
||||
// Control card visibility
|
||||
const startIndex = ref(0);
|
||||
const cardsPerPage = 3;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user