From 01b0b55e510c00a60434f02eb71ef7951fb802d0 Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Wed, 26 Oct 2022 09:07:35 +0300
Subject: [PATCH] Add patch badge to obj dmg calc page

---
 app/routes/object-damage-calculator.tsx | 11 +++++++++--
 app/styles/object-damage.css            | 17 +++++++++++++++++
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/app/routes/object-damage-calculator.tsx b/app/routes/object-damage-calculator.tsx
index 6d01e2477..c5572dd01 100644
--- a/app/routes/object-damage-calculator.tsx
+++ b/app/routes/object-damage-calculator.tsx
@@ -31,6 +31,8 @@ import { Ability } from "~/components/Ability";
 import { damageTypeTranslationString } from "~/utils/i18next";
 import { useSetTitle } from "~/hooks/useSetTitle";
 
+export const CURRENT_PATCH = "1.2";
+
 export const links: LinksFunction = () => {
   return [{ rel: "stylesheet", href: styles }];
 };
@@ -106,8 +108,13 @@ export default function ObjectDamagePage() {
         subWeaponId={subWeaponId}
         damagesToReceivers={damagesToReceivers}
       />
-      <div className="text-lighter text-xs">
-        {t("analyzer:dmgHtdExplanation")}
+      <div className="object-damage__bottom-container">
+        <div className="text-lighter text-xs">
+          {t("analyzer:dmgHtdExplanation")}
+        </div>
+        <div className="object-damage__patch">
+          {t("analyzer:patch")} {CURRENT_PATCH}
+        </div>
       </div>
     </Main>
   );
diff --git a/app/styles/object-damage.css b/app/styles/object-damage.css
index d142de70f..c781599f0 100644
--- a/app/styles/object-damage.css
+++ b/app/styles/object-damage.css
@@ -81,3 +81,20 @@
   letter-spacing: 0.5px;
   margin-block-start: var(--s-2);
 }
+
+.object-damage__bottom-container {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.object-damage__patch {
+  border-radius: var(--rounded);
+  background-color: var(--theme-transparent);
+  color: var(--text-lighter);
+  font-size: var(--fonts-xxxs);
+  font-weight: var(--bold);
+  padding-block: var(--s-0-5);
+  padding-inline: var(--s-1);
+}