forked from potsda.mn/mobilizon
Fix participants panel icons and improve tabs
Close #198 Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
5b1b7ee164
commit
c565076fac
|
@ -3,9 +3,10 @@
|
||||||
<b-tabs type="is-boxed" v-if="event">
|
<b-tabs type="is-boxed" v-if="event">
|
||||||
<b-tab-item>
|
<b-tab-item>
|
||||||
<template slot="header">
|
<template slot="header">
|
||||||
<b-icon icon="information-outline"></b-icon>
|
<b-icon icon="account-multiple"></b-icon>
|
||||||
<span>{{ $t('Participants')}} <b-tag rounded> {{ participantStats.approved }} </b-tag> </span>
|
<span>{{ $t('Participants')}} <b-tag rounded> {{ participantStats.approved }} </b-tag> </span>
|
||||||
</template>
|
</template>
|
||||||
|
<template>
|
||||||
<section v-if="participantsAndCreators.length > 0">
|
<section v-if="participantsAndCreators.length > 0">
|
||||||
<h2 class="title">{{ $t('Participants') }}</h2>
|
<h2 class="title">{{ $t('Participants') }}</h2>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
|
@ -19,12 +20,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
</template>
|
||||||
</b-tab-item>
|
</b-tab-item>
|
||||||
<b-tab-item>
|
<b-tab-item :disabled="participantStats.unapproved === 0">
|
||||||
<template slot="header">
|
<template slot="header">
|
||||||
<b-icon icon="source-pull"></b-icon>
|
<b-icon icon="account-multiple-plus"></b-icon>
|
||||||
<span>{{ $t('Requests') }} <b-tag rounded> {{ participantStats.unapproved }} </b-tag> </span>
|
<span>{{ $t('Requests') }} <b-tag rounded> {{ participantStats.unapproved }} </b-tag> </span>
|
||||||
</template>
|
</template>
|
||||||
|
<template>
|
||||||
<section v-if="queue.length > 0">
|
<section v-if="queue.length > 0">
|
||||||
<h2 class="title">{{ $t('Waiting list') }}</h2>
|
<h2 class="title">{{ $t('Waiting list') }}</h2>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
|
@ -38,12 +41,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
</template>
|
||||||
</b-tab-item>
|
</b-tab-item>
|
||||||
<b-tab-item>
|
<b-tab-item :disabled="participantStats.rejected === 0">
|
||||||
<template slot="header">
|
<template slot="header">
|
||||||
<b-icon icon="source-pull"></b-icon>
|
<b-icon icon="account-multiple-minus"></b-icon>
|
||||||
<span>{{ $t('Rejected')}} <b-tag rounded> {{ participantStats.rejected }} </b-tag> </span>
|
<span>{{ $t('Rejected')}} <b-tag rounded> {{ participantStats.rejected }} </b-tag> </span>
|
||||||
</template>
|
</template>
|
||||||
|
<template>
|
||||||
<section v-if="rejected.length > 0">
|
<section v-if="rejected.length > 0">
|
||||||
<h2 class="title">{{ $t('Rejected participations') }}</h2>
|
<h2 class="title">{{ $t('Rejected participations') }}</h2>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
|
@ -57,6 +62,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
</template>
|
||||||
</b-tab-item>
|
</b-tab-item>
|
||||||
</b-tabs>
|
</b-tabs>
|
||||||
</main>
|
</main>
|
||||||
|
@ -231,6 +237,15 @@ export default class Participants extends Vue {
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
section {
|
section {
|
||||||
padding: 3rem 0;
|
padding: 1rem 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="scss">
|
||||||
|
nav.tabs li {
|
||||||
|
margin: 3rem 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content {
|
||||||
|
background: #fff;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in a new issue