Hugging Face's logo

Spaces:
timoon811
/
teststories
Running

App Files Community
teststories
File size: 5,932 Bytes
54ff763
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
 
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Traffic Master - Что я получу от курса?</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js"></script>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@800&display=swap');
        
        body {
            margin: 0;
            padding: 0;
            width: 100vw;
            height: 100vh;
            overflow: hidden;
            font-family: 'Montserrat', sans-serif;
            background-color: #000;
        }
        
        .dollar-bg {
            position: absolute;
            color: rgba(255, 255, 255, 0.05);
            font-size: 24px;
            animation: float 15s linear infinite;
            z-index: 0;
        }
        
        @keyframes float {
            0% {
                transform: translateY(0) translateX(0);
            }
            50% {
                transform: translateY(100vh) translateX(50vw);
            }
            100% {
                transform: translateY(0) translateX(100vw);
            }
        }
        
        .logo-text {
            text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
        }
        
        .traffic {
            color: #f6fc79;
        }
        
        .master {
            color: #E1E1E1;
        }
        
        .benefit-item {
            opacity: 0;
            transform: translateX(-50px);
        }
        
        .highlight {
            color: #f6fc79;
        }
    </style>
</head>
<body>
    <div id="dollar-container"></div>
    
    <div class="w-full h-full flex flex-col items-center justify-center px-8 relative z-10">
        <div class="text-center mb-12">
            <h1 class="text-6xl md:text-7xl font-bold logo-text">
                <span class="traffic">TRAFFIC</span> <span class="master">MASTER</span>
            </h1>
        </div>
        
        <div class="text-center mb-8">
            <h2 class="text-3xl md:text-4xl font-bold text-white mb-2">Вопрос:</h2>
            <p class="text-2xl md:text-3xl text-white">Что я получу от курса?</p>
        </div>
        
        <div class="max-w-lg mx-auto space-y-6">
            <div class="benefit-item bg-black bg-opacity-70 rounded-xl p-6 border border-gray-800">
                <p class="text-xl md:text-2xl text-white">
                    <span class="highlight">💥 Рабочую систему арбитража</span>
                </p>
            </div>
            
            <div class="benefit-item bg-black bg-opacity-70 rounded-xl p-6 border border-gray-800">
                <p class="text-xl md:text-2xl text-white">
                    <span class="highlight">📈 Готовые связки, креативы, прокладки</span>
                </p>
            </div>
            
            <div class="benefit-item bg-black bg-opacity-70 rounded-xl p-6 border border-gray-800">
                <p class="text-xl md:text-2xl text-white">
                    <span class="highlight">💬 Поддержку и доступ в закрытый чат</span>
                </p>
            </div>
            
            <div class="benefit-item bg-black bg-opacity-70 rounded-xl p-6 border border-gray-800">
                <p class="text-xl md:text-2xl text-white">
                    <span class="highlight">💰 Выход на реальные выплаты в процессе курса</span>
                </p>
            </div>
        </div>
    </div>

    <script>
        // Создаем фон из долларов
        function createDollarBackground() {
            const container = document.getElementById('dollar-container');
            const dollarCount = 30;
            
            for (let i = 0; i < dollarCount; i++) {
                const dollar = document.createElement('div');
                dollar.className = 'dollar-bg';
                dollar.textContent = '$';
                dollar.style.left = `${Math.random() * 100}%`;
                dollar.style.top = `${Math.random() * 100}%`;
                dollar.style.animationDuration = `${15 + Math.random() * 20}s`;
                dollar.style.animationDelay = `${Math.random() * 5}s`;
                container.appendChild(dollar);
            }
        }
        
        // Анимация появления пунктов
        function animateBenefits() {
            const benefits = document.querySelectorAll('.benefit-item');
            
            benefits.forEach((item, index) => {
                gsap.to(item, {
                    opacity: 1,
                    x: 0,
                    duration: 0.8,
                    delay: index * 0.3,
                    ease: "back.out(1.2)"
                });
            });
        }
        
        // Инициализация
        document.addEventListener('DOMContentLoaded', () => {
            createDollarBackground();
            setTimeout(animateBenefits, 1000);
        });
    </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/teststories" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>