Spaces:

AZURA1234
/

neocorp-org

Running

App Files Files Community

AZURA1234 commited on Jul 10

Commit

aed1bb7

verified ·

1 Parent(s): d9c18e4

Crie uma landing page teaser visualmente futurista e impactante para divulgar o NeoOS, um sistema operacional revolucionário desenvolvido pela NeoCorp. O lançamento está previsto para 03 de agosto de 2026. A página deve criar hype, curiosidade e antecipação, como se fosse uma tecnologia de ponta prestes a ser revelada ao mundo. 🎨 Estilo visual: Interface escura (dark mode total) Azul neon, roxo e detalhes em glitch digital Animações sutis de partículas, códigos piscando, ou mapa de circuitos Estética hacker/sci-fi/minimalista > 📄 Conteúdo da página: 1. Hero Section: Frase de impacto como: "O próximo sistema está chegando..." "Em breve, o código será reiniciado." Fundo animado ou com shader tipo grid 3D Efeito digitando: > data de ativação: 03/08/2026 2. Contagem Regressiva (timer até o lançamento) 3. Descrição breve: “NeoOS é um sistema operacional leve, seguro, independente e totalmente inovador. Nenhum GRUB. Nenhum sistema legado. Apenas a próxima era.” 4. Formulário de inscrição (newsletter): "Receba acesso antecipado" 5. Rodapé misterioso: Links para redes sociais da NeoCorp (só ícones) Texto pequeno: "NeoCorp © 2026. Todos os direitos reservados." > 🛠️ Tecnologias sugeridas: TailwindCSS, Vite, GSAP para animações Particles.js ou Vanta.js no fundo Fontes tipo Orbitron ou JetBrains Mono para visual tech --- 👁️‍🗨️ Frases extras pro visual: system boot sequence pending... preparing the kernel of tomorrow... transmitting final prototype... NeoOS: powered by code, not compromise. - Initial Deployment

Browse files

Files changed (2) hide show

README.md +7 -5
index.html +352 -19

README.md CHANGED Viewed

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

 ---
+title: neocorp-org
+emoji: 🐳
+colorFrom: green
+colorTo: blue
 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,352 @@
-<!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>NeoOS - The Future of Operating Systems</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>
+    <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=JetBrains+Mono:wght@300;400&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        body {
+            font-family: 'JetBrains Mono', monospace;
+            background-color: #0a0a15;
+            color: #e0e0e0;
+            overflow-x: hidden;
+        }
+        .tech-font {
+            font-family: 'Orbitron', sans-serif;
+        }
+        .hero-gradient {
+            background: linear-gradient(135deg, rgba(11,0,36,0.9) 0%, rgba(46,0,99,0.8) 50%, rgba(80,0,156,0.7) 100%);
+        }
+        .glow {
+            text-shadow: 0 0 10px rgba(100, 65, 255, 0.8), 0 0 20px rgba(100, 65, 255, 0.6);
+        }
+        .glow-box {
+            box-shadow: 0 0 15px rgba(100, 65, 255, 0.6);
+        }
+        .circuit-pattern {
+            background-image:
+                linear-gradient(to right, rgba(100, 65, 255, 0.1) 1px, transparent 1px),
+                linear-gradient(to bottom, rgba(100, 65, 255, 0.1) 1px, transparent 1px);
+            background-size: 30px 30px;
+        }
+        .input-glow:focus {
+            box-shadow: 0 0 10px rgba(100, 65, 255, 0.6);
+        }
+        @keyframes flicker {
+            0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
+                opacity: 1;
+            }
+            20%, 22%, 24%, 55% {
+                opacity: 0.5;
+            }
+        }
+        .flicker {
+            animation: flicker 3s infinite ease-in-out;
+        }
+        .typing-cursor {
+            animation: blink 1s infinite;
+        }
+        @keyframes blink {
+            0%, 100% { opacity: 1; }
+            50% { opacity: 0; }
+        }
+        .code-block {
+            position: relative;
+            overflow: hidden;
+        }
+        .code-block::after {
+            content: "";
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background: linear-gradient(transparent 50%, rgba(100, 65, 255, 0.1) 50%);
+            background-size: 100% 4px;
+            z-index: 0;
+        }
+        .neon-text {
+            color: #fff;
+            text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #6401ff, 0 0 30px #6401ff;
+        }
+        .floating {
+            animation: float 6s ease-in-out infinite;
+        }
+        @keyframes float {
+            0% { transform: translateY(0px); }
+            50% { transform: translateY(-15px); }
+            100% { transform: translateY(0px); }
+        }
+    </style>
+</head>
+<body class="circuit-pattern">
+    <div class="min-h-screen flex flex-col">
+        <!-- Hero Section -->
+        <header class="hero-gradient relative overflow-hidden pt-20 pb-32 px-4 sm:px-6 lg:px-8">
+            <div class="absolute inset-0 opacity-10">
+                <div class="absolute inset-0 bg-black"></div>
+                <div class="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MCIgaGVpZ2h0PSI1MCIgdmlld0JveD0iMCAwIDUwIDUwIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0icmdiYSgxMDAsIDY1LCAyNTUsIDAuMSkiIHN0cm9rZS13aWR0aD0iMSI+PHBhdGggZD0iTTI0IDFINTBWMjZIMjRWMjZIMFYwSDI0VjFaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIHJvdGF0ZSg0NSAyNSA1MCkiLz48L2c+PC9zdmc+')] repeat"></div>
+            </div>
+            <div class="max-w-7xl mx-auto relative z-10 text-center">
+                <div class="mb-6 inline-block px-4 py-2 border border-purple-500 rounded-full">
+                    <p class="text-xs sm:text-sm font-mono text-purple-300 tracking-widest">SYSTEM BOOT SEQUENCE PENDING...</p>
+                </div>
+                <h1 class="tech-font text-4xl sm:text-6xl md:text-7xl lg:text-8xl font-bold mb-6 glow">
+                    <span class="block">THE NEXT SYSTEM</span>
+                    <span class="block neon-text floating">IS COMING</span>
+                </h1>
+                <div class="max-w-3xl mx-auto">
+                    <p class="text-lg sm:text-xl md:text-2xl mb-8 text-purple-200">
+                        NeoOS: powered by code, not compromise. No legacy systems. No unnecessary bulk. Just pure performance.
+                    </p>
+                    <div class="inline-block px-6 py-3 glow-box bg-black/50 border border-purple-500/50 rounded-lg backdrop-blur-sm">
+                        <p class="font-mono text-sm md:text-base">
+                            <span class="text-purple-400">> activation date:</span>
+                            <span id="typing" class="text-white"></span>
+                            <span class="typing-cursor">|</span>
+                        </p>
+                    </div>
+                </div>
+            </div>
+            <!-- Floating tech elements -->
+            <div class="hidden lg:block absolute top-20 left-10 w-16 h-16 bg-purple-500/10 rounded-full filter blur-xl"></div>
+            <div class="hidden lg:block absolute bottom-1/3 right-20 w-24 h-24 bg-blue-500/10 rounded-full filter blur-xl"></div>
+            <div class="hidden lg:block absolute bottom-20 left+1/4 w-20 h-20 bg-indigo-500/10 rounded-full filter blur-xl"></div>
+        </header>
+        <!-- Countdown Section -->
+        <section class="py-16 px-4 sm:px-6 lg:px-8">
+            <div class="max-w-7xl mx-auto">
+                <div class="text-center mb-12">
+                    <h2 class="tech-font text-2xl sm:text-3xl md:text-4xl mb-4 glow">
+                        TRANSMITTING FINAL PROTOTYPE IN...
+                    </h2>
+                    <p class="text-sm sm:text-base text-purple-200 mb-2">PREPARING THE KERNEL OF TOMORROW</p>
+                </div>
+                <div class="max-w-4xl mx-auto">
+                    <div class="grid grid-cols-4 gap-4 sm:gap-8">
+                        <div class="text-center">
+                            <div class="code-block bg-black/50 border border-purple-500/30 rounded-lg p-4 sm:p-6 mb-2">
+                                <span id="days" class="tech-font text-3xl sm:text-4xl md:text-5xl font-bold text-purple-400">00</span>
+                            </div>
+                            <span class="text-xs sm:text-sm font-mono text-purple-300">DAYS</span>
+                        </div>
+                        <div class="text-center">
+                            <div class="code-block bg-black/50 border border-purple-500/30 rounded-lg p-4 sm:p-6 mb-2">
+                                <span id="hours" class="tech-font text-3xl sm:text-4xl md:text-5xl font-bold text-blue-400">00</span>
+                            </div>
+                            <span class="text-xs sm:text-sm font-mono text-blue-300">HOURS</span>
+                        </div>
+                        <div class="text-center">
+                            <div class="code-block bg-black/50 border border-purple-500/30 rounded-lg p-4 sm:p-6 mb-2">
+                                <span id="minutes" class="tech-font text-3xl sm:text-4xl md:text-5xl font-bold text-indigo-400">00</span>
+                            </div>
+                            <span class="text-xs sm:text-sm font-mono text-indigo-300">MINUTES</span>
+                        </div>
+                        <div class="text-center">
+                            <div class="code-block bg-black/50 border border-purple-500/30 rounded-lg p-4 sm:p-6 mb-2">
+                                <span id="seconds" class="tech-font text-3xl sm:text-4xl md:text-5xl font-bold text-pink-400">00</span>
+                            </div>
+                            <span class="text-xs sm:text-sm font-mono text-pink-300">SECONDS</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <!-- Description Section -->
+        <section class="py-16 px-4 sm:px-6 lg:px-8 bg-black/20 backdrop-blur-sm">
+            <div class="max-w-7xl mx-auto">
+                <div class="flex flex-col lg:flex-row gap-12 items-center">
+                    <div class="lg:w-1/2">
+                        <div class="p-8 sm:p-10 code-block border border-purple-700/50 rounded-xl bg-gradient-to-br from-black/60 to-purple-900/10 relative overflow-hidden">
+                            <div class="absolute -inset-1 bg-gradient-to-tr from-purple-600/20 to-blue-600/20 rounded-xl blur opacity-60"></div>
+                            <div class="relative z-10">
+                                <h3 class="tech-font text-xl sm:text-2xl md:text-3xl mb-6 text-white glow">
+                                    NEOOS ARCHITECTURE
+                                </h3>
+                                <ul class="space-y-4 text-sm sm:text-base">
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>Lightweight modular kernel design</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>Quantum-resistant encryption protocols</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>AI-optimized resource allocation</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>No legacy code or backward compatibility tax</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>Blockchain-based update verification</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <span class="text-purple-400 mr-3 mt-1">❯</span>
+                                        <span>98% less system overhead than traditional OS</span>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="lg:w-1/2">
+                        <h3 class="tech-font text-2xl sm:text-3xl md:text-4xl mb-6 glow">
+                            BEYOND LEGACY SYSTEMS
+                        </h3>
+                        <div class="space-y-4 text-sm sm:text-base text-gray-300">
+                            <p>
+                                NeoOS is not an evolution - it's a revolution in operating system design. Built from atomic components with zero legacy baggage, it delivers what modern computing deserves: pure performance without compromise.
+                            </p>
+                            <p class="text-purple-200 border-l-4 border-purple-500 pl-4 py-2">
+                                "No GRUB. No init systems from the 1980s. Just the next era of computing."
+                            </p>
+                            <p>
+                                The system you've been waiting for without knowing you needed it. A clean slate for the next generation of software.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <!-- Signup Section -->
+        <section class="py-16 px-4 sm:px-6 lg:px-8 relative overflow-hidden">
+            <div class="absolute inset-0 -z-10 opacity-20">
+                <div class="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MCA1MCI+PHBhdGggZD0iTTI1IDFhMjQgMjQgMCAxIDAgMCA0OCAyNCAyNCAwIDAgMCAwLTQ4eiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJyZ2JhKDEwMCwgNjUsIDI1NSwgMC4wNSkiIHN0cm9rZS13aWR0aD0iMSIvPjwvc3ZnPg==')]"></div>
+            </div>
+            <div class="max-w-4xl mx-auto text-center">
+                <div class="inline-block px-4 py-1 bg-purple-900/30 border border-purple-700 rounded-full mb-6">
+                    <p class="text-xs sm:text-sm font-mono text-purple-300">RECEIVE EARLY ACCESS</p>
+                </div>
+                <h3 class="tech-font text-2xl sm:text-3xl md:text-4xl mb-6 glow">
+                    JOIN THE NEXUS
+                </h3>
+                <p class="text-sm sm:text-base text-gray-300 max-w-2xl mx-auto mb-8">
+                    Be among the first to experience NeoOS. Subscribe for exclusive access to beta testing, developer documentation, and launch updates.
+                </p>
+                <form class="max-w-md mx-auto">
+                    <div class="flex flex-col sm:flex-row gap-4">
+                        <input type="email" placeholder="your@email.com" required
+                            class="flex-grow px-4 py-3 bg-black/50 border border-purple-500/50 rounded-lg focus:outline-none focus:border-purple-400 input-glow text-sm sm:text-base placeholder-purple-300/50">
+                        <button type="submit"
+                            class="px-6 py-3 bg-gradient-to-r from-purple-600 to-blue-600 hover:from-purple-700 hover:to-blue-700 rounded-lg font-medium text-white glow-box transition-all duration-300 text-sm sm:text-base">
+                            REGISTER INTEREST
+                        </button>
+                    </div>
+                    <p class="text-xs text-purple-300 mt-3 italic">100% private. No spam. Early access list only.</p>
+                </form>
+            </div>
+        </section>
+        <!-- Footer -->
+        <footer class="mt-auto py-8 px-4 sm:px-6 lg:px-8 border-t border-purple-900/30">
+            <div class="max-w-7xl mx-auto">
+                <div class="flex flex-col md:flex-row justify-between items-center">
+                    <div class="mb-4 md:mb-0">
+                        <p class="text-xs sm:text-sm font-mono text-purple-300">NEOOS™ | A NEO CORP SYSTEM | VERSION 0.9.7α</p>
+                    </div>
+                    <div class="flex items-center space-x-6">
+                        <a href="#" class="text-purple-300 hover:text-purple-100 transition-colors duration-300">
+                            <i class="fab fa-twitter text-lg"></i>
+                        </a>
+                        <a href="#" class="text-purple-300 hover:text-purple-100 transition-colors duration-300">
+                            <i class="fab fa-github text-lg"></i>
+                        </a>
+                        <a href="#" class="text-purple-300 hover:text-purple-100 transition-colors duration-300">
+                            <i class="fab fa-discord text-lg"></i>
+                        </a>
+                        <a href="#" class="text-purple-300 hover:text-purple-100 transition-colors duration-300">
+                            <i class="fab fa-medium text-lg"></i>
+                        </a>
+                    </div>
+                    <div class="mt-4 md:mt-0">
+                        <p class="text-xs text-purple-400 font-mono">NEO CORP © 2026. ALL SYSTEMS SECURED.</p>
+                    </div>
+                </div>
+                <div class="mt-8 pt-8 border-t border-purple-900/20 text-center">
+                    <p class="text-xs font-mono text-purple-900 flicker">SYSTEM STATUS: ENCRYPTED // PREPARING FOR GLOBAL SYNCHRONIZATION</p>
+                </div>
+            </div>
+        </footer>
+    </div>
+    <script>
+        // Typing effect for activation date
+        const typed = new Typed('#typing', {
+            strings: ['03/08/2026'],
+            typeSpeed: 50,
+            backSpeed: 0,
+            showCursor: false,
+        });
+        // Countdown timer
+        function updateCountdown() {
+            const launchDate = new Date('August 3, 2026 00:00:00').getTime();
+            const now = new Date().getTime();
+            const distance = launchDate - now;
+            const days = Math.floor(distance / (1000 * 60 * 60 * 24));
+            const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+            const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
+            const seconds = Math.floor((distance % (1000 * 60)) / 1000);
+            document.getElementById('days').textContent = days.toString().padStart(2, '0');
+            document.getElementById('hours').textContent = hours.toString().padStart(2, '0');
+            document.getElementById('minutes').textContent = minutes.toString().padStart(2, '0');
+            document.getElementById('seconds').textContent = seconds.toString().padStart(2, '0');
+            // Add animation class to seconds for extra effect
+            const secondsElement = document.getElementById('seconds');
+            secondsElement.classList.add('animate-pulse');
+            setTimeout(() => secondsElement.classList.remove('animate-pulse'), 500);
+        }
+        // Update every second
+        updateCountdown();
+        setInterval(updateCountdown, 1000);
+        // Add glitch effect to hero text on hover
+        const heroText = document.querySelector('.neon-text');
+        heroText.addEventListener('mouseover', function() {
+            this.classList.add('animate-pulse');
+        });
+        heroText.addEventListener('mouseout', function() {
+            this.classList.remove('animate-pulse');
+        });
+        // Random code elements effect
+        const codeElements = document.querySelectorAll('.code-block');
+        codeElements.forEach(element => {
+            element.addEventListener('mouseover', function() {
+                this.style.boxShadow = '0 0 20px rgba(100, 65, 255, 0.8)';
+                setTimeout(() => {
+                    this.style.boxShadow = '0 0 15px rgba(100, 65, 255, 0.6)';
+                }, 300);
+            });
+        });
+    </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=AZURA1234/neocorp-org" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>