Spaces:

timoon811
/

appsthema41321

Running

App Files Files Community

timoon811 commited on May 6, 2025

Commit

b81eb6a

verified ·

1 Parent(s): c75a887

Add 3 files

Browse files

Files changed (3) hide show

README.md +6 -4
index.html +346 -19
prompts.txt +2 -0

README.md CHANGED Viewed

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

 ---
+title: appsthema41321
+emoji: 🐳
 colorFrom: red
+colorTo: gray
 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,346 @@
-<!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>App Rental Services | Android · iOS · PWA</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=Inter:wght@900&family=JetBrains+Mono:wght@400;700&display=swap');
+        body {
+            font-family: 'Inter', sans-serif;
+            background-color: #000;
+            color: white;
+            overflow-x: hidden;
+        }
+        .tech-bg {
+            background:
+                radial-gradient(circle at 70% 30%, rgba(56, 182, 255, 0.1) 0%, transparent 30%),
+                radial-gradient(circle at 30% 70%, rgba(138, 43, 226, 0.1) 0%, transparent 30%),
+                linear-gradient(to bottom, rgba(0,0,0,0.9), rgba(0,0,0,1));
+            position: relative;
+        }
+        .phone-mockup {
+            perspective: 1000px;
+            transform-style: preserve-3d;
+        }
+        .phone-screen {
+            transform: rotateY(-15deg) rotateX(5deg);
+            box-shadow: 0 20px 50px rgba(56, 182, 255, 0.3);
+            border-radius: 30px;
+            overflow: hidden;
+        }
+        .app-icon {
+            transition: all 0.3s ease;
+            filter: drop-shadow(0 0 10px rgba(56, 182, 255, 0.5));
+        }
+        .app-icon:hover {
+            transform: translateY(-5px) scale(1.05);
+            filter: drop-shadow(0 0 15px rgba(138, 43, 226, 0.7));
+        }
+        .neon-text {
+            text-shadow: 0 0 10px rgba(56, 182, 255, 0.7),
+                         0 0 20px rgba(138, 43, 226, 0.5);
+        }
+        .neon-border {
+            box-shadow: 0 0 10px rgba(56, 182, 255, 0.7),
+                        0 0 20px rgba(138, 43, 226, 0.5);
+        }
+        .code-snippet {
+            font-family: 'JetBrains Mono', monospace;
+            background: rgba(20, 20, 30, 0.7);
+            border-left: 3px solid #38b6ff;
+        }
+        .floating {
+            animation: floating 6s ease-in-out infinite;
+        }
+        .floating-delay-1 {
+            animation-delay: 1s;
+        }
+        .floating-delay-2 {
+            animation-delay: 2s;
+        }
+        @keyframes floating {
+            0% { transform: translateY(0px); }
+            50% { transform: translateY(-15px); }
+            100% { transform: translateY(0px); }
+        }
+        .pulse {
+            animation: pulse 2s infinite;
+        }
+        @keyframes pulse {
+            0% { opacity: 0.7; }
+            50% { opacity: 1; }
+            100% { opacity: 0.7; }
+        }
+    </style>
+</head>
+<body class="tech-bg min-h-screen">
+    <div class="absolute inset-0 overflow-hidden opacity-30">
+        <!-- Abstract background elements -->
+        <div class="absolute top-10 left-10 w-20 h-20 rounded-full bg-purple-500 blur-3xl opacity-20"></div>
+        <div class="absolute bottom-20 right-20 w-32 h-32 rounded-full bg-cyan-500 blur-3xl opacity-20"></div>
+        <div class="absolute top-1/3 right-1/4 w-24 h-24 rounded-full bg-blue-500 blur-3xl opacity-20"></div>
+        <!-- App icons floating around -->
+        <div class="absolute top-1/4 left-1/5 floating">
+            <div class="w-12 h-12 bg-white rounded-xl flex items-center justify-center shadow-lg">
+                <i class="fab fa-android text-2xl text-green-500"></i>
+            </div>
+        </div>
+        <div class="absolute top-1/3 right-1/5 floating floating-delay-1">
+            <div class="w-12 h-12 bg-white rounded-xl flex items-center justify-center shadow-lg">
+                <i class="fab fa-apple text-2xl text-gray-800"></i>
+            </div>
+        </div>
+        <div class="absolute bottom-1/4 left-1/3 floating floating-delay-2">
+            <div class="w-12 h-12 bg-white rounded-xl flex items-center justify-center shadow-lg">
+                <i class="fas fa-globe text-2xl text-blue-500"></i>
+            </div>
+        </div>
+        <!-- Code elements floating -->
+        <div class="absolute top-1/5 right-1/3 text-xs code-snippet p-2 rounded floating">
+            <span class="text-purple-400">const</span> <span class="text-blue-400">app</span> = <span class="text-cyan-400">await</span> <span class="text-yellow-300">rentApp</span>({<br>
+            &nbsp;&nbsp;<span class="text-green-400">platform</span>: <span class="text-orange-300">'android'</span>,<br>
+            &nbsp;&nbsp;<span class="text-green-400">duration</span>: <span class="text-orange-300">'30d'</span><br>
+            });
+        </div>
+        <div class="absolute bottom-1/5 left-1/4 text-xs code-snippet p-2 rounded floating floating-delay-1">
+            <span class="text-purple-400">import</span> <span class="text-blue-400">PWA</span> <span class="text-purple-400">from</span> <span class="text-orange-300">'@arbitrage/core'</span>;<br>
+            <span class="text-cyan-400">new</span> <span class="text-yellow-300">PWA</span>().<span class="text-blue-400">install</span>();
+        </div>
+    </div>
+    <div class="container mx-auto px-4 py-16 md:py-24 relative z-10">
+        <div class="flex flex-col md:flex-row items-center">
+            <!-- Left side with text -->
+            <div class="md:w-1/2 mb-12 md:mb-0">
+                <div class="text-cyan-400 font-bold mb-2 text-lg md:text-xl">Сервисы аренды приложений</div>
+                <h1 class="text-4xl md:text-6xl font-bold mb-4 neon-text">
+                    Android · iOS · PWA
+                </h1>
+                <h2 class="text-2xl md:text-4xl font-bold mb-8 text-white">
+                    Аренда приложений для арбитража
+                </h2>
+                <div class="mb-8 max-w-md">
+                    <p class="text-gray-300 mb-4">
+                        Получите готовые приложения под ключ для вашего арбитража трафика. Быстро. Надёжно. Без разработки.
+                    </p>
+                    <div class="flex flex-wrap gap-2 mb-6">
+                        <div class="px-3 py-1 bg-gray-800 rounded-full text-xs flex items-center">
+                            <span class="w-2 h-2 bg-green-500 rounded-full mr-2"></span>
+                            .apk
+                        </div>
+                        <div class="px-3 py-1 bg-gray-800 rounded-full text-xs flex items-center">
+                            <span class="w-2 h-2 bg-gray-400 rounded-full mr-2"></span>
+                            .ipa
+                        </div>
+                        <div class="px-3 py-1 bg-gray-800 rounded-full text-xs flex items-center">
+                            <span class="w-2 h-2 bg-blue-500 rounded-full mr-2"></span>
+                            PWA
+                        </div>
+                        <div class="px-3 py-1 bg-gray-800 rounded-full text-xs flex items-center">
+                            <i class="fas fa-bolt text-yellow-400 mr-1"></i>
+                            Быстрый запуск
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- Right side with phone mockup and app showcase -->
+            <div class="md:w-1/2 flex justify-center">
+                <div class="phone-mockup relative">
+                    <div class="phone-screen w-64 h-auto bg-gray-900 border-8 border-gray-800 relative">
+                        <!-- Phone status bar -->
+                        <div class="bg-gray-800 p-2 flex justify-between items-center text-xs">
+                            <div class="text-white">9:41</div>
+                            <div class="flex space-x-1">
+                                <i class="fas fa-signal text-white"></i>
+                                <i class="fas fa-wifi text-white"></i>
+                                <i class="fas fa-battery-three-quarters text-white"></i>
+                            </div>
+                        </div>
+                        <!-- App showcase inside phone -->
+                        <div class="p-4">
+                            <div class="flex justify-between items-center mb-4">
+                                <h3 class="text-white font-bold">App Rental</h3>
+                                <div class="flex space-x-2">
+                                    <div class="w-6 h-6 bg-blue-500 rounded-full flex items-center justify-center">
+                                        <i class="fas fa-download text-white text-xs"></i>
+                                    </div>
+                                    <div class="w-6 h-6 bg-purple-500 rounded-full flex items-center justify-center">
+                                        <i class="fas fa-share-alt text-white text-xs"></i>
+                                    </div>
+                                </div>
+                            </div>
+                            <!-- App icons grid -->
+                            <div class="grid grid-cols-3 gap-4 mb-4">
+                                <div class="app-icon bg-blue-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-shopping-cart text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">E-commerce</span>
+                                </div>
+                                <div class="app-icon bg-purple-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-gamepad text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">Games</span>
+                                </div>
+                                <div class="app-icon bg-green-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-video text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">Video</span>
+                                </div>
+                                <div class="app-icon bg-yellow-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-newspaper text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">News</span>
+                                </div>
+                                <div class="app-icon bg-red-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-music text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">Music</span>
+                                </div>
+                                <div class="app-icon bg-cyan-500 rounded-xl p-3 flex flex-col items-center">
+                                    <i class="fas fa-chart-line text-white text-2xl mb-1"></i>
+                                    <span class="text-white text-xs">Analytics</span>
+                                </div>
+                            </div>
+                            <!-- App details -->
+                            <div class="bg-gray-800 rounded-lg p-3 mb-3">
+                                <div class="flex justify-between items-center mb-2">
+                                    <span class="text-white text-sm font-bold">Premium App</span>
+                                    <span class="text-green-400 text-xs">Доступно</span>
+                                </div>
+                                <div class="flex justify-between items-center text-xs text-gray-300">
+                                    <span>Android/iOS/PWA</span>
+                                    <span class="flex items-center">
+                                        <i class="fas fa-clock mr-1"></i> 30 дней
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- Floating elements around phone -->
+                    <div class="absolute -top-8 -left-8 w-16 h-16 bg-purple-500 rounded-full blur-xl opacity-30"></div>
+                    <div class="absolute -bottom-8 -right-8 w-20 h-20 bg-cyan-500 rounded-full blur-xl opacity-30"></div>
+                    <div class="absolute -top-12 right-4">
+                        <div class="w-10 h-10 bg-white rounded-lg flex items-center justify-center shadow-lg rotate-12">
+                            <i class="fab fa-android text-xl text-green-500"></i>
+                        </div>
+                    </div>
+                    <div class="absolute -bottom-12 left-4">
+                        <div class="w-10 h-10 bg-white rounded-lg flex items-center justify-center shadow-lg -rotate-12">
+                            <i class="fab fa-apple text-xl text-gray-800"></i>
+                        </div>
+                    </div>
+                    <div class="absolute top-1/4 -right-16">
+                        <div class="w-12 h-12 bg-white rounded-lg flex items-center justify-center shadow-lg">
+                            <i class="fas fa-window-restore text-xl text-blue-500"></i>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- Tech process flow -->
+        <div class="mt-24 md:mt-32 max-w-4xl mx-auto">
+            <h3 class="text-2xl md:text-3xl font-bold text-center mb-12 neon-text">Как это работает</h3>
+            <div class="relative">
+                <!-- Connection lines -->
+                <div class="hidden md:block absolute top-1/2 left-0 right-0 h-1 bg-gradient-to-r from-cyan-500 via-purple-500 to-cyan-500 opacity-30"></div>
+                <div class="grid md:grid-cols-3 gap-8 md:gap-4 relative z-10">
+                    <div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 border border-gray-800 hover:border-cyan-400 transition-all duration-300">
+                        <div class="w-16 h-16 bg-cyan-900 bg-opacity-50 rounded-full flex items-center justify-center mb-4 mx-auto neon-border">
+                            <i class="fas fa-mobile-alt text-2xl text-cyan-400"></i>
+                        </div>
+                        <h4 class="text-xl font-bold text-center mb-2">Выбираете приложение</h4>
+                        <p class="text-gray-300 text-center text-sm">
+                            Подберите готовое решение из каталога под вашу нишу арбитража
+                        </p>
+                    </div>
+                    <div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 border border-gray-800 hover:border-purple-400 transition-all duration-300">
+                        <div class="w-16 h-16 bg-purple-900 bg-opacity-50 rounded-full flex items-center justify-center mb-4 mx-auto neon-border">
+                            <i class="fas fa-handshake text-2xl text-purple-400"></i>
+                        </div>
+                        <h4 class="text-xl font-bold text-center mb-2">Оформляете аренду</h4>
+                        <p class="text-gray-300 text-center text-sm">
+                            Получаете доступ к приложению на выбранный срок без лишних сложностей
+                        </p>
+                    </div>
+                    <div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 border border-gray-800 hover:border-blue-400 transition-all duration-300">
+                        <div class="w-16 h-16 bg-blue-900 bg-opacity-50 rounded-full flex items-center justify-center mb-4 mx-auto neon-border">
+                            <i class="fas fa-rocket text-2xl text-blue-400"></i>
+                        </div>
+                        <h4 class="text-xl font-bold text-center mb-2">Запускаете арбитраж</h4>
+                        <p class="text-gray-300 text-center text-sm">
+                            Начинаете получать трафик сразу после подключения
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- Floating tech elements -->
+    <div class="hidden md:block">
+        <div class="absolute bottom-20 left-20 w-8 h-8 bg-cyan-400 rounded-full opacity-20 pulse"></div>
+        <div class="absolute top-32 right-32 w-12 h-12 bg-purple-400 rounded-full opacity-20 pulse"></div>
+        <div class="absolute bottom-40 right-40 w-6 h-6 bg-blue-400 rounded-full opacity-20 pulse"></div>
+        <div class="absolute top-1/4 left-1/4 text-xs code-snippet p-2 rounded floating">
+            <span class="text-purple-400">function</span> <span class="text-blue-400">installApp</span>() {<br>
+            &nbsp;&nbsp;<span class="text-cyan-400">return</span> <span class="text-orange-300">'success'</span>;<br>
+            }
+        </div>
+    </div>
+    <script>
+        // Simple animation for app icons in phone mockup
+        document.addEventListener('DOMContentLoaded', function() {
+            const appIcons = document.querySelectorAll('.app-icon');
+            appIcons.forEach((icon, index) => {
+                // Random delay for each icon
+                icon.style.animationDelay = `${index * 0.1}s`;
+                // Add hover effect
+                icon.addEventListener('mouseenter', () => {
+                    icon.style.transform = 'translateY(-5px) scale(1.05)';
+                });
+                icon.addEventListener('mouseleave', () => {
+                    icon.style.transform = '';
+                });
+            });
+        });
+    </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=timoon811/appsthema41321" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1,2 @@


1	+ техническое задание для сайта-обложки на тему «Сервисы аренды приложений Android / iOS / PWA»: ⸻ Тема: Сервисы аренды приложений Подзаголовок: Android · iOS · PWA Текст на обложке: Аренда приложений для арбитража ⸻ Визуальные и стилевые требования: • Фон: • Абстрактный фон с визуалами смартфонов, иконок приложений, интерфейсов App Store / Google Play • Элементы кода WebView, значки PWA, иконки установки приложения • Эффект “техно-витрины”: как будто перед зрителем — панель с множеством приложений под аренду • Цветовая гамма: • Чёрный фон • Синие, фиолетовые, бирюзовые неоновые акценты • Элементы интерфейса — белые или светлые, чтобы создать ощущение реального UI • Графика: • Иконки Android / Apple / PWA (в абстрактной форме, без нарушений брендов) • Символы аренды: замок открывается, рукопожатие, API-ключи • Элементы “install”, “open”, “package”, .apk, .ipa • Можно добавить схематичную архитектуру: Приложение → Сервер → Кликабельность • Шрифт: • Чёткий, жирный, футуристический • Надпись читаемая даже в маленьком размере (для мобильных превью) • Размещение текста: • В центре или ближе к левому краю • Справа — элементы интерфейса смартфонов, иконки ОС, визуалы арендуемых приложений ⸻ Дополнительно: • Смысл визуала: показать, что можно легко “взять под ключ” готовое приложение для арбитража — как будто выбираешь товар в маркетплейсе • Подчеркнуть автоматизацию, скорость запуска, мультилендинги через PWA ⸻
2	+ Убери кнопки! Это сайт-обложка