RNM/DAV
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ui enhancement
All checks were successful
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/pr Build is passing
Details

Browse Source
This commit is contained in:
Do-raa
2024-12-23 19:23:36 +01:00
parent e24b3e1955
commit 1b35e137d3
3 changed files with 22 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
pages/index.vue
View File

@@ -106,7 +106,7 @@
<p class="text-xs text-black mb-8 px-1 text-center">{{ summary.description }}</p>
</v-row>
<v-row class="justify-center">
<v-col cols="12" md="6" lg="8"> <!-- Make it take more space on large screens -->
<v-col cols="12" md="6" lg="8">
<v-expansion-panels variant="accordion">
<v-expansion-panel v-for="(article, index) in articles" :key="article.id" class="article">
<v-expansion-panel-title class="d-flex flex-column align-start" expand-icon=""
@@ -114,17 +114,17 @@
<div class="flex items-center mb-0">
<!-- Like/Dislike Section -->
<div class="mr-3 flex items-center">
<v-icon class="mr-1 text-primary text-xs" size="18"
<v-icon class="mr-1 text-xs" size="18" color="yellow"
@click.stop="likeArticle(article.id)">
mdi-thumb-up
</v-icon>
<p class="text-primary text-sm">{{ article.likes }}</p>
<p class="text-gray-400 text-sm">{{ article.likes }}</p>
<v-icon class="mr-1 ml-2 text-tertiary text-xs" size="18"
<v-icon class="mr-1 ml-2 text-xs" size="18" color="yellow"
@click.stop="dislikeArticle(article.id)">
mdi-thumb-down
</v-icon>
<p class="text-tertiary text-sm">{{ article.dislikes }}</p>
<p class="text-gray-400 text-sm">{{ article.dislikes }}</p>
</div>
<h2 class="text-sm text-wrap text-black font-bold m-0">
{{ article.title }}
@@ -146,12 +146,12 @@
<div class="flex items-center mb-0">
<!-- Like/Dislike Section -->
<div class="mr-3 flex items-center">
<v-icon color="primary" size="14"
<v-icon color="yellow" size="14"
@click="likeComment(article.id, comment.id)">mdi-thumb-up</v-icon>
<span class="text-xs text-primary ml-1 mr-2">{{ comment.likes }}</span>
<v-icon color="tertiary" size="14"
<span class="text-xs text-gray-400 ml-1 mr-2">{{ comment.likes }}</span>
<v-icon color="yellow" size="14"
@click="dislikeComment(article.id, comment.id)">mdi-thumb-down</v-icon>
<span class="text-xs text-tertiary ml-1">{{ comment.dislikes }}</span>
<span class="text-xs text-gray-400 ml-1">{{ comment.dislikes }}</span>
</div>
<!-- Comment Content -->
<p class="text-sm text-black">{{ comment.content }}</p>
@@ -171,8 +171,8 @@
</v-row>
<!-- Signature Section -->
<v-row class="mr-2">
<v-col cols="12">
<v-row class="justify-center w-full">
<v-col cols="12" md="6" lg="8">
<v-card elevation="3" class="pa-6 bg-gray-100" color="secondary">
<v-card-title class="text-center">
<h2 class="text-uppercase text-md font-semibold font-sans">Signer la Charte</h2>
@@ -201,8 +201,8 @@
</v-row>
<!-- Signature Display Section -->
<v-row class=" sm:my-8">
<v-col cols="12">
<v-row class="justify-center">
<v-col cols="12" md="6" lg="8">
<v-expansion-panels variant="accordion">
<v-expansion-panel>
<v-expansion-panel-title class="d-flex flex-column align-start" expand-icon=""
@@ -330,8 +330,12 @@ const fetchContent = async () => {
}
}
// Split articles into left and right columns
leftColumnArticles.value = articles.value.filter((_, index) => index % 2 === 0);
rightColumnArticles.value = articles.value.filter((_, index) => index % 2 !== 0);
// leftColumnArticles.value = articles.value.filter((_, index) => index % 2 === 0);
// rightColumnArticles.value = articles.value.filter((_, index) => index % 2 !== 0);
// Split articles into two columns (assuming a 50% split)
const midIndex = Math.ceil(articles.value.length / 2);
leftColumnArticles.value = articles.value.slice(0, midIndex);
rightColumnArticles.value = articles.value.slice(midIndex);
// Initialize newComments object based on article IDs
articles.value.forEach(article => {
newComments.value[article.id] = '';