From be2e64c85c08e42fb2934bf8444cf8d7c96d7dbb Mon Sep 17 00:00:00 2001
From: evanpelle <openfrontio@gmail.com>
Date: Thu, 29 May 2025 19:18:34 -0700
Subject: [PATCH] put meta changes in news modal

---
 resources/lang/en.json  |  3 +++
 src/client/NewsModal.ts | 39 +++++++++++++++++++++++++++++++++------
 2 files changed, 36 insertions(+), 6 deletions(-)

diff --git a/resources/lang/en.json b/resources/lang/en.json
index 7f4bd92d0..886b68fd6 100644
--- a/resources/lang/en.json
+++ b/resources/lang/en.json
@@ -20,6 +20,9 @@
     "advertise": "Advertise",
     "wiki": "Wiki"
   },
+  "news": {
+    "title": "Version 23 released!"
+  },
   "help_modal": {
     "hotkeys": "Hotkeys",
     "table_key": "Key",
diff --git a/src/client/NewsModal.ts b/src/client/NewsModal.ts
index 94c8116bf..13ddb67bb 100644
--- a/src/client/NewsModal.ts
+++ b/src/client/NewsModal.ts
@@ -12,6 +12,10 @@ export class NewsModal extends LitElement {
   };
 
   static styles = css`
+    :host {
+      display: block;
+    }
+
     .news-container {
       max-height: 60vh;
       overflow-y: auto;
@@ -24,10 +28,20 @@ export class NewsModal extends LitElement {
     .news-content {
       color: #ddd;
       line-height: 1.5;
-      background: rgba(255, 255, 255, 0.05);
+      background: rgba(0, 0, 0, 0.6);
       border-radius: 8px;
       padding: 1rem;
     }
+
+    .news-content a {
+      color: #4a9eff !important;
+      text-decoration: underline !important;
+      transition: color 0.2s ease;
+    }
+
+    .news-content a:hover {
+      color: #6fb3ff !important;
+    }
   `;
 
   render() {
@@ -36,7 +50,24 @@ export class NewsModal extends LitElement {
         <div class="options-layout">
           <div class="options-section">
             <div class="news-container">
-              <div class="news-content">INSERT NEWS HERE</div>
+              <div class="news-content">
+                <h3>Main things to note:</h3>
+                <br />
+                <ul>
+                  <li>Workers reproduce faster than troops.</li>
+                  <li>Defense = troops divided how much land you have.</li>
+                  <li>Attacking troops count toward your population limit.</li>
+                </ul>
+                <br />
+                <br />
+                See full changelog
+                <a
+                  href="https://discord.com/channels/1284581928254701718/1286745902320713780"
+                  target="_blank"
+                  style="color: #4a9eff; font-weight: bold;"
+                  >here</a
+                >.
+              </div>
             </div>
           </div>
         </div>
@@ -58,8 +89,4 @@ export class NewsModal extends LitElement {
   private close() {
     this.modalEl?.close();
   }
-
-  createRenderRoot() {
-    return this; // light DOM
-  }
 }