first client ver

1 files changed, 77 insertions, 0 deletions

diff --git a/client/public/index.html b/client/public/index.html
new file mode 100644
index 0000000..5ad6a1a
--- /dev/null
+++ b/client/public/index.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>chatcast</title>
+    <link href="https://fonts.googleapis.com/css2?family=Berkeley+Mono:ital@0;1&family=Syne:wght@400;700&display=swap"
+        rel="stylesheet">
+    <link href="style.css" rel="stylesheet">
+</head>
+
+<body>
+
+    <div class="header">
+        <button id="sidebar-toggle" aria-label="Toggle sidebar" aria-expanded="false">
+            <svg viewBox="0 0 13 11" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+                <rect y="0" width="13" height="1.3" rx="0.65" fill="currentColor" />
+                <rect y="4.85" width="13" height="1.3" rx="0.65" fill="currentColor" />
+                <rect y="9.7" width="13" height="1.3" rx="0.65" fill="currentColor" />
+            </svg>
+        </button>
+        <span class="header-text">chatcast</span>
+        <span class="header-badge"><span class="dot dot-live"></span><text class="status">idle</text></span>
+    </div>
+
+    <div id="sidebar-backdrop"></div>
+
+    <div class="layout">
+
+        <sidebar id="sidebar">
+            <s-head>
+                channels
+                <button id="sidebar-close" aria-label="close sidebar">✕</button>
+            </s-head>
+
+            <s-body>
+                <s-item archived>file transfers</s-item>
+
+                <s-cat>channels</s-cat>
+                <s-channels>
+                </s-channels>
+
+                <s-cat>direct messages</s-cat>
+                <s-directs>
+                </s-directs>
+            </s-body>
+
+            <s-foot>
+                <s-avatar></s-avatar>
+                <s-user>
+                    <s-name>???</s-name>
+                    <s-status>it's... you!</s-status>
+                </s-user>
+            </s-foot>
+        </sidebar>
+
+        <div class="main">
+            <container></container>
+            <box>
+                <button class="btn btn-primary file-btn">📁</button>
+                <input type="text" placeholder="type a message...">
+                <button class="send-btn">send ↵</button>
+            </box>
+        </div>
+
+    </div>
+
+    <div class="modal-backdrop" id="modal-backdrop">
+        <div class="modal" id="modal-el" role="dialog" aria-modal="true" tabindex="-1"></div>
+    </div>
+
+    <script src="chat.ts"></script>
+    <script src="stuff.ts"></script>
+</body>
+
+</html>
\ No newline at end of file