Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>NeuraRAG</title> | |
| <link rel="stylesheet" href="styles.css"> | |
| <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;600;800&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <!-- Header --> | |
| <header class="header"> | |
| <div class="logo"> | |
| <h1>NeuraRAG</h1> | |
| <span class="tagline">Intelligent Retrieval & Generation</span> | |
| </div> | |
| <nav class="nav"> | |
| <button id="theme-toggle" aria-label="Toggle theme"> | |
| <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor"> | |
| <path d="M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3v6m4-3H8" stroke-width="2"/> | |
| </svg> | |
| </button> | |
| </nav> | |
| </header> | |
| <!-- Main Content --> | |
| <main class="main"> | |
| <!-- Query Input --> | |
| <section class="panel query-panel"> | |
| <h2>Query</h2> | |
| <div class="input-group"> | |
| <textarea id="query-input" placeholder="What would you like to explore?" rows="3" aria-label="Query input"></textarea> | |
| <button id="submit-query" class="btn btn-action">Ask NeuraRAG</button> | |
| </div> | |
| </section> | |
| <!-- Response Output --> | |
| <section class="panel response-panel"> | |
| <h2>Response</h2> | |
| <div id="response-output" class="output" role="region" aria-live="polite"> | |
| <p>Your AI-crafted response will appear here.</p> | |
| </div> | |
| </section> | |
| <!-- Context Output --> | |
| <section class="panel context-panel"> | |
| <h2>Context</h2> | |
| <div id="context-output" class="output" role="region" aria-live="polite"> | |
| <p>Retrieved insights will be displayed here.</p> | |
| </div> | |
| </section> | |
| <!-- Settings Sidebar --> | |
| <aside class="panel settings-panel"> | |
| <h2>Controls</h2> | |
| <div class="settings"> | |
| <div class="control"> | |
| <label for="model-select">Model</label> | |
| <select id="model-select" aria-label="Select AI model"> | |
| <option value="gemini-2.0-flash">Gemini 2.0 Flash</option> | |
| <option value="neurarag-core">NeuraRAG Core</option> | |
| </select> | |
| </div> | |
| <div class="control"> | |
| <label for="top-k">Top-K</label> | |
| <input type="number" id="top-k" value="5" min="1" max="20" aria-label="Top-K retrieval"> | |
| </div> | |
| <div class="control"> | |
| <label for="temperature">Temperature</label> | |
| <input type="number" id="temperature" value="0.7" step="0.1" min="0" max="1" aria-label="Temperature"> | |
| </div> | |
| <div class="control"> | |
| <label for="context-length">Context Length</label> | |
| <input type="number" id="context-length" value="512" min="128" max="2048" aria-label="Context length"> | |
| </div> | |
| <button id="apply-settings" class="btn btn-action">Update</button> | |
| </div> | |
| </aside> | |
| </main> | |
| <!-- Footer --> | |
| <footer class="footer"> | |
| <p>© 2025 NeuraRAG. Built with xAI.</p> | |
| </footer> | |
| </div> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> |