Hugging Face's logo

Spaces:
thetwistedpixie
/
dirtypiglet
Running

App Files Community
thetwistedpixie commited on
Commit
aa7ede5
·
verified ·
1 Parent(s): 2506a57

Dirtier

Browse files
Files changed (3) hide show
  1. index.html +15 -7
  2. script.js +10 -0
  3. style.css +19 -14
index.html CHANGED
@@ -1,3 +1,4 @@
 
1
  <!DOCTYPE html>
2
  <html>
3
  <head>
@@ -5,16 +6,23 @@
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
  <meta charset="utf-8">
7
  <script src="https://cdn.tailwindcss.com"></script>
 
8
  </head>
9
- <body class="flex justify-center items-center h-screen overflow-hidden bg-white font-sans text-center px-6">
10
- <div class="w-full">
11
- <span class="text-xs rounded-full mb-2 inline-block px-2 py-1 border border-amber-500/15 bg-amber-500/15 text-amber-500">🔥 New version dropped!</span>
12
- <h1 class="text-4xl lg:text-6xl font-bold font-sans">
13
- <span class="text-2xl lg:text-4xl text-gray-400 block font-medium">I'm ready to work,</span>
 
 
 
14
  Ask me anything.
15
  </h1>
 
 
 
16
  </div>
17
- <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
18
- <script></script>
19
  </body>
20
  </html>
 
1
+
2
  <!DOCTYPE html>
3
  <html>
4
  <head>
 
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
  <meta charset="utf-8">
8
  <script src="https://cdn.tailwindcss.com"></script>
9
+ <link rel="stylesheet" href="style.css">
10
  </head>
11
+ <body class="flex justify-center items-center h-screen overflow-hidden bg-gray-100 font-sans text-center px-6">
12
+ <div class="w-full max-w-2xl bg-white p-8 rounded-lg shadow-lg border border-gray-300">
13
+ <div class="flex justify-between items-start mb-4">
14
+ <span class="text-xs rounded-full px-3 py-1 bg-red-500 text-white font-bold">⚠️ DIRTY VERSION</span>
15
+ <span class="text-xs rounded-full px-3 py-1 bg-amber-500/15 text-amber-500 border border-amber-500/15">🔥 New version dropped!</span>
16
+ </div>
17
+ <h1 class="text-4xl lg:text-6xl font-bold font-sans mb-6">
18
+ <span class="text-2xl lg:text-4xl text-gray-500 block font-medium">I'm ready to work,</span>
19
  Ask me anything.
20
  </h1>
21
+ <div class="bg-gray-200 border-2 border-dashed border-gray-400 rounded-xl w-full h-64 flex items-center justify-center">
22
+ <p class="text-gray-500">Dirty workspace preview</p>
23
+ </div>
24
  </div>
25
+ <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
26
+ <script src="script.js"></script>
27
  </body>
28
  </html>
script.js ADDED
@@ -0,0 +1,10 @@
 
 
 
 
 
 
 
 
 
 
 
1
+ // Dirty version indicator
2
+ console.log("Dirty version loaded");
3
+
4
+ // Add any additional dirty functionality here
5
+ document.addEventListener('DOMContentLoaded', function() {
6
+ const dirtyIndicator = document.createElement('div');
7
+ dirtyIndicator.className = 'fixed top-4 right-4 bg-red-500 text-white px-3 py-1 rounded-full text-xs font-bold z-50';
8
+ dirtyIndicator.textContent = 'DIRTY BUILD';
9
+ document.body.appendChild(dirtyIndicator);
10
+ });
style.css CHANGED
@@ -1,28 +1,33 @@
 
1
  body {
2
- padding: 2rem;
3
- font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
 
4
  }
5
 
6
  h1 {
7
- font-size: 16px;
8
- margin-top: 0;
 
9
  }
10
 
11
  p {
12
- color: rgb(107, 114, 128);
13
- font-size: 15px;
14
- margin-bottom: 10px;
15
- margin-top: 5px;
16
  }
17
 
18
  .card {
19
- max-width: 620px;
20
- margin: 0 auto;
21
- padding: 16px;
22
- border: 1px solid lightgray;
23
- border-radius: 16px;
 
 
24
  }
25
 
26
  .card p:last-child {
27
- margin-bottom: 0;
28
  }
 
1
+
2
  body {
3
+ padding: 0;
4
+ font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
5
+ background-color: #f3f4f6;
6
  }
7
 
8
  h1 {
9
+ font-size: 2.5rem;
10
+ margin-top: 0;
11
+ color: #1f2937;
12
  }
13
 
14
  p {
15
+ color: #6b7280;
16
+ font-size: 15px;
17
+ margin-bottom: 10px;
18
+ margin-top: 5px;
19
  }
20
 
21
  .card {
22
+ max-width: 620px;
23
+ margin: 0 auto;
24
+ padding: 16px;
25
+ border: 1px solid #d1d5db;
26
+ border-radius: 16px;
27
+ background-color: #ffffff;
28
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
29
  }
30
 
31
  .card p:last-child {
32
+ margin-bottom: 0;
33
  }