Update index.html

This commit is contained in:
Saifeddine ALOUI
2025-01-24 14:02:12 +01:00
committed by GitHub
parent a20d065285
commit 49a039765c

View File

@@ -7,19 +7,30 @@
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
</head> </head>
<body class="bg-gray-100 min-h-screen flex flex-col items-center justify-center p-4"> <body class="bg-gray-100 min-h-screen flex flex-col items-center justify-center p-4">
<div class="w-full max-w-4xl bg-white shadow-md rounded-lg p-6"> <div class="w-full max-w-4xl bg-white shadow-md rounded-lg p-6 relative">
<h1 class="text-2xl font-bold text-gray-800 mb-4">RAG WebUI</h1> <!-- Settings Button -->
<button id="settingsButton" class="absolute top-4 right-4 text-gray-600 hover:text-gray-800">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c1.104 0 2-.896 2-2s-.896-2-2-2-2 .896-2 2 .896 2 2 2zm0 4c-1.104 0-2 .896-2 2s.896 2 2 2 2-.896 2-2-.896-2-2-2zm0 8c-1.104 0-2 .896-2 2s.896 2 2 2 2-.896 2-2-.896-2-2-2z" />
</svg>
</button>
<!-- Bearer Key Section --> <!-- Modal for Bearer Key -->
<div class="mb-6"> <div id="settingsModal" class="hidden fixed inset-0 bg-gray-800 bg-opacity-50 flex items-center justify-center">
<h2 class="text-lg font-semibold text-gray-700 mb-2">Bearer Key</h2> <div class="bg-white rounded-lg shadow-lg p-6 w-full max-w-md">
<h2 class="text-lg font-semibold text-gray-700 mb-4">Settings</h2>
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<input type="text" id="bearerKeyInput" class="w-full p-2 border rounded focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter Bearer Key"> <input type="text" id="bearerKeyInput" class="w-full p-2 border rounded focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter Bearer Key">
<button id="saveBearerKey" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Save Key</button> <button id="saveBearerKey" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Save Key</button>
<div id="bearerKeyStatus" class="text-sm text-gray-600"></div> <button id="closeSettings" class="text-gray-500 hover:text-gray-700 text-sm">Close</button>
</div>
<div id="bearerKeyStatus" class="mt-2 text-sm text-gray-600"></div>
</div> </div>
</div> </div>
<!-- Main Content -->
<h1 class="text-2xl font-bold text-gray-800 mb-4">RAG WebUI</h1>
<!-- File Upload Section --> <!-- File Upload Section -->
<div class="mb-6"> <div class="mb-6">
<h2 class="text-lg font-semibold text-gray-700 mb-2">Upload Files</h2> <h2 class="text-lg font-semibold text-gray-700 mb-2">Upload Files</h2>
@@ -42,6 +53,19 @@
</div> </div>
<script> <script>
// Modal Handling
const settingsButton = document.getElementById('settingsButton');
const settingsModal = document.getElementById('settingsModal');
const closeSettings = document.getElementById('closeSettings');
settingsButton.addEventListener('click', () => {
settingsModal.classList.remove('hidden');
});
closeSettings.addEventListener('click', () => {
settingsModal.classList.add('hidden');
});
// Bearer Key Handling // Bearer Key Handling
const bearerKeyInput = document.getElementById('bearerKeyInput'); const bearerKeyInput = document.getElementById('bearerKeyInput');
const saveBearerKey = document.getElementById('saveBearerKey'); const saveBearerKey = document.getElementById('saveBearerKey');