| | <!DOCTYPE html> |
| | <html lang="en"> |
| | <head> |
| | <meta charset="UTF-8"> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | <title>Microsoft GraphRAG Dashboard</title> |
| | <script src="https://cdn.tailwindcss.com"></script> |
| | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| | <style> |
| | @keyframes pulse { |
| | 0%, 100% { opacity: 1; } |
| | 50% { opacity: 0.5; } |
| | } |
| | .animate-pulse { |
| | animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; |
| | } |
| | .graph-container { |
| | background-image: radial-gradient(circle at 1px 1px, #e5e7eb 1px, transparent 0); |
| | background-size: 20px 20px; |
| | } |
| | .sidebar { |
| | scrollbar-width: thin; |
| | scrollbar-color: #3b82f6 #f1f1f1; |
| | } |
| | .sidebar::-webkit-scrollbar { |
| | width: 6px; |
| | } |
| | .sidebar::-webkit-scrollbar-track { |
| | background: #f1f1f1; |
| | } |
| | .sidebar::-webkit-scrollbar-thumb { |
| | background-color: #3b82f6; |
| | border-radius: 3px; |
| | } |
| | .result-card { |
| | transition: all 0.3s ease; |
| | } |
| | .result-card:hover { |
| | transform: translateY(-2px); |
| | box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); |
| | } |
| | </style> |
| | </head> |
| | <body class="bg-gray-50 font-sans"> |
| | <div class="flex h-screen overflow-hidden"> |
| | |
| | <div class="sidebar w-64 bg-white border-r border-gray-200 flex flex-col overflow-y-auto"> |
| | <div class="p-4 border-b border-gray-200"> |
| | <div class="flex items-center space-x-2"> |
| | <i class="fab fa-microsoft text-blue-600 text-2xl"></i> |
| | <h1 class="text-xl font-semibold text-gray-800">GraphRAG</h1> |
| | </div> |
| | </div> |
| | <div class="p-4"> |
| | <div class="mb-6"> |
| | <h2 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">Navigation</h2> |
| | <ul> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-blue-600 bg-blue-50 rounded-lg"> |
| | <i class="fas fa-home mr-3"></i> |
| | Dashboard |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-project-diagram mr-3"></i> |
| | Knowledge Graphs |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-database mr-3"></i> |
| | Data Sources |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-chart-line mr-3"></i> |
| | Analytics |
| | </a> |
| | </li> |
| | </ul> |
| | </div> |
| | <div class="mb-6"> |
| | <h2 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">Recent Queries</h2> |
| | <ul> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-search mr-3 text-gray-400"></i> |
| | Customer segmentation... |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-search mr-3 text-gray-400"></i> |
| | Product recommendations... |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-search mr-3 text-gray-400"></i> |
| | Sales forecast Q3... |
| | </a> |
| | </li> |
| | </ul> |
| | </div> |
| | <div> |
| | <h2 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">Settings</h2> |
| | <ul> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-cog mr-3"></i> |
| | Configuration |
| | </a> |
| | </li> |
| | <li class="mb-1"> |
| | <a href="#" class="flex items-center px-3 py-2 text-sm font-medium text-gray-600 hover:bg-gray-100 rounded-lg"> |
| | <i class="fas fa-user mr-3"></i> |
| | Account |
| | </a> |
| | </li> |
| | </ul> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="flex-1 flex flex-col overflow-hidden"> |
| | |
| | <header class="bg-white border-b border-gray-200"> |
| | <div class="flex items-center justify-between px-6 py-4"> |
| | <div class="flex items-center"> |
| | <h2 class="text-lg font-semibold text-gray-800">GraphRAG Explorer</h2> |
| | </div> |
| | <div class="flex items-center space-x-4"> |
| | <div class="relative"> |
| | <input type="text" placeholder="Search..." class="pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500 w-64"> |
| | <i class="fas fa-search absolute left-3 top-3 text-gray-400"></i> |
| | </div> |
| | <button class="p-2 text-gray-500 hover:text-gray-700"> |
| | <i class="fas fa-bell"></i> |
| | </button> |
| | <div class="flex items-center space-x-2"> |
| | <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-medium">JD</div> |
| | <span class="text-sm font-medium">John Doe</span> |
| | </div> |
| | </div> |
| | </div> |
| | </header> |
| |
|
| | |
| | <main class="flex-1 overflow-y-auto p-6 bg-gray-50"> |
| | <div class="mb-6"> |
| | <div class="bg-white p-6 rounded-xl shadow-sm"> |
| | <h3 class="text-lg font-semibold text-gray-800 mb-4">GraphRAG Query Interface</h3> |
| | <div class="flex space-x-4 mb-4"> |
| | <div class="flex-1"> |
| | <label for="query" class="block text-sm font-medium text-gray-700 mb-1">Enter your question</label> |
| | <textarea id="query" rows="3" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500" placeholder="Ask anything about your connected data..."></textarea> |
| | </div> |
| | <div class="w-48"> |
| | <label for="data-source" class="block text-sm font-medium text-gray-700 mb-1">Data Source</label> |
| | <select id="data-source" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500"> |
| | <option>All Sources</option> |
| | <option>Sales Data</option> |
| | <option>Customer Feedback</option> |
| | <option>Product Catalog</option> |
| | <option>Market Research</option> |
| | </select> |
| | </div> |
| | </div> |
| | <div class="flex justify-between items-center"> |
| | <div class="flex space-x-2"> |
| | <button class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500"> |
| | <i class="fas fa-paper-plane mr-2"></i> Submit Query |
| | </button> |
| | <button class="px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"> |
| | <i class="fas fa-history mr-2"></i> History |
| | </button> |
| | </div> |
| | <div class="flex items-center space-x-2"> |
| | <span class="text-sm text-gray-500">Advanced</span> |
| | <label class="relative inline-flex items-center cursor-pointer"> |
| | <input type="checkbox" value="" class="sr-only peer"> |
| | <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600"></div> |
| | </label> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6"> |
| | |
| | <div class="bg-white p-6 rounded-xl shadow-sm"> |
| | <div class="flex justify-between items-center mb-4"> |
| | <h3 class="text-lg font-semibold text-gray-800">Knowledge Graph</h3> |
| | <span class="px-2 py-1 bg-green-100 text-green-800 text-xs font-medium rounded-full">Active</span> |
| | </div> |
| | <div class="graph-container h-48 rounded-lg bg-gray-50 mb-4 flex items-center justify-center"> |
| | <div class="text-center"> |
| | <i class="fas fa-project-diagram text-gray-300 text-5xl mb-2"></i> |
| | <p class="text-gray-500 text-sm">Visual representation of connected data</p> |
| | </div> |
| | </div> |
| | <div class="grid grid-cols-3 gap-2 text-center"> |
| | <div class="p-2"> |
| | <div class="text-2xl font-bold text-blue-600">1,248</div> |
| | <div class="text-xs text-gray-500">Entities</div> |
| | </div> |
| | <div class="p-2"> |
| | <div class="text-2xl font-bold text-blue-600">3,572</div> |
| | <div class="text-xs text-gray-500">Relationships</div> |
| | </div> |
| | <div class="p-2"> |
| | <div class="text-2xl font-bold text-blue-600">87%</div> |
| | <div class="text-xs text-gray-500">Confidence</div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="bg-white p-6 rounded-xl shadow-sm"> |
| | <div class="flex justify-between items-center mb-4"> |
| | <h3 class="text-lg font-semibold text-gray-800">Connected Data Sources</h3> |
| | <button class="text-blue-600 text-sm font-medium">Manage</button> |
| | </div> |
| | <div class="space-y-3"> |
| | <div class="flex items-center p-3 border border-gray-200 rounded-lg"> |
| | <div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center mr-3"> |
| | <i class="fas fa-database text-blue-600"></i> |
| | </div> |
| | <div class="flex-1"> |
| | <h4 class="text-sm font-medium text-gray-800">Azure SQL Database</h4> |
| | <p class="text-xs text-gray-500">Last synced 2 hours ago</p> |
| | </div> |
| | <div class="w-2 h-2 rounded-full bg-green-500"></div> |
| | </div> |
| | <div class="flex items-center p-3 border border-gray-200 rounded-lg"> |
| | <div class="w-10 h-10 rounded-full bg-purple-100 flex items-center justify-center mr-3"> |
| | <i class="fab fa-microsoft text-purple-600"></i> |
| | </div> |
| | <div class="flex-1"> |
| | <h4 class="text-sm font-medium text-gray-800">SharePoint</h4> |
| | <p class="text-xs text-gray-500">Last synced 1 day ago</p> |
| | </div> |
| | <div class="w-2 h-2 rounded-full bg-green-500"></div> |
| | </div> |
| | <div class="flex items-center p-3 border border-gray-200 rounded-lg"> |
| | <div class="w-10 h-10 rounded-full bg-green-100 flex items-center justify-center mr-3"> |
| | <i class="fas fa-file-excel text-green-600"></i> |
| | </div> |
| | <div class="flex-1"> |
| | <h4 class="text-sm font-medium text-gray-800">Excel Files</h4> |
| | <p class="text-xs text-gray-500">Last synced 3 days ago</p> |
| | </div> |
| | <div class="w-2 h-2 rounded-full bg-yellow-500"></div> |
| | </div> |
| | </div> |
| | <button class="w-full mt-4 py-2 border border-dashed border-gray-300 rounded-lg text-gray-500 hover:bg-gray-50"> |
| | <i class="fas fa-plus mr-2"></i> Add Data Source |
| | </button> |
| | </div> |
| |
|
| | |
| | <div class="bg-white p-6 rounded-xl shadow-sm"> |
| | <div class="flex justify-between items-center mb-4"> |
| | <h3 class="text-lg font-semibold text-gray-800">Recent Queries</h3> |
| | <button class="text-blue-600 text-sm font-medium">View All</button> |
| | </div> |
| | <div class="space-y-3"> |
| | <div class="p-3 border border-gray-200 rounded-lg"> |
| | <div class="flex justify-between items-start mb-1"> |
| | <h4 class="text-sm font-medium text-gray-800 truncate">What were our top selling products last quarter?</h4> |
| | <span class="text-xs text-gray-500">2h ago</span> |
| | </div> |
| | <p class="text-xs text-gray-500 mb-2">Generated 12 insights from Sales Data</p> |
| | <div class="flex space-x-2"> |
| | <span class="px-2 py-1 bg-blue-100 text-blue-800 text-xs rounded-full">Sales</span> |
| | <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">Products</span> |
| | </div> |
| | </div> |
| | <div class="p-3 border border-gray-200 rounded-lg"> |
| | <div class="flex justify-between items-start mb-1"> |
| | <h4 class="text-sm font-medium text-gray-800 truncate">Show customer complaints by region</h4> |
| | <span class="text-xs text-gray-500">1d ago</span> |
| | </div> |
| | <p class="text-xs text-gray-500 mb-2">Generated 8 insights from Customer Feedback</p> |
| | <div class="flex space-x-2"> |
| | <span class="px-2 py-1 bg-purple-100 text-purple-800 text-xs rounded-full">Customers</span> |
| | <span class="px-2 py-1 bg-yellow-100 text-yellow-800 text-xs rounded-full">Regions</span> |
| | </div> |
| | </div> |
| | <div class="p-3 border border-gray-200 rounded-lg"> |
| | <div class="flex justify-between items-start mb-1"> |
| | <h4 class="text-sm font-medium text-gray-800 truncate">Compare Q2 and Q3 revenue growth</h4> |
| | <span class="text-xs text-gray-500">2d ago</span> |
| | </div> |
| | <p class="text-xs text-gray-500 mb-2">Generated 5 insights from Financial Data</p> |
| | <div class="flex space-x-2"> |
| | <span class="px-2 py-1 bg-red-100 text-red-800 text-xs rounded-full">Finance</span> |
| | <span class="px-2 py-1 bg-indigo-100 text-indigo-800 text-xs rounded-full">Comparison</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="bg-white p-6 rounded-xl shadow-sm"> |
| | <div class="flex justify-between items-center mb-6"> |
| | <h3 class="text-lg font-semibold text-gray-800">Query Results</h3> |
| | <div class="flex space-x-2"> |
| | <button class="px-3 py-1 border border-gray-300 rounded-lg text-sm hover:bg-gray-50"> |
| | <i class="fas fa-download mr-1"></i> Export |
| | </button> |
| | <button class="px-3 py-1 border border-gray-300 rounded-lg text-sm hover:bg-gray-50"> |
| | <i class="fas fa-filter mr-1"></i> Filter |
| | </button> |
| | </div> |
| | </div> |
| | |
| | <div class="space-y-4"> |
| | |
| | <div class="result-card p-4 border border-gray-200 rounded-lg hover:border-blue-200"> |
| | <div class="flex items-start"> |
| | <div class="flex-shrink-0 mt-1"> |
| | <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center"> |
| | <i class="fas fa-chart-bar text-blue-600"></i> |
| | </div> |
| | </div> |
| | <div class="ml-3 flex-1"> |
| | <div class="flex justify-between items-start"> |
| | <h4 class="text-base font-medium text-gray-800">Sales Performance Analysis</h4> |
| | <span class="text-xs px-2 py-1 bg-green-100 text-green-800 rounded-full">High Confidence</span> |
| | </div> |
| | <p class="text-sm text-gray-600 mt-1">Based on the connected sales data from Q3 2023, the top performing product was the Azure AI Suite with a 34% increase in sales compared to Q2. The Western region showed the highest growth at 42%.</p> |
| | <div class="mt-2 flex items-center text-xs text-gray-500"> |
| | <span class="mr-3">Source: Azure SQL Database</span> |
| | <span>Generated: Just now</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | |
| | <div class="result-card p-4 border border-gray-200 rounded-lg hover:border-blue-200"> |
| | <div class="flex items-start"> |
| | <div class="flex-shrink-0 mt-1"> |
| | <div class="w-8 h-8 rounded-full bg-purple-100 flex items-center justify-center"> |
| | <i class="fas fa-users text-purple-600"></i> |
| | </div> |
| | </div> |
| | <div class="ml-3 flex-1"> |
| | <div class="flex justify-between items-start"> |
| | <h4 class="text-base font-medium text-gray-800">Customer Sentiment Trends</h4> |
| | <span class="text-xs px-2 py-1 bg-yellow-100 text-yellow-800 rounded-full">Medium Confidence</span> |
| | </div> |
| | <p class="text-sm text-gray-600 mt-1">Customer feedback analysis shows a 12% improvement in satisfaction scores for the Azure platform, while concerns about documentation clarity persist (18% of negative feedback mentions this).</p> |
| | <div class="mt-2 flex items-center text-xs text-gray-500"> |
| | <span class="mr-3">Source: SharePoint Feedback</span> |
| | <span>Generated: Just now</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | |
| | <div class="result-card p-4 border border-gray-200 rounded-lg hover:border-blue-200"> |
| | <div class="flex items-start"> |
| | <div class="flex-shrink-0 mt-1"> |
| | <div class="w-8 h-8 rounded-full bg-green-100 flex items-center justify-center"> |
| | <i class="fas fa-lightbulb text-green-600"></i> |
| | </div> |
| | </div> |
| | <div class="ml-3 flex-1"> |
| | <div class="flex justify-between items-start"> |
| | <h4 class="text-base font-medium text-gray-800">Recommendation</h4> |
| | <span class="text-xs px-2 py-1 bg-blue-100 text-blue-800 rounded-full">Actionable</span> |
| | </div> |
| | <p class="text-sm text-gray-600 mt-1">Cross-analysis suggests bundling the Azure AI Suite with documentation workshops could increase adoption by 22% based on similar successful initiatives in Q1. The knowledge graph shows a strong correlation between documentation clarity and product adoption.</p> |
| | <div class="mt-2 flex items-center text-xs text-gray-500"> |
| | <span class="mr-3">Sources: Multiple</span> |
| | <span>Generated: Just now</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | <div class="mt-6 flex justify-center"> |
| | <button class="px-4 py-2 border border-gray-300 rounded-lg text-sm hover:bg-gray-50"> |
| | <i class="fas fa-ellipsis-h mr-1"></i> Load More Results |
| | </button> |
| | </div> |
| | </div> |
| | </main> |
| | </div> |
| | </div> |
| |
|
| | <script> |
| | |
| | document.addEventListener('DOMContentLoaded', function() { |
| | |
| | const advancedToggle = document.querySelector('input[type="checkbox"]'); |
| | advancedToggle.addEventListener('change', function() { |
| | const advancedOptions = document.querySelectorAll('.advanced-option'); |
| | advancedOptions.forEach(option => { |
| | option.classList.toggle('hidden'); |
| | }); |
| | }); |
| | |
| | |
| | const submitButton = document.querySelector('button:has(.fa-paper-plane)'); |
| | submitButton.addEventListener('click', function() { |
| | const queryTextarea = document.getElementById('query'); |
| | if (queryTextarea.value.trim() === '') { |
| | alert('Please enter a query before submitting'); |
| | return; |
| | } |
| | |
| | |
| | submitButton.innerHTML = '<i class="fas fa-circle-notch fa-spin mr-2"></i> Processing...'; |
| | submitButton.disabled = true; |
| | |
| | |
| | setTimeout(() => { |
| | |
| | const resultsContainer = document.querySelector('.space-y-4'); |
| | const newCard = document.createElement('div'); |
| | newCard.className = 'result-card p-4 border border-gray-200 rounded-lg hover:border-blue-200 animate-pulse'; |
| | newCard.innerHTML = ` |
| | <div class="flex items-start"> |
| | <div class="flex-shrink-0 mt-1"> |
| | <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center"> |
| | <i class="fas fa-search text-blue-600"></i> |
| | </div> |
| | </div> |
| | <div class="ml-3 flex-1"> |
| | <h4 class="text-base font-medium text-gray-800">New Result for: "${queryTextarea.value.substring(0, 30)}..."</h4> |
| | <p class="text-sm text-gray-600 mt-1">Analyzing your query across connected data sources...</p> |
| | <div class="mt-2 flex items-center text-xs text-gray-500"> |
| | <span>Processing...</span> |
| | </div> |
| | </div> |
| | </div> |
| | `; |
| | resultsContainer.prepend(newCard); |
| | |
| | |
| | resultsContainer.scrollIntoView({ behavior: 'smooth' }); |
| | |
| | |
| | setTimeout(() => { |
| | submitButton.innerHTML = '<i class="fas fa-paper-plane mr-2"></i> Submit Query'; |
| | submitButton.disabled = false; |
| | |
| | |
| | newCard.classList.remove('animate-pulse'); |
| | newCard.innerHTML = ` |
| | <div class="flex items-start"> |
| | <div class="flex-shrink-0 mt-1"> |
| | <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center"> |
| | <i class="fas fa-check-circle text-blue-600"></i> |
| | </div> |
| | </div> |
| | <div class="ml-3 flex-1"> |
| | <div class="flex justify-between items-start"> |
| | <h4 class="text-base font-medium text-gray-800">Analysis Complete</h4> |
| | <span class="text-xs px-2 py-1 bg-green-100 text-green-800 rounded-full">High Confidence</span> |
| | </div> |
| | <p class="text-sm text-gray-600 mt-1">Your query "${queryTextarea.value.substring(0, 50)}..." has been processed across all connected data sources. The knowledge graph identified 3 key insights and 2 recommendations.</p> |
| | <div class="mt-2 flex items-center text-xs text-gray-500"> |
| | <span class="mr-3">Sources: Multiple</span> |
| | <span>Generated: Just now</span> |
| | </div> |
| | </div> |
| | </div> |
| | `; |
| | }, 2000); |
| | }, 1500); |
| | }); |
| | |
| | |
| | const resultCards = document.querySelectorAll('.result-card'); |
| | resultCards.forEach(card => { |
| | card.addEventListener('mouseenter', function() { |
| | this.style.borderColor = '#93c5fd'; |
| | }); |
| | card.addEventListener('mouseleave', function() { |
| | this.style.borderColor = '#e5e7eb'; |
| | }); |
| | }); |
| | }); |
| | </script> |
| | <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=junho85/graphrag" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body> |
| | </html> |
