Hugging Face's logo

Spaces:
PeepDaSlan9
/
HYDRAS_Dreamify-Image-Generator-Model
Running

App Files Community
1
predator commited on
Commit
acfc9b2
·
verified ·
1 Parent(s): 6dcbce9

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +18 -42
index.html CHANGED
@@ -57,38 +57,19 @@
57
  /* Loading animation styles */
58
  .loader {
59
  display: flex;
60
- justify-content: space-around;
61
- width: 100px;
62
- }
63
-
64
- .loader div {
65
- width: 20px;
66
- height: 20px;
67
- background-color: #764bd1; /* Blue color */
68
  border-radius: 50%;
69
- animation: loader-animation 1.2s infinite ease-in-out;
70
- }
71
-
72
- .loader div:nth-child(1) {
73
- animation-delay: -0.24s;
74
- }
75
-
76
- .loader div:nth-child(2) {
77
- animation-delay: -0.12s;
78
- }
79
-
80
- .loader div:nth-child(3) {
81
- animation-delay: 0s;
82
  }
83
 
84
- @keyframes loader-animation {
85
- 0%, 80%, 100% {
86
- transform: scale(0);
87
- }
88
-
89
- 40% {
90
- transform: scale(1);
91
- }
92
  }
93
 
94
  /* Footer styles */
@@ -128,7 +109,7 @@
128
  .footer-links a {
129
  color: #333;
130
  text-decoration: none;
131
- font-size: 13px;
132
  }
133
 
134
  .footer-links a:hover {
@@ -137,7 +118,7 @@
137
 
138
  .footer-feedback {
139
  margin-bottom: 10px;
140
- font-size: 13px;
141
  }
142
 
143
  .footer-feedback a {
@@ -178,11 +159,7 @@
178
  <body>
179
  <!-- Loader container -->
180
  <div id="loaderContainer" class="loader-container">
181
- <div id="loader" class="loader">
182
- <div></div>
183
- <div></div>
184
- <div></div>
185
- </div>
186
  </div>
187
 
188
  <!-- Content and Iframe container -->
@@ -192,7 +169,6 @@
192
  </iframe>
193
  </div>
194
  </div>
195
- <br>
196
 
197
  <!-- Footer -->
198
  <footer id="footer">
@@ -200,13 +176,13 @@
200
  <ul class="footer-links">
201
  <li><a href="https://catmrf-privacy-policy-demo.static.hf.space">Privacy</a></li>
202
  <li><a href="https://catmrf-content-policy-demo.static.hf.space">Content Policy</a></li>
203
- <li><a href="https://huggingface.co/groqcin">More Ai Tools</a></li>
204
  </ul>
205
  <div class="footer-feedback">
206
  <a href="https://huggingface.co/predatortoabuse">Feedback</a>
207
  </div>
208
  <div class="footer-copyright">
209
- &copy; 2024 Groqcin Technologies Inc.
210
  </div>
211
  </div>
212
  </footer>
@@ -216,14 +192,14 @@
216
 
217
  <script>
218
  // JavaScript to handle loading animation and show iframe, footer, and button
219
- window.addEventListener('load', function() {
220
  var loaderContainer = document.getElementById('loaderContainer');
221
  var iframeContainer = document.getElementById('iframeContainer');
222
  var footer = document.getElementById('footer');
223
  var discordButton = document.getElementById('discordButton');
224
 
225
  // Show loading animation for 5 seconds
226
- setTimeout(function() {
227
  loaderContainer.style.display = 'none'; // Hide loader container
228
  iframeContainer.style.display = 'block'; // Show iframe
229
  footer.style.display = 'block'; // Show footer
@@ -233,7 +209,7 @@
233
  });
234
 
235
  // Optional: Add a click event to the Discord button to navigate to your Discord link
236
- document.getElementById('discordButton').addEventListener('click', function() {
237
  window.location.href = 'https://discord.com/invite/cHqsKzz2'; // Replace with your actual Discord invite link
238
  });
239
  </script>
 
57
  /* Loading animation styles */
58
  .loader {
59
  display: flex;
60
+ justify-content: center;
61
+ align-items: center;
62
+ width: 50px;
63
+ height: 50px;
64
+ border: 6px solid #f3f3f3; /* Light grey */
65
+ border-top: 6px solid #3498db; /* Blue */
 
 
66
  border-radius: 50%;
67
+ animation: spin 1s linear infinite;
 
 
 
 
 
 
 
 
 
 
 
 
68
  }
69
 
70
+ @keyframes spin {
71
+ 0% { transform: rotate(0deg); }
72
+ 100% { transform: rotate(360deg); }
 
 
 
 
 
73
  }
74
 
75
  /* Footer styles */
 
109
  .footer-links a {
110
  color: #333;
111
  text-decoration: none;
112
+ font-size: 14px;
113
  }
114
 
115
  .footer-links a:hover {
 
118
 
119
  .footer-feedback {
120
  margin-bottom: 10px;
121
+ font-size: 14px;
122
  }
123
 
124
  .footer-feedback a {
 
159
  <body>
160
  <!-- Loader container -->
161
  <div id="loaderContainer" class="loader-container">
162
+ <div id="loader" class="loader"></div>
 
 
 
 
163
  </div>
164
 
165
  <!-- Content and Iframe container -->
 
169
  </iframe>
170
  </div>
171
  </div>
 
172
 
173
  <!-- Footer -->
174
  <footer id="footer">
 
176
  <ul class="footer-links">
177
  <li><a href="https://catmrf-privacy-policy-demo.static.hf.space">Privacy</a></li>
178
  <li><a href="https://catmrf-content-policy-demo.static.hf.space">Content Policy</a></li>
179
+ <li><a href="https://huggingface.co/groqcin">All Ai Tools</a></li>
180
  </ul>
181
  <div class="footer-feedback">
182
  <a href="https://huggingface.co/predatortoabuse">Feedback</a>
183
  </div>
184
  <div class="footer-copyright">
185
+ &copy; 2024 Your Company
186
  </div>
187
  </div>
188
  </footer>
 
192
 
193
  <script>
194
  // JavaScript to handle loading animation and show iframe, footer, and button
195
+ window.addEventListener('load', function () {
196
  var loaderContainer = document.getElementById('loaderContainer');
197
  var iframeContainer = document.getElementById('iframeContainer');
198
  var footer = document.getElementById('footer');
199
  var discordButton = document.getElementById('discordButton');
200
 
201
  // Show loading animation for 5 seconds
202
+ setTimeout(function () {
203
  loaderContainer.style.display = 'none'; // Hide loader container
204
  iframeContainer.style.display = 'block'; // Show iframe
205
  footer.style.display = 'block'; // Show footer
 
209
  });
210
 
211
  // Optional: Add a click event to the Discord button to navigate to your Discord link
212
+ document.getElementById('discordButton').addEventListener('click', function () {
213
  window.location.href = 'https://discord.com/invite/cHqsKzz2'; // Replace with your actual Discord invite link
214
  });
215
  </script>