Change Cards

css/app.css

@@ -10,6 +10,7 @@ body {
 
 .playing-card {
     max-width: 100%;
+    margin: 10px;
 }
 
 #status {

index.htm

@@ -72,16 +72,16 @@
                     <template v-if="!roundActive">({{ dealerScore }})</template>
                 </h4>
                 <div class="row">
-                    <div class="col-sm-2" v-for="(card, index) in dealersHand">
-                        <img :src="index > 0 ? card.asset : roundActive ? cardBack : card.asset" :alt="card.symbol + '_' + card.points" class="playing-card">
+                    <div class="col-sm-12">
+                        <img :src="index > 0 ? card.asset : roundActive ? cardBack : card.asset" :alt="card.symbol + '_' + card.points" class="playing-card" v-for="(card, index) in dealersHand">
                     </div>
                 </div>
             </div>
             <div class="col-md-12 hand">
                 <h4>Hand (Points: {{ handScore === 21 && usersHand.count < 2 ? 'BlackJack' : handScore > 21 ? 'Plus! ' + handScore : handScore }})</h4>
                 <div class="row">
-                    <div class="col-sm-2" v-for="card in usersHand">
-                        <img :src="card.asset" :alt="card.symbol + '_' + card.points" class="playing-card">
+                    <div class="col-sm-12">
+                        <img :src="card.asset" :alt="card.symbol + '_' + card.points" class="playing-card" v-for="card in usersHand">
                     </div>
                 </div>
             </div>