Skip to content
Snippets Groups Projects
Commit b452dd3b authored by mathieu.dartigues's avatar mathieu.dartigues
Browse files

Merge branch '44-css-actions-community' into 'main'

Amélioration "simple" des actions :

Closes #44

See merge request !37
parents 1bb3e58c 903221f3
No related branches found
No related tags found
1 merge request!37Amélioration "simple" des actions :
Pipeline #10367 passed
<template>
<div class="flex flex-row gap-4 justify-between">
<div class="flex gap-4 justify-around flex-wrap">
<template v-for="action in actionList" v-bind:key="action.id">
<div :class="[{'pb-6': action.needAccount && !isAuthenticated}, `bg-${color}-200`, `hover:bg-${color}-300`]" class="w-52 h-52 p-4 rounded-md cursor-pointer shadow-md"
<div :class="[{'pb-6': action.needAccount && !isAuthenticated}, `bg-${color}-200`, `hover:bg-${color}-300`]" class="size-48 p-4 rounded-md cursor-pointer shadow-md"
@click="dialogsVisible[action.id] = true">
<div class="flex flex-col h-full justify-evenly">
<h3 class="text-center font-bold">{{ translateValue(action.title) }}</h3>
<div v-if="action.fairBadges" class="flex flex-row justify-evenly gap-1">
<h3 class="text-center font-semibold">
{{ translateValue(action.title) }}
</h3>
<div v-if="action.fairBadges" class="flex justify-evenly gap-1">
<OcBadgeFair :fair-badges-visibility="action.fairBadges" size="large"/>
</div>
</div>
<span v-if="action.needAccount && !isAuthenticated" :title="t('homeActions.accountNeeded')" class="fa-solid fa-circle-user float-right pb-4"></span>
</div>
<Dialog v-model:visible="dialogsVisible[action.id]" modal class="max-w-[800px]">
<Dialog
v-model:visible="dialogsVisible[action.id]"
dismissable-mask
modal
class="max-w-[800px]"
>
<template #header>
<div class="flex flex-row gap-8 items-center mr-4">
<div class="flex gap-8 items-center mr-4">
<h3 class="font-title text-4xl uppercase font-bold text-[--p-primary-color]">{{ translateValue(action.title) }}</h3>
<div v-if="action.fairBadges" class="flex flex-row justify-evenly gap-1">
<div v-if="action.fairBadges" class="flex justify-evenly gap-1">
<OcBadgeFair :fair-badges-visibility="action.fairBadges" size="xlarge"/>
</div>
</div>
</template>
<hr class="mb-4">
<p class="text-justify w-full text-base font-semibold">
<p class="text-justify w-full text-base p-2">
{{ translateValue(action.description) }}
</p>
<span v-if="action.needAccount && !isAuthenticated" :title="t('homeActions.accountNeeded')" class="fa-solid fa-circle-user float-right pb-4"></span>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment