.row
challenge-modal(:challenge='challenge')
close-challenge-modal
.col-8.standard-page
.row
.col-8
h1 {{challenge.name}}
div
strong(v-once) {{$t('createdBy')}}
span {{challenge.author}}
strong.margin-left(v-once)
.svg-icon.calendar-icon(v-html="icons.calendarIcon")
| {{$t('endDate')}}
span {{challenge.endDate}}
.tags
span.tag(v-for='tag in challenge.tags') {{tag}}
.col-4
.box
.svg-icon.member-icon(v-html="icons.memberIcon")
| {{challenge.memberCount}}
.details(v-once) {{$t('participants')}}
.box
.svg-icon.gem-icon(v-html="icons.gemIcon")
| {{challenge.prize}}
.details(v-once) {{$t('prize')}}
.row
task-column.col-6(v-for="column in columns", :type="column", :key="column")
.col-4.sidebar.standard-page
.acitons
div(v-if='!isMember && !isLeader')
button.btn.btn-success(v-once, @click='joinChallenge()') {{$t('joinChallenge')}}
div(v-if='isMember')
button.btn.btn-danger(v-once, @click='leaveChallenge()') {{$t('leaveChallenge')}}
div(v-if='isLeader')
button.btn.btn-success(v-once) {{$t('addTask')}}
div(v-if='isLeader')
button.btn.btn-secondary(v-once, @click='edit()') {{$t('editChallenge')}}
div(v-if='isLeader')
button.btn.btn-danger(v-once, @click='closeChallenge()') {{$t('endChallenge')}}
.description-section
h2(v-once) {{$t('challengeDescription')}}
p {{challenge.description}}