CoolFace
Apppublic

Decay00/mindforge-ai-modular-brain-studio

sourceHugging Faceupdated 11mo agoView on Hugging Face
0likes
brain-map.html66 linesDownload Raw Back to root
1<!DOCTYPE html>2<html lang="en" class="h-full bg-gray-50">3<head>4    <meta charset="UTF-8">5    <meta name="viewport" content="width=device-width, initial-scale=1.0">6    <title>MindForge AI - Brain Map</title>7    <link rel="stylesheet" href="style.css">8    <script src="https://cdn.tailwindcss.com"></script>9    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>10    <script src="https://unpkg.com/feather-icons"></script>11    <script src="https://unpkg.com/vis-network/standalone/umd/vis-network.min.js"></script>12</head>13<body class="h-full">14    <custom-navbar></custom-navbar>15    <div class="lg:pl-72">16        <custom-header current-page="Brain Map"></custom-header>17        <main class="py-10">18            <div class="px-4 sm:px-6 lg:px-8">19                <div class="mb-8 flex justify-between items-center">20                    <h1 class="text-3xl font-bold text-gray-900">Interactive Brain Map</h1>21                    <a href="/" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700">22                        Back to Dashboard23                    </a>24                </div>25                26                <div id="brainMapContainer" class="h-[600px] bg-white rounded-lg shadow"></div>27                28                <div class="mt-6 grid grid-cols-1 md:grid-cols-3 gap-4">29                    <div class="bg-white p-4 rounded-lg shadow">30                        <h3 class="font-medium text-gray-900">Module Legend</h3>31                        <ul class="mt-2 space-y-2">32                            <li class="flex items-center"><span class="w-4 h-4 bg-primary-500 rounded-full mr-2"></span> Core Modules</li>33                            <li class="flex items-center"><span class="w-4 h-4 bg-secondary-500 rounded-full mr-2"></span> Support Modules</li>34                            <li class="flex items-center"><span class="w-4 h-4 bg-purple-500 rounded-full mr-2"></span> Memory System</li>35                        </ul>36                    </div>37                    38                    <div class="bg-white p-4 rounded-lg shadow">39                        <h3 class="font-medium text-gray-900">Connection Types</h3>40                        <ul class="mt-2 space-y-2">41                            <li class="flex items-center"><span class="w-8 h-0.5 bg-gray-400 mr-2"></span> Data Flow</li>42                            <li class="flex items-center"><span class="w-8 h-0.5 bg-green-500 mr-2"></span> Feedback</li>43                            <li class="flex items-center"><span class="w-8 h-0.5 bg-blue-500 mr-2 dashed"></span> Control</li>44                        </ul>45                    </div>46                    47                    <div class="bg-white p-4 rounded-lg shadow">48                        <h3 class="font-medium text-gray-900">Selected Node</h3>49                        <div id="nodeDetails" class="mt-2 text-sm text-gray-600">50                            Click on a node to view details51                        </div>52                    </div>53                </div>54            </div>55        </main>56    </div>57 58    <script src="components/navbar.js"></script>59    <script src="components/header.js"></script>60    <script src="brainMap.js"></script>61    <script src="script.js"></script>62    <script>63        feather.replace();64    </script>65</body>66</html>