ci : fix image directory

Dockerfile

@@ -9,6 +9,7 @@ RUN python3 -u ./src/generate_cards_mvp.py
 
 FROM install-stage AS build-stage
 COPY --from=svg-stage /app/output/heron ./assets/images/cards/heron-svg
+COPY --from=svg-stage /app/img/skins ./public/img
 
 ARG NUXT_PUBLIC_ENDPOINT
 ARG NUXT_PUBLIC_DISCORD_LOGIN_ENDPOINT
@@ -19,4 +20,5 @@ RUN npx nuxi generate
 # étape de production
 FROM nginx:stable-alpine AS production-stage
 COPY --from=build-stage /app/.output/public /usr/share/nginx/html
+COPY --from=svg-stage /app/img/skins /usr/share/nginx/html/public/img/skins
 COPY ./nginx.conf /etc/nginx/conf.d/default.conf

components/game/card/ChampionSmall.vue

@@ -56,14 +56,38 @@ const active = ref(false);
           ></GameCardAtom>
         </div>
       </foreignObject>
+      <circle
+        cx="2"
+        cy="-1"
+        r="1"
+        :fill="card.guard ? 'black' : 'lightgray'"
+        stroke="white"
+        stroke-width="0.2"
+        class="champion_small_defense"
+        :class="{ active }"
+      ></circle>
+      <text
+        text-anchor="middle"
+        font-family="Helvetica"
+        font-weight="bold"
+        class="champion_small_defense"
+        font-size="1.5"
+        :class="{ active }"
+        x="2"
+        y="-.5"
+        :fill="card.guard ? 'white' : 'black'"
+      >
+        {{ card.defense }}
+      </text>
     </svg>
   </div>
 </template>
 
 <style>
 .champion_small {
-  z-index: 10;
+  z-index: 2;
   width: 100%;
+  margin-top: 10px;
 }
 
 .champion_small_svg {
@@ -75,8 +99,8 @@ const active = ref(false);
   clip-path: polygon(
     58% 62%,
     67% 56%,
-    59% 34%,
+    59% 35.8%,
-    40% 34%,
+    40% 35.8%,
     31% 55%,
     41% 62%,
     49% 67.77%
@@ -86,6 +110,15 @@ const active = ref(false);
   cursor: pointer;
 }
 
+.champion_small_defense {
+  transition: 0.15s all var(--animation-curve);
+  pointer-events: none;
+}
+
+.champion_small_defense.active {
+  opacity: 0;
+}
+
 .champion_small_foreignObject.active {
   clip-path: polygon(100% 100%, 100% 50%, 100% 0, 0 0, 0 50%, 0 100%, 49% 100%);
   transform: translate(-50%, -50%);
@@ -97,7 +130,6 @@ const active = ref(false);
   transform: translate(0, -20%) scale(50%);
   display: flex;
   position: relative;
-  z-index: 10;
 }
 
 .champion_small_foreignObject.active .champion_small_inside {

components/game/player/Slot.vue

@@ -309,7 +309,6 @@ function discardCardClick(card: Card) {
     "turn_buttons";
   justify-items: center;
   transition: all 1s;
-  overflow-x: hidden;
 }
 
 #current_player_board {

netcode/interfaces.ts

@@ -107,4 +107,6 @@ export interface Card extends GameObject {
   cardId: number;
   cardType: CardType;
   effects: Effect[];
+  defense?: number;
+  guard?: boolean;
 }

pages/game.vue

@@ -489,7 +489,7 @@ footer {
   display: flex;
   flex-direction: column;
   justify-content: center;
-  overflow-x: hidden;
+  overflow-x: clip;
   /* background: url('/img/bg-darkgrass.png'); */
 }