From 7c5a2ff4f3e6bd28d6484cf092e936dde26ef8c8 Mon Sep 17 00:00:00 2001
From: Bastien Jacquelin <bastien.jacquelin@etu.uca.fr>
Date: Wed, 22 Mar 2023 08:46:38 +0100
Subject: [PATCH] need to minimize card when more than 12

---
 views/card-module.js | 2 +-
 views/deck-module.js | 7 +++----
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/views/card-module.js b/views/card-module.js
index ce4fe1d..5e737e9 100644
--- a/views/card-module.js
+++ b/views/card-module.js
@@ -13,7 +13,7 @@ export default{
         }
     },
     template:`
-    <div v-bind:id="idUsed" v-bind:style="{border: '2px solid black', color: 'red', fontSize: '20px', cursor: 'pointer' }" v-on:click="clicked">
+    <div v-bind:id="idUsed" v-bind:style="{border: '2px solid black', color: 'red', fontSize: '20px', cursor: 'pointer',width:'100%',height:'100%' }" v-on:click="clicked">
         {{card.attributes}}
     </div>
     `
diff --git a/views/deck-module.js b/views/deck-module.js
index 13c2bae..acd6155 100644
--- a/views/deck-module.js
+++ b/views/deck-module.js
@@ -18,14 +18,14 @@ export default{
             else{
                 if(this.selectedCards[id]!=null){
                     console.log("deselec")
-                    document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid black; color: red; fontSize: 20px; cursor: pointer");
+                    document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid black; color: red; fontSize: 20px; cursor: pointer; width:100%; height:100%");
                     this.nbCardsSelected-=1
                     this.selectedCards[id]=null
                 }
                 else{
                     console.log("Selec")
                     this.selectedCards[id]=this.deck.outputCards[id-1]
-                    document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid red; color: red; fontSize: 20px; cursor: pointer");
+                    document.querySelector(`#id${id}`).setAttribute("style","border: 2px solid red; color: red; fontSize: 20px; cursor: pointer; width:100%; height:100%");
                     this.nbCardsSelected+=1
                     if(this.nbCardsSelected==this.deck.nbCards){
                         console.log("this.selectedCards.length",this.selectedCards.length)
@@ -47,8 +47,7 @@ export default{
     },
     template:`
     <div v-bind:style="{border: '3px solid black', fontSize: '20px', display:'flex', 'flex-wrap':'wrap',margin:'20px 10em 20px 20px'}">
-        <div class="Cardframe" v-bind:style="{ width:'12%', heigh:'40%', margin:'2% 2% 2% 2%',border: '2px solid green'}" v-for="n in deck.outputCards.length">
-            {{ n }}
+        <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>
         </div>
     </div>