From 6dae286e19c4932e4d01b2fb0be6ff4342cb6ef7 Mon Sep 17 00:00:00 2001
From: Outrun Colors <itsoutruncolors@gmail.com>
Date: Fri, 23 Sep 2022 23:08:35 -0500
Subject: [PATCH] Minor chat styling issue

---
 chat/build.js                  | 2 ++
 chat/src/App.css               | 6 +++++-
 chat/src/App.tsx               | 1 +
 files/assets/css/chat_done.css | 5 ++++-
 files/assets/js/chat_done.js   | 2 +-
 5 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/chat/build.js b/chat/build.js
index b43385bd7..6d455164f 100644
--- a/chat/build.js
+++ b/chat/build.js
@@ -1,4 +1,5 @@
 require('dotenv').config()
+const package = require("./package.json");
 const path = require("path");
 const { build } = require("esbuild");
 
@@ -8,6 +9,7 @@ const options = {
   bundle: true,
   minify: process.env.NODE_ENV === "production",
   define: {
+    "process.env.VERSION": `"${package.version}"`,
     "process.env.NODE_ENV": `"${process.env.NODE_ENV}"`,
     "process.env.DEBUG": process.env.DEBUG,
     "process.env.FEATURES_ACTIVITY": process.env.FEATURES_ACTIVITY,
diff --git a/chat/src/App.css b/chat/src/App.css
index ee61b3cbd..db435b636 100644
--- a/chat/src/App.css
+++ b/chat/src/App.css
@@ -27,6 +27,10 @@
   align-items: center;
 }
 
+.App-heading small {
+  opacity: 0.2;
+}
+
 .App-side {
   position: absolute;
   top: 0;
@@ -34,7 +38,7 @@
   background: var(--gray-500);
 }
 
-@media screen and (min-width: 1100px) {
+@media screen and (max-width: 1100px) {
   .App-side {
     display: none;
   }
diff --git a/chat/src/App.tsx b/chat/src/App.tsx
index e604b28ff..741e6e460 100644
--- a/chat/src/App.tsx
+++ b/chat/src/App.tsx
@@ -33,6 +33,7 @@ function AppInner() {
     <div className="App" ref={dropRef}>
       <div className="App-wrapper">
         <div className="App-heading">
+          <small>v{process.env.VERSION}</small>
           <ChatHeading />
         </div>
         <div id="chatWrapper" className="App-content">
diff --git a/files/assets/css/chat_done.css b/files/assets/css/chat_done.css
index b250fd4ec..23fc1443e 100644
--- a/files/assets/css/chat_done.css
+++ b/files/assets/css/chat_done.css
@@ -288,13 +288,16 @@ lite-youtube {
   display: flex;
   align-items: center;
 }
+.App-heading small {
+  opacity: 0.2;
+}
 .App-side {
   position: absolute;
   top: 0;
   right: 0;
   background: var(--gray-500);
 }
-@media screen and (min-width: 1100px) {
+@media screen and (max-width: 1100px) {
   .App-side {
     display: none;
   }
diff --git a/files/assets/js/chat_done.js b/files/assets/js/chat_done.js
index 055f4bc9f..175a8c6ae 100644
--- a/files/assets/js/chat_done.js
+++ b/files/assets/js/chat_done.js
@@ -32674,7 +32674,7 @@
       className: "App-wrapper"
     }, /* @__PURE__ */ import_react35.default.createElement("div", {
       className: "App-heading"
-    }, /* @__PURE__ */ import_react35.default.createElement(ChatHeading, null)), /* @__PURE__ */ import_react35.default.createElement("div", {
+    }, /* @__PURE__ */ import_react35.default.createElement("small", null, "v", "0.0.2"), /* @__PURE__ */ import_react35.default.createElement(ChatHeading, null)), /* @__PURE__ */ import_react35.default.createElement("div", {
       id: "chatWrapper",
       className: "App-content"
     }, /* @__PURE__ */ import_react35.default.createElement("div", {