add id room, timer etc & style
continuous-integration/drone/push Build is passing Details

game-view
Bastien JACQUELIN 2 years ago
parent 3fc90743e2
commit aa019a020d

@ -0,0 +1,11 @@
.description{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 2rem 4rem 2rem 4rem;
}
h2{
font-size: 28px;
}

@ -2,6 +2,7 @@ export default{
emits:[], emits:[],
props:{ props:{
deckR:Deck, deckR:Deck,
idRoom:String
}, },
data: function(){ data: function(){
return{ return{
@ -10,7 +11,8 @@ export default{
deck : new Deck([0,1,2,3],3), deck : new Deck([0,1,2,3],3),
selectedCards:[], selectedCards:[],
nbCardsSelected:0, nbCardsSelected:0,
width:'12%' connected:'7/8',
timer:'10.51',
} }
}, },
methods:{ methods:{
@ -50,7 +52,13 @@ export default{
}, },
}, },
template:` template:`
<div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', 'flex-wrap':'wrap',margin:'20px 10em 20px 20px'}"> <div class="description">
<h2>Room: {{idRoom}}</h2>
<h2>{{timer}}</h2>
<h2>Players: {{connected}}</h2>
</div>
<div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', 'flex-wrap':'wrap',margin:'1rem 25rem 20px 20px'}">
<div class="Cardframe" v-bind:style="{ width:'12%', height:'15rem', margin:'2% 2% 2% 2%'}" v-for="n in deck.outputCards.length"> <div class="Cardframe" v-bind:style="{ width:'12%', height:'15rem', margin:'2% 2% 2% 2%'}" v-for="n in deck.outputCards.length">
<card-module @selected='selected' :id=n :card=this.deck.outputCards[n-1]></card-module> <card-module @selected='selected' :id=n :card=this.deck.outputCards[n-1]></card-module>
</div> </div>

@ -8,22 +8,22 @@
<!-- <base href="https://codefirst.iut.uca.fr/containers/HyperSet-hyperset/"> --> <!-- <base href="https://codefirst.iut.uca.fr/containers/HyperSet-hyperset/"> -->
<link rel="stylesheet" type="text/css" href="/styles/style.css"> <link rel="stylesheet" type="text/css" href="/styles/style.css">
<link rel="stylesheet" type="text/css" href="/styles/index.css"> <link rel="stylesheet" type="text/css" href="/styles/index.css">
<link rel="stylesheet" type="text/css" href="/styles/game.css">
</head> </head>
<header> <header>
<ul id="nav-bar"> <ul id="nav-bar">
<li><a href="./index.html">Home</a></li> <!-- maybe put a logo --> <li><a href="/index.html">Home</a></li> <!-- maybe put a logo -->
<li><a href="./views/cards-test.html">Card Test</a></li> <li><a href="/views/cards-test.html">Card Test</a></li>
<li><a href="./views/tutorial.html">Tutorial</a></li> <li><a href="/views/tutorial.html">Tutorial</a></li>
<li><a href="./views/leaderboard.html">Leaderboard</a></li> <li><a href="/views/leaderboard.html">Leaderboard</a></li>
<li><a href="./views/about.html">About</a></li> <li><a href="/views/about.html">About</a></li>
</ul> </ul>
</header> </header>
<body> <body>
<div id="app"> <div id="app">
<h1>Game - test </h1> <deck-module id-room="00000"></deck-module>
<deck-module></deck-module>
</div> </div>
<section> <section>
</section> </section>

Loading…
Cancel
Save