68 lines
2.4 KiB
HTML
68 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>Echo: True Peer-to-Peer file and text transfers</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="stylesheet" href="index.css" />
|
|
<link rel="icon" type="image/svg+xml" href="favicon.svg" />
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="app">
|
|
<header class="app-header">
|
|
<h1 class="logo">Echo</h1>
|
|
<p class="tagline">Simple peer-to-peer text & files</p>
|
|
</header>
|
|
|
|
<main class="app-main">
|
|
<section class="card" id="landing-card">
|
|
<div class="card-heading">Start a secure session</div>
|
|
<div class="card-subheading">Create a fresh room or join with an invite code.</div>
|
|
<div class="actions">
|
|
<button class="btn btn-primary" id="create-session-btn">
|
|
Create a session
|
|
</button>
|
|
|
|
<div class="divider">or</div>
|
|
|
|
<div class="join-section">
|
|
<label for="session-id" class="label">Join a session</label>
|
|
<input type="text" id="session-id" class="input" placeholder="Paste session ID here" />
|
|
<button class="btn btn-secondary" id="join-session-btn">
|
|
Join
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card hidden" id="chat-card">
|
|
<div class="chat-header">
|
|
<div>
|
|
<div class="chat-title">Live session</div>
|
|
<div class="chat-session" id="chat-session-info"></div>
|
|
</div>
|
|
<button class="btn btn-secondary" id="leave-session-btn">
|
|
Leave session
|
|
</button>
|
|
</div>
|
|
|
|
<div class="chat-log" id="chat-log"></div>
|
|
|
|
<form class="chat-input-row" id="chat-form">
|
|
<input type="text" id="chat-input" class="input chat-input" placeholder="Type a message..." autocomplete="off" />
|
|
<button class="btn btn-primary" id="chat-send-btn">
|
|
Send
|
|
</button>
|
|
</form>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
|
|
<script src="index.js"></script>
|
|
</body>
|
|
|
|
</html>
|