Hugging Face's logo

Spaces:
TheAryanAvatar
/
testing
Running

App Files Community
TheAryanAvatar commited on
Commit
342d639
·
verified ·
1 Parent(s): 66f73ad

none of it is functional - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +152 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Testing
3
- emoji: 🐢
4
- colorFrom: indigo
5
- colorTo: pink
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: testing
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: red
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,152 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Circle - Be a part of my Circle</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .spinner {
11
+ animation: spin 1.5s linear infinite;
12
+ }
13
+ @keyframes spin {
14
+ 0% { transform: rotate(0deg); }
15
+ 100% { transform: rotate(360deg); }
16
+ }
17
+ .progress-bar {
18
+ animation: progress 5s linear forwards;
19
+ }
20
+ @keyframes progress {
21
+ 0% { width: 0%; }
22
+ 100% { width: 100%; }
23
+ }
24
+ .captcha-box {
25
+ background: repeating-linear-gradient(
26
+ 45deg,
27
+ #f0f0f0,
28
+ #f0f0f0 10px,
29
+ #e0e0e0 10px,
30
+ #e0e0e0 20px
31
+ );
32
+ }
33
+ </style>
34
+ </head>
35
+ <body class="bg-gray-50 min-h-screen flex flex-col items-center justify-center p-4">
36
+ <div class="max-w-md w-full bg-white rounded-xl shadow-lg overflow-hidden">
37
+ <!-- Header -->
38
+ <div class="bg-gradient-to-r from-purple-600 to-pink-500 px-6 py-4 flex items-center">
39
+ <div class="flex-shrink-0">
40
+ <i class="fas fa-circle-nodes text-white text-2xl"></i>
41
+ </div>
42
+ <div class="ml-3">
43
+ <h1 class="text-white font-semibold text-lg">Circle Creator Platform</h1>
44
+ <p class="text-purple-100 text-sm">Be a part of my Circle</p>
45
+ </div>
46
+ </div>
47
+
48
+ <!-- Content -->
49
+ <div class="p-6">
50
+ <div class="text-center mb-8">
51
+ <h2 class="text-3xl font-bold text-gray-800 mb-2">Welcome to Circle</h2>
52
+ <p class="text-gray-600">The creator-first platform with only 2.5% fees</p>
53
+ <div class="mt-6">
54
+ <button id="mainButton" class="bg-gradient-to-r from-purple-500 to-pink-500 text-white font-medium py-2 px-6 rounded-full hover:shadow-lg transition-all duration-300 transform hover:scale-105">
55
+ Start Your Creator Journey
56
+ </button>
57
+ </div>
58
+ </div>
59
+
60
+ <div class="mb-6">
61
+ <div class="flex justify-between text-sm text-gray-500 mb-1">
62
+ <span>Checking security</span>
63
+ <span>www.patreon.com</span>
64
+ </div>
65
+ <div class="w-full bg-gray-200 rounded-full h-2">
66
+ <div id="securityBar" class="progress-bar bg-indigo-500 h-2 rounded-full" style="width: 0%"></div>
67
+ </div>
68
+ </div>
69
+
70
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
71
+ <div class="bg-white p-4 rounded-lg border border-gray-200 hover:shadow-md transition-all">
72
+ <div class="text-purple-500 mb-2">
73
+ <i class="fas fa-video text-xl"></i>
74
+ </div>
75
+ <h3 class="font-medium mb-1">4K Video Hosting</h3>
76
+ <p class="text-sm text-gray-500">Native video hosting with no compression</p>
77
+ </div>
78
+ <div class="bg-white p-4 rounded-lg border border-gray-200 hover:shadow-md transition-all">
79
+ <div class="text-pink-500 mb-2">
80
+ <i class="fas fa-robot text-xl"></i>
81
+ </div>
82
+ <h3 class="font-medium mb-1">AI Tools</h3>
83
+ <p class="text-sm text-gray-500">Auto-transcription, tagging & scheduling</p>
84
+ </div>
85
+ <div class="bg-white p-4 rounded-lg border border-gray-200 hover:shadow-md transition-all">
86
+ <div class="text-blue-500 mb-2">
87
+ <i class="fas fa-store text-xl"></i>
88
+ </div>
89
+ <h3 class="font-medium mb-1">Merch Store</h3>
90
+ <p class="text-sm text-gray-500">Integrated merch with Printful</p>
91
+ </div>
92
+ </div>
93
+
94
+
95
+ <div class="text-center text-sm text-gray-500">
96
+ <p>Join thousands of creators earning on Circle with our industry-low 2.5% fee.</p>
97
+ <p class="mt-2">
98
+ <a href="#" class="text-purple-600 hover:underline">Learn more</a> about our platform features.
99
+ </p>
100
+ </div>
101
+ </div>
102
+ </div>
103
+
104
+ <script>
105
+ document.addEventListener('DOMContentLoaded', function() {
106
+ // Animate security bar
107
+ const securityBar = document.getElementById('securityBar');
108
+ let width = 0;
109
+ const interval = setInterval(() => {
110
+ if (width >= 100) {
111
+ clearInterval(interval);
112
+ securityBar.classList.remove('bg-indigo-500');
113
+ securityBar.classList.add('bg-green-500');
114
+ } else {
115
+ width++;
116
+ securityBar.style.width = width + '%';
117
+ }
118
+ }, 50);
119
+
120
+ const mainButton = document.getElementById('mainButton');
121
+
122
+ mainButton.addEventListener('click', function() {
123
+ // Show loading state
124
+ mainButton.innerHTML = '<i class="fas fa-spinner spinner mr-2"></i> Processing...';
125
+ mainButton.classList.add('cursor-not-allowed');
126
+ mainButton.disabled = true;
127
+
128
+ // Simulate API call
129
+ setTimeout(() => {
130
+ // Show success state
131
+ mainButton.innerHTML = '<i class="fas fa-check-circle mr-2"></i> Account Created!';
132
+ mainButton.classList.remove('bg-gradient-to-r', 'from-purple-500', 'to-pink-500');
133
+ mainButton.classList.add('bg-green-500');
134
+
135
+ // Redirect after delay
136
+ setTimeout(() => {
137
+ window.location.href = "#"; // Replace with actual dashboard URL
138
+ }, 1500);
139
+ }, 2000);
140
+ });
141
+
142
+ // Make feature cards interactive
143
+ const featureCards = document.querySelectorAll('.grid > div');
144
+ featureCards.forEach(card => {
145
+ card.addEventListener('click', () => {
146
+ alert(`Feature: ${card.querySelector('h3').textContent}\n${card.querySelector('p').textContent}`);
147
+ });
148
+ });
149
+ });
150
+ </script>
151
+ <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=TheAryanAvatar/testing" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
152
+ </html>