webllm-simple-chat / index.html
neetnestor's picture
feat: code highlighting
8d7626e
raw
history blame
1.66 kB
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>WebLLM Simple Chat Space</title>
<link rel="stylesheet" href="styles/katex.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css">
<link rel="stylesheet" href="styles/style.css" />
</head>
<body>
<main>
<h1>WebLLM Simple Chat Space</h1>
<p>
This is a minimal demo app showcasing how WebLLM enables AI chat
directly in your local browser. You might also enjoy exploring
<a
href="https://chat.webllm.ai/"
rel="nofollow noopener noreferrer"
target="_blank"
style="display: inline;"
>WebLLM Chat</a
>!
</p>
<h2>Step 1: Initialize WebLLM and Download Model</h2>
<div class="download-container">
<select id="model-selection"></select>
<button id="download">Download</button>
</div>
<p id="download-status" class="hidden"></p>
<h2>Step 2: Chat</h2>
<div class="chat-container">
<div id="chat-box" class="chat-box"></div>
<div id="chat-stats" class="chat-stats hidden"></div>
<div class="chat-input-container">
<div class="chat-input">
<input
type="text"
id="user-input"
placeholder="Type a message..."
/>
<button id="send" disabled>Send</button>
</div>
</div>
</div>
</main>
<script src="./dist/index.js" type="module"></script>
</body>
</html>