Minor chat styling issue

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,

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;
   }

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">

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;
   }

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", {