minor css work for details page
This commit is contained in:
@@ -1,32 +1,53 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="game-title-box">
|
||||
<h1>#{{ game.id }} - {{ game.title }}</h1>
|
||||
</div>
|
||||
<div>
|
||||
<div class="gm-title-box">
|
||||
<h2>GameMaster: {{ game.gamemaster }}</h2>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Payout</h3>
|
||||
<div>{{ game.payoutEB }} eb</div>
|
||||
<div>{{ game.payoutIP }} IP</div>
|
||||
<div>{{ game.payoutLoot }}</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="d-flex flex-row justify-space-evenly">
|
||||
<div class="result-box">
|
||||
<h3>Payout</h3>
|
||||
<div>{{ game.payoutEB }} eb</div>
|
||||
<div>{{ game.payoutIP }} IP</div>
|
||||
<div>{{ game.payoutLoot }}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3>Picks</h3>
|
||||
<div v-for="pick in picks">
|
||||
{{ pick.characterName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="result-box">
|
||||
<h3>Picks</h3>
|
||||
<div v-for="pick in picks">
|
||||
{{ pick.characterName }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3>Apps</h3>
|
||||
<div v-for="app in apps">
|
||||
{{ app.characterName }}
|
||||
<div class="result-box">
|
||||
<h3>Apps</h3>
|
||||
<div v-for="app in apps">
|
||||
{{ app.characterName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.game-title-box {
|
||||
margin-top: 25px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.gm-title-box {
|
||||
margin-top: 5px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.result-box {
|
||||
margin: 10px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { watch, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
Reference in New Issue
Block a user