Add 3 files

README.md

@@ -1,10 +1,12 @@
 ---
-title: Cosmic Phone
-emoji: 🐠
-colorFrom: green
-colorTo: gray
+title: cosmic-phone
+emoji: 🐳
+colorFrom: gray
+colorTo: blue
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html

@@ -1,19 +1,199 @@
-<!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>Cosmic Conversations</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=Space+Grotesk:wght@300;400;500;600;700&display=swap');
+        
+        body {
+            font-family: 'Space Grotesk', sans-serif;
+            background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
+            min-height: 100vh;
+            color: #e2e8f0;
+        }
+        
+        .cosmic-text {
+            text-shadow: 0 0 8px rgba(147, 197, 253, 0.5);
+        }
+        
+        .star {
+            position: absolute;
+            background-color: white;
+            border-radius: 50%;
+            animation: twinkle var(--duration) infinite ease-in-out;
+        }
+        
+        @keyframes twinkle {
+            0%, 100% { opacity: 0.2; }
+            50% { opacity: 1; }
+        }
+        
+        .floating {
+            animation: float 6s ease-in-out infinite;
+        }
+        
+        @keyframes float {
+            0%, 100% { transform: translateY(0); }
+            50% { transform: translateY(-20px); }
+        }
+        
+        .phone-icon {
+            transform: rotate(15deg);
+        }
+    </style>
+</head>
+<body class="relative overflow-x-hidden">
+    <!-- Background stars -->
+    <div id="stars-container"></div>
+    
+    <div class="container mx-auto px-4 py-12 max-w-4xl relative z-10">
+        <header class="text-center mb-16">
+            <div class="inline-block bg-indigo-900/30 backdrop-blur-md rounded-full p-6 border border-indigo-400/20 floating">
+                <i class="fas fa-phone-alt phone-icon text-5xl text-indigo-300"></i>
+            </div>
+            <h1 class="text-4xl md:text-5xl font-bold mt-8 mb-4 cosmic-text text-indigo-200">Cosmic Phone</h1>
+            <p class="text-lg text-indigo-300 max-w-2xl mx-auto">Overheard conversations from the halls of Olympus</p>
+        </header>
+        
+        <main class="bg-slate-900/70 backdrop-blur-sm rounded-xl p-8 md:p-12 border border-indigo-400/20 shadow-xl shadow-indigo-900/20">
+            <div class="flex items-start mb-8">
+                <div class="bg-indigo-500 rounded-full w-12 h-12 flex items-center justify-center mr-4 flex-shrink-0">
+                    <i class="fas fa-user-astronaut text-xl"></i>
+                </div>
+                <div>
+                    <h3 class="font-semibold text-indigo-300 mb-1">The Listener</h3>
+                    <p class="italic text-slate-300">While listening on my cosmic phone I caught words from the Olympus blown.</p>
+                </div>
+            </div>
+            
+            <div class="space-y-8 pl-16">
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-amber-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-crown text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-amber-300 mb-1">Olympian Guide</h3>
+                            <p class="text-slate-200">A newcomer was shown around; That much I could guess, aided by sound.</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-blue-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-balance-scale-right text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-blue-300 mb-1">Archimedes</h3>
+                            <p class="text-slate-200">"There's Archimedes with his lever Still busy on problems as ever. Says: matter and force are transmutable And wrong the laws you thought immutable."</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-purple-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-globe-europe text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-purple-300 mb-1">Olympian Guide</h3>
+                            <p class="text-slate-200">"Below, on Earth, they work at full blast And news are coming in thick and fast. The latest tells of a cosmic gun. To be pelted is very poor fun. We are wary with so much at stake, Those beggars are a pest—no mistake."</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-green-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-apple-alt text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-green-300 mb-1">Sir Isaac Newton</h3>
+                            <p class="text-slate-200">"Too bad, Sir Isaac, they dimmed your renown And turned your great science upside down. Now a long haired crank, Einstein by name, Puts on your high teaching all the blame. Says: matter and force are transmutable And wrong the laws you thought immutable."</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-red-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-hat-wizard text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-red-300 mb-1">Newton's Reply</h3>
+                            <p class="text-slate-200">"I am much too ignorant, my son, For grasping schemes so finely spun. My followers are of stronger mind And I am content to stay behind, Perhaps I failed, but I did my best, These masters of mine may do the rest. Come, Kelvin, I have finished my cup. When is your friend Tesla coming up."</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="relative">
+                    <div class="absolute -left-4 top-0 h-full w-0.5 bg-indigo-500/30"></div>
+                    <div class="flex items-start">
+                        <div class="bg-cyan-500 rounded-full w-10 h-10 flex items-center justify-center mr-4 flex-shrink-0">
+                            <i class="fas fa-bolt text-sm"></i>
+                        </div>
+                        <div>
+                            <h3 class="font-semibold text-cyan-300 mb-1">Kelvin</h3>
+                            <p class="text-slate-200">"Oh, quoth Kelvin, he is always late, It would be useless to remonstrate."</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </main>
+        
+        <footer class="mt-16 text-center text-slate-400 text-sm">
+            <p>A celestial conversation overheard through the cosmic phone</p>
+            <div class="mt-4 flex justify-center space-x-4">
+                <a href="#" class="hover:text-indigo-300 transition"><i class="fab fa-twitter"></i></a>
+                <a href="#" class="hover:text-indigo-300 transition"><i class="fab fa-github"></i></a>
+                <a href="#" class="hover:text-indigo-300 transition"><i class="fas fa-envelope"></i></a>
+            </div>
+        </footer>
+    </div>
+    
+    <script>
+        // Create stars
+        document.addEventListener('DOMContentLoaded', function() {
+            const container = document.getElementById('stars-container');
+            const starCount = 100;
+            
+            for (let i = 0; i < starCount; i++) {
+                const star = document.createElement('div');
+                star.classList.add('star');
+                
+                // Random size between 1 and 3px
+                const size = Math.random() * 2 + 1;
+                star.style.width = `${size}px`;
+                star.style.height = `${size}px`;
+                
+                // Random position
+                star.style.left = `${Math.random() * 100}%`;
+                star.style.top = `${Math.random() * 100}%`;
+                
+                // Random animation duration
+                star.style.setProperty('--duration', `${Math.random() * 5 + 3}s`);
+                
+                container.appendChild(star);
+            }
+            
+            // Add subtle parallax effect
+            document.addEventListener('mousemove', (e) => {
+                const x = e.clientX / window.innerWidth;
+                const y = e.clientY / window.innerHeight;
+                
+                document.querySelector('main').style.transform = `translate(${x * 10 - 5}px, ${y * 10 - 5}px)`;
+            });
+        });
+    </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=dhishooooom/cosmic-phone" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt

@@ -0,0 +1 @@
+While listening on my cosmic phone I caught words from the Olympus blown. A newcomer was shown around; That much I could guess, aided by sound.  "There's Archimedes with his lever Still busy on problems as ever. Says: matter and force are transmutable And wrong the laws you thought immutable."  "Below, on Earth, they work at full blast And news are coming in thick and fast. The latest tells of a cosmic gun. To be pelted is very poor fun. We are wary with so much at stake, Those beggars are a pest—no mistake."  "Too bad, Sir Isaac, they dimmed your renown And turned your great science upside down. Now a long haired crank, Einstein by name, Puts on your high teaching all the blame. Says: matter and force are transmutable And wrong the laws you thought immutable."  "I am much too ignorant, my son, For grasping schemes so finely spun. My followers are of stronger mind And I am content to stay behind, Perhaps I failed, but I did my best, These masters of mine may do the rest. Come, Kelvin, I have finished my cup. When is your friend Tesla coming up."  "Oh, quoth Kelvin, he is always late, It would be useless to remonstrate."