WIP show handicap

kberg · Feb 6, 2025 · e7e7bf0 · e7e7bf0
1 parent 15111e1
commit e7e7bf0
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 5 deletions.
diff --git a/assets/resources/handicap.png b/assets/resources/handicap.png
diff --git a/src/client/components/overview/PlayerTags.vue b/src/client/components/overview/PlayerTags.vue
@@ -1,14 +1,15 @@
 <template>
     <div class="player-tags">
         <div class="player-tags-main">
-            <tag-count :tag="'vp'" :count="player.victoryPointsBreakdown.total" :size="'big'" :type="'main'" :hideCount="hideVpCount" />
+            <tag-count tag="vp" :count="player.victoryPointsBreakdown.total" :size="'big'" :type="'main'" :hideCount="hideVpCount" />
             <div v-if="isEscapeVelocityOn" :class="tooltipCss" :data-tooltip="$t('Escape Velocity penalty')">
-              <tag-count :tag="'escape'" :count="escapeVelocityPenalty" :size="'big'" :type="'main'"/>
+              <tag-count tag="escape" :count="escapeVelocityPenalty" :size="'big'" :type="'main'"/>
             </div>
-            <tag-count :tag="'tr'" :count="player.terraformRating" :size="'big'" :type="'main'"/>
+            <tag-count tag="tr" :count="player.terraformRating" :size="'big'" :type="'main'"/>
+            <tag-count v-if="player.terraformRating !== undefined" :tag="'handicap'" :count="player.terraformRating" :size="'big'" :type="'main'"/>
             <div class="tag-and-discount">
               <PlayerTagDiscount v-if="all.discount" :amount="all.discount" :color="player.color"  :data-test="'discount-all'"/>
-              <tag-count :tag="'cards'" :count="cardsInHandCount" :size="'big'" :type="'main'"/>
+              <tag-count tag="cards" :count="cardsInHandCount" :size="'big'" :type="'main'"/>
             </div>
         </div>
         <div class="player-tags-secondary">

diff --git a/src/styles/player_home.less b/src/styles/player_home.less
@@ -262,11 +262,22 @@
 }
 
 .tag-tr {
-    background-image: url(./assets/resources/tr.png);
     background-image: url(./assets/resources/tr.png);
     background-size: 49px 38px !important;
     background-position: -4px -2px !important;
 }
+.tag-handicap {
+  background-image: url(./assets/resources/handicap.png);
+  background-size: 42px 35px !important;
+  background-color: transparent;
+  box-shadow: none;
+  border-radius: unset;
+  filter: drop-shadow(.5px .5px 0 black)
+      drop-shadow(-.5px .5px 0 black)
+      drop-shadow(.5px -.5px 0 black)
+      drop-shadow(-.5px -.5px 0 black);
+}
+
 .tag-escape {
     background-image: url(./assets/expansion_icons/expansion_icon_escapeVelocity.png);
     background-size: 56px;