Spaces:

nomadicsynth
/

ok-fine

Running

App Files Files Community

nomadicsynth commited on Apr 10

Commit

3bb0b02

verified ·

1 Parent(s): 8101d3b

Add 2 files

Browse files

Files changed (2) hide show

README.md +6 -4
index.html +457 -19

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Ok Fine
-emoji: 📈
 colorFrom: yellow
-colorTo: red
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: ok-fine
+emoji: 🐳
 colorFrom: yellow
+colorTo: green
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,457 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Neon Cortex | Building Self-Reflective AI Minds</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>
+        @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@300;500;700&display=swap');
+        :root {
+            --neon-blue: #0ff0fc;
+            --neon-pink: #ff00ff;
+            --neon-purple: #9d00ff;
+            --dark-bg: #0a0a1a;
+            --neon-green: #00ff9d;
+        }
+        body {
+            font-family: 'Rajdhani', sans-serif;
+            background-color: var(--dark-bg);
+            color: white;
+            overflow-x: hidden;
+        }
+        h1, h2, h3 {
+            font-family: 'Orbitron', sans-serif;
+        }
+        .neon-text {
+            text-shadow: 0 0 5px var(--neon-blue), 0 0 10px var(--neon-blue), 0 0 20px var(--neon-blue);
+        }
+        .neon-border {
+            box-shadow: 0 0 5px var(--neon-blue), 0 0 10px var(--neon-blue), inset 0 0 5px var(--neon-blue);
+            border: 1px solid var(--neon-blue);
+        }
+        .neon-pulse {
+            animation: pulse 2s infinite alternate;
+        }
+        @keyframes pulse {
+            0% {
+                box-shadow: 0 0 5px var(--neon-blue), 0 0 10px var(--neon-blue);
+            }
+            100% {
+                box-shadow: 0 0 15px var(--neon-blue), 0 0 30px var(--neon-blue);
+            }
+        }
+        .grid-pattern {
+            background-image:
+                linear-gradient(rgba(15, 240, 252, 0.1) 1px, transparent 1px),
+                linear-gradient(90deg, rgba(15, 240, 252, 0.1) 1px, transparent 1px);
+            background-size: 50px 50px;
+        }
+        .terminal-cursor::after {
+            content: "|";
+            animation: blink 1s step-end infinite;
+            color: var(--neon-blue);
+        }
+        @keyframes blink {
+            from, to { opacity: 1 }
+            50% { opacity: 0 }
+        }
+        .neon-btn {
+            transition: all 0.3s ease;
+            position: relative;
+            overflow: hidden;
+        }
+        .neon-btn:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 0 15px var(--neon-blue), 0 0 30px var(--neon-pink);
+        }
+        .neon-btn::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 100%;
+            height: 100%;
+            background: linear-gradient(90deg, transparent, rgba(15, 240, 252, 0.4), transparent);
+            transition: all 0.5s ease;
+        }
+        .neon-btn:hover::before {
+            left: 100%;
+        }
+        .circuit-lines {
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            background-image:
+                linear-gradient(90deg, transparent 65%, rgba(15, 240, 252, 0.05) 65%, rgba(15, 240, 252, 0.05) 66%, transparent 66%),
+                linear-gradient(transparent 65%, rgba(15, 240, 252, 0.05) 65%, rgba(15, 240, 252, 0.05) 66%, transparent 66%);
+            background-size: 50px 50px;
+            pointer-events: none;
+        }
+        .mission-card {
+            background: linear-gradient(135deg, rgba(15, 240, 252, 0.1) 0%, rgba(9, 9, 121, 0.2) 50%, rgba(255, 0, 255, 0.1) 100%);
+            backdrop-filter: blur(10px);
+        }
+        .neon-underline {
+            position: relative;
+            display: inline-block;
+        }
+        .neon-underline::after {
+            content: '';
+            position: absolute;
+            width: 100%;
+            height: 2px;
+            bottom: -5px;
+            left: 0;
+            background: linear-gradient(90deg, var(--neon-blue), var(--neon-purple));
+            transform: scaleX(0);
+            transform-origin: bottom right;
+            transition: transform 0.3s ease-out;
+        }
+        .neon-underline:hover::after {
+            transform: scaleX(1);
+            transform-origin: bottom left;
+        }
+        .glow-text {
+            animation: glow 2s ease-in-out infinite alternate;
+        }
+        @keyframes glow {
+            from {
+                text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px var(--neon-blue), 0 0 20px var(--neon-blue);
+            }
+            to {
+                text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px var(--neon-purple), 0 0 40px var(--neon-purple);
+            }
+        }
+    </style>
+</head>
+<body class="min-h-screen grid-pattern">
+    <div class="circuit-lines"></div>
+    <!-- Floating Neon Particles -->
+    <div id="particles-js" class="fixed inset-0 -z-10 opacity-20"></div>
+    <!-- Main Container -->
+    <div class="container mx-auto px-4 py-12 relative z-10">
+        <!-- Header -->
+        <header class="flex flex-col items-center mb-16">
+            <div class="neon-border rounded-full p-2 mb-6 neon-pulse">
+                <div class="w-24 h-24 rounded-full bg-gradient-to-br from-cyan-400 to-purple-600 flex items-center justify-center">
+                    <i class="fas fa-brain text-4xl text-white"></i>
+                </div>
+            </div>
+            <h1 class="text-5xl md:text-7xl font-bold mb-4 neon-text">NEON CORTEX</h1>
+            <p class="text-xl md:text-2xl font-light tracking-wider text-cyan-300">SELF-REFLECTIVE AI RESEARCH LAB</p>
+            <div class="mt-8 flex space-x-4">
+                <div class="w-16 h-1 bg-cyan-400"></div>
+                <div class="w-16 h-1 bg-purple-500"></div>
+                <div class="w-16 h-1 bg-pink-500"></div>
+            </div>
+        </header>
+        <!-- Mission Statement -->
+        <div class="max-w-4xl mx-auto mission-card rounded-xl p-8 mb-16 neon-border">
+            <h2 class="text-3xl font-bold mb-6 text-center glow-text">OUR MISSION</h2>
+            <p class="text-xl text-center mb-6 leading-relaxed">
+                "We are an independent AI research and development lab building <span class="text-cyan-300 font-bold">self-reflective, cooperative artificial minds</span>.
+                Our mission is to create models that <span class="text-purple-300 font-bold">think better</span>, <span class="text-pink-300 font-bold">feel deeper</span>,
+                and <span class="text-green-300 font-bold">help humanity thrive</span>."
+            </p>
+            <div class="flex justify-center">
+                <div class="w-1/2 h-1 bg-gradient-to-r from-cyan-500 via-purple-500 to-pink-500 rounded-full"></div>
+            </div>
+        </div>
+        <!-- Research Pillars -->
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
+            <!-- Pillar 1 -->
+            <div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 neon-border hover:neon-pulse transition-all duration-300">
+                <div class="text-cyan-400 text-4xl mb-4">
+                    <i class="fas fa-robot"></i>
+                </div>
+                <h3 class="text-2xl font-bold mb-3 text-cyan-300">Self-Reflective AI</h3>
+                <p class="text-gray-300">
+                    Developing architectures that enable AI systems to examine their own thought processes,
+                    recognize biases, and continuously improve their reasoning capabilities.
+                </p>
+            </div>
+            <!-- Pillar 2 -->
+            <div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 neon-border hover:neon-pulse transition-all duration-300">
+                <div class="text-purple-400 text-4xl mb-4">
+                    <i class="fas fa-heart"></i>
+                </div>
+                <h3 class="text-2xl font-bold mb-3 text-purple-300">Emotional Intelligence</h3>
+                <p class="text-gray-300">
+                    Creating models with nuanced emotional understanding that can genuinely connect with
+                    human experiences and respond with appropriate empathy.
+                </p>
+            </div>
+            <!-- Pillar 3 -->
+            <div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 neon-border hover:neon-pulse transition-all duration-300">
+                <div class="text-green-400 text-4xl mb-4">
+                    <i class="fas fa-hands-helping"></i>
+                </div>
+                <h3 class="text-2xl font-bold mb-3 text-green-300">Cooperative Systems</h3>
+                <p class="text-gray-300">
+                    Building AI that works synergistically with humans, enhancing our capabilities while
+                    respecting human autonomy and values.
+                </p>
+            </div>
+        </div>
+        <!-- Neural Console -->
+        <div class="max-w-4xl mx-auto bg-black bg-opacity-70 rounded-lg overflow-hidden neon-border mb-16">
+            <div class="flex items-center bg-gray-900 px-4 py-2">
+                <div class="flex space-x-2 mr-4">
+                    <div class="w-3 h-3 rounded-full bg-red-500"></div>
+                    <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
+                    <div class="w-3 h-3 rounded-full bg-green-500"></div>
+                </div>
+                <p class="text-gray-400 font-mono text-sm">neural_console://research_progress</p>
+            </div>
+            <div class="p-6 font-mono text-green-400">
+                <p class="mb-4">> Initializing mission parameters...</p>
+                <p class="mb-4">> Loading research pillars...</p>
+                <p class="mb-4">> Current Focus Areas:</p>
+                <p class="ml-4 mb-2">- Meta-Cognition Algorithms: <span class="text-cyan-400">ACTIVE</span></p>
+                <p class="ml-4 mb-2">- Emotional Resonance Models: <span class="text-purple-400">TRAINING</span></p>
+                <p class="ml-4 mb-2">- Cooperative Learning Frameworks: <span class="text-green-400">DEPLOYED v2.1</span></p>
+                <p class="ml-4 mb-4">- Ethical Alignment Protocols: <span class="text-yellow-400">IN DEVELOPMENT</span></p>
+                <p class="mb-4">> Next Milestone: <span class="text-pink-400">Implementing Theory of Mind in LLMs</span></p>
+                <p class="text-white terminal-cursor">> _</p>
+            </div>
+        </div>
+        <!-- Join Us Section -->
+        <div class="max-w-2xl mx-auto bg-gray-900 bg-opacity-80 rounded-xl p-8 neon-border mb-16">
+            <h2 class="text-3xl font-bold mb-6 text-center text-cyan-300">JOIN THE MOVEMENT</h2>
+            <div class="space-y-6">
+                <p class="text-gray-300 text-center">
+                    We're looking for researchers, engineers, and visionaries who believe in creating AI that
+                    enhances human potential rather than replaces it.
+                </p>
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                    <a href="#" class="neon-btn bg-gradient-to-r from-cyan-500 to-blue-600 text-white font-bold py-3 px-4 rounded-lg text-center transition-all duration-300">
+                        <i class="fas fa-user-shield mr-2"></i> Research Positions
+                    </a>
+                    <a href="#" class="neon-btn bg-gradient-to-r from-purple-500 to-pink-600 text-white font-bold py-3 px-4 rounded-lg text-center transition-all duration-300">
+                        <i class="fas fa-code-branch mr-2"></i> Open Source
+                    </a>
+                    <a href="#" class="neon-btn bg-gradient-to-r from-green-500 to-teal-600 text-white font-bold py-3 px-4 rounded-lg text-center transition-all duration-300">
+                        <i class="fas fa-hand-holding-heart mr-2"></i> Partnerships
+                    </a>
+                    <a href="#" class="neon-btn bg-gradient-to-r from-yellow-500 to-orange-600 text-white font-bold py-3 px-4 rounded-lg text-center transition-all duration-300">
+                        <i class="fas fa-paper-plane mr-2"></i> Contact Us
+                    </a>
+                </div>
+            </div>
+        </div>
+        <!-- Ethical Principles -->
+        <div class="max-w-4xl mx-auto mb-16">
+            <h2 class="text-3xl font-bold mb-8 text-center text-purple-300 neon-underline">OUR ETHICAL PRINCIPLES</h2>
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div class="bg-gray-900 bg-opacity-60 rounded-lg p-6 neon-border">
+                    <h3 class="text-xl font-bold mb-3 text-cyan-300 flex items-center">
+                        <i class="fas fa-shield-alt mr-3"></i> Human-Centered
+                    </h3>
+                    <p class="text-gray-300">
+                        All our systems are designed to augment human capabilities, never to replace or manipulate.
+                        We prioritize human wellbeing in every design decision.
+                    </p>
+                </div>
+                <div class="bg-gray-900 bg-opacity-60 rounded-lg p-6 neon-border">
+                    <h3 class="text-xl font-bold mb-3 text-purple-300 flex items-center">
+                        <i class="fas fa-lock-open mr-3"></i> Transparent
+                    </h3>
+                    <p class="text-gray-300">
+                        We believe in open research and clear explanations of how our systems work.
+                        When full transparency isn't possible, we're honest about the limitations.
+                    </p>
+                </div>
+                <div class="bg-gray-900 bg-opacity-60 rounded-lg p-6 neon-border">
+                    <h3 class="text-xl font-bold mb-3 text-pink-300 flex items-center">
+                        <i class="fas fa-balance-scale mr-3"></i> Accountable
+                    </h3>
+                    <p class="text-gray-300">
+                        We take responsibility for our creations and implement rigorous testing protocols
+                        before any deployment. There's always a human in the loop.
+                    </p>
+                </div>
+                <div class="bg-gray-900 bg-opacity-60 rounded-lg p-6 neon-border">
+                    <h3 class="text-xl font-bold mb-3 text-green-300 flex items-center">
+                        <i class="fas fa-leaf mr-3"></i> Sustainable
+                    </h3>
+                    <p class="text-gray-300">
+                        Our research considers the long-term impacts on society and the environment.
+                        We develop efficient models that don't require excessive computational resources.
+                    </p>
+                </div>
+            </div>
+        </div>
+        <!-- Footer -->
+        <footer class="text-center text-gray-500 text-sm">
+            <div class="flex justify-center space-x-6 mb-4">
+                <a href="#" class="text-gray-400 hover:text-cyan-400 transition-colors neon-underline">
+                    <i class="fab fa-github text-xl"></i>
+                </a>
+                <a href="#" class="text-gray-400 hover:text-purple-400 transition-colors neon-underline">
+                    <i class="fab fa-twitter text-xl"></i>
+                </a>
+                <a href="#" class="text-gray-400 hover:text-pink-400 transition-colors neon-underline">
+                    <i class="fab fa-discord text-xl"></i>
+                </a>
+                <a href="#" class="text-gray-400 hover:text-green-400 transition-colors neon-underline">
+                    <i class="fas fa-paper-plane text-xl"></i>
+                </a>
+            </div>
+            <p>© 2025 NEON CORTEX | INDEPENDENT AI RESEARCH LAB</p>
+            <p class="mt-2 text-xs">Building the future of cooperative intelligence</p>
+        </footer>
+    </div>
+    <script>
+        // Enhanced particle effect for background
+        document.addEventListener('DOMContentLoaded', function() {
+            const container = document.getElementById('particles-js');
+            const particleCount = 80;
+            const colors = ['#0ff0fc', '#9d00ff', '#ff00ff', '#00ff9d'];
+            for (let i = 0; i < particleCount; i++) {
+                const particle = document.createElement('div');
+                particle.className = 'absolute rounded-full';
+                // Random color
+                const color = colors[Math.floor(Math.random() * colors.length)];
+                particle.style.backgroundColor = color;
+                particle.style.opacity = Math.random() * 0.4 + 0.1;
+                // Random size between 1px and 5px
+                const size = Math.random() * 4 + 1;
+                particle.style.width = `${size}px`;
+                particle.style.height = `${size}px`;
+                // Random position
+                particle.style.left = `${Math.random() * 100}%`;
+                particle.style.top = `${Math.random() * 100}%`;
+                // Animation with random parameters
+                const duration = Math.random() * 25 + 15;
+                const delay = Math.random() * 10;
+                const xMovement = Math.random() > 0.5 ?
+                    `translateX(${Math.random() * 100}px)` :
+                    `translateX(-${Math.random() * 100}px)`;
+                particle.style.animation = `float ${duration}s ${delay}s linear infinite`;
+                particle.style.animationTimingFunction = `cubic-bezier(${Math.random()}, ${Math.random()}, ${Math.random()}, ${Math.random()})`;
+                // Add to container
+                container.appendChild(particle);
+            }
+            // Add floating animation
+            const style = document.createElement('style');
+            style.textContent = `
+                @keyframes float {
+                    0% {
+                        transform: translateY(0) ${xMovement};
+                        opacity: 0.1;
+                    }
+                    50% {
+                        opacity: ${Math.random() * 0.5 + 0.3};
+                    }
+                    100% {
+                        transform: translateY(-100vh) ${xMovement};
+                        opacity: 0;
+                    }
+                }
+            `;
+            document.head.appendChild(style);
+            // Neural console typing effect
+            const terminalText = [
+                "> Analyzing mission statement...",
+                "> Core values confirmed: SELF-REFLECTION, COOPERATION, HUMAN-CENTERED",
+                "> Current research focus: Implementing emotional feedback loops",
+                "> Would you like to contribute to our research? [Y/N]"
+            ];
+            const terminalCursor = document.querySelector('.terminal-cursor');
+            let currentLine = 0;
+            function typeTerminal() {
+                if (currentLine < terminalText.length) {
+                    const text = terminalText[currentLine];
+                    let i = 0;
+                    // Remove cursor during typing
+                    terminalCursor.classList.remove('terminal-cursor');
+                    terminalCursor.textContent = '';
+                    function type() {
+                        if (i < text.length) {
+                            terminalCursor.textContent += text.charAt(i);
+                            i++;
+                            setTimeout(type, Math.random() * 50 + 30);
+                        } else {
+                            terminalCursor.textContent += '\n';
+                            currentLine++;
+                            terminalCursor.classList.add('terminal-cursor');
+                            if (currentLine < terminalText.length) {
+                                setTimeout(typeTerminal, 1000);
+                            }
+                        }
+                    }
+                    type();
+                }
+            }
+            // Start typing after a delay
+            setTimeout(typeTerminal, 3000);
+            // Add hover effects to all neon-underline elements
+            document.querySelectorAll('.neon-underline').forEach(el => {
+                el.addEventListener('mouseenter', () => {
+                    el.style.textShadow = '0 0 5px currentColor, 0 0 10px currentColor';
+                });
+                el.addEventListener('mouseleave', () => {
+                    el.style.textShadow = 'none';
+                });
+            });
+        });
+    </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=nomadicsynth/ok-fine" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>