martyn
/
townsquare
mirror of https://github.com/bra1n/townsquare.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

adding tabs to role modal and moving non edition travellers in to second tab

This commit is contained in:
Dave 2021-01-09 13:23:59 +00:00
parent ea574fcc58
commit 016d7feb39
1 changed files with 43 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/components/modals/RoleModal.vue
View File

@ -11,23 +11,41 @@
: "bluffing"
}}
</h3>
<ul class="tokens">
<li
v-for="role in availableRoles"
:class="[role.team]"
:key="role.id"
@click="setRole(role)"
>
<Token :role="role" />
</li>
<li
v-for="role in extraTravellers"
:class="[role.team]"
:key="role.id"
@click="setRole(role)"
>
<Token :role="role" />
<ul>
<li class="button-group">
<span
class="button"
:class="{ active: tab === 'editionRoles' }"
@click="tab = 'editionRoles'"
>Edtition Roles</span
>
<span
class="button"
:class="{ active: tab === 'otherTravellers' }"
@click="tab = 'otherTravellers'"
>Other Travellers</span
>
</li>
<ul class="tokens" v-if="tab === 'editionRoles'">
<li
v-for="role in availableRoles"
:class="[role.team]"
:key="role.id"
@click="setRole(role)"
>
<Token :role="role" />
</li>
</ul>
<ul class="tokens" v-if="tab === 'otherTravellers'">
<li
v-for="role in extraTravellers"
:class="[role.team]"
:key="role.id"
@click="setRole(role)"
>
<Token :role="role" />
</li>
</ul>
</ul>
</Modal>
</template>
@ -63,6 +81,11 @@ export default {
...mapState(["modals", "roles", "session"]),
...mapState("players", ["players"])
},
data() {
return {
tab: "editionRoles"
};
},
methods: {
setRole(role) {
if (this.playerIndex < 0) {
@ -118,6 +141,10 @@ ul.tokens li {
}
}
.button.active {
background: linear-gradient(to bottom, $townsfolk 0%, rgba(0, 0, 0, 0.7) 100%);
}
#townsquare.spectator ul.tokens li.traveler {
display: none;
}