Hugging Face's logo

Spaces:
kazzykaned
/
deepsite-project
Running

App Files Community
kazzykaned commited on
Commit
384d8b7
·
verified ·
1 Parent(s): 0b5847e

it just says "spaces documentation"

Browse files
Files changed (2) hide show
  1. index.html +106 -18
  2. products.html +151 -0
index.html CHANGED
@@ -1,19 +1,107 @@
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
+
2
+ <!DOCTYPE html>
3
+ <html lang="en">
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>Pleiadian Collective | Starseed Apparel</title>
8
+ <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Space+Mono&display=swap" rel="stylesheet">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
10
+ <style>
11
+ :root {
12
+ --purple: #5a2d82;
13
+ --teal: #2bb3b3;
14
+ --deep-space: #0a0a1a;
15
+ --starlight: #fffae6;
16
+ }
17
+ body {
18
+ font-family: 'Montserrat', sans-serif;
19
+ margin: 0;
20
+ padding: 0;
21
+ background-color: var(--deep-space);
22
+ color: var(--starlight);
23
+ background-image: radial-gradient(circle at 50% 50%, rgba(90, 45, 130, 0.1) 0%, transparent 20%);
24
+ }
25
+ .navbar {
26
+ display: flex;
27
+ justify-content: space-between;
28
+ padding: 20px 5%;
29
+ align-items: center;
30
+ border-bottom: 1px solid var(--teal);
31
+ }
32
+ .logo {
33
+ font-family: 'Space Mono', monospace;
34
+ font-size: 1.8rem;
35
+ color: var(--teal);
36
+ }
37
+ .nav-links a {
38
+ margin: 0 15px;
39
+ color: var(--starlight);
40
+ text-decoration: none;
41
+ transition: color 0.3s;
42
+ }
43
+ .nav-links a:hover {
44
+ color: var(--teal);
45
+ }
46
+ .hero {
47
+ height: 80vh;
48
+ display: flex;
49
+ flex-direction: column;
50
+ justify-content: center;
51
+ align-items: center;
52
+ text-align: center;
53
+ padding: 0 5%;
54
+ background-image: url('http://static.photos/space/1200x630/42'), linear-gradient(to bottom, rgba(10,10,26,0.5), rgba(10,10,26,1));
55
+ background-blend-mode: overlay;
56
+ background-size: cover;
57
+ }
58
+ .hero h1 {
59
+ font-size: 3.5rem;
60
+ margin-bottom: 20px;
61
+ text-shadow: 0 0 10px var(--teal);
62
+ }
63
+ .cta-button {
64
+ background: transparent;
65
+ border: 2px solid var(--teal);
66
+ color: var(--teal);
67
+ padding: 12px 30px;
68
+ font-size: 1.2rem;
69
+ cursor: pointer;
70
+ transition: all 0.3s;
71
+ margin-top: 20px;
72
+ }
73
+ .cta-button:hover {
74
+ background: var(--teal);
75
+ color: var(--deep-space);
76
+ }
77
+ footer {
78
+ text-align: center;
79
+ padding: 30px 0;
80
+ border-top: 1px solid var(--teal);
81
+ margin-top: 50px;
82
+ }
83
+ </style>
84
+ </head>
85
+ <body>
86
+ <nav class="navbar">
87
+ <div class="logo">Pleiadian Collective</div>
88
+ <div class="nav-links">
89
+ <a href="index.html">Home</a>
90
+ <a href="products.html">Shop</a>
91
+ <a href="#">Mission</a>
92
+ <a href="#">Contact</a>
93
+ <a href="#"><i class="fas fa-shopping-cart"></i></a>
94
+ </div>
95
+ </nav>
96
+
97
+ <section class="hero">
98
+ <h1>Awaken Your Cosmic Essence</h1>
99
+ <p>Wear your starseed heritage with pride through our high-vibration apparel and sacred accessories</p>
100
+ <button class="cta-button">Explore Collection</button>
101
+ </section>
102
+
103
+ <footer>
104
+ <p>&copy; 2023 Pleiadian Collective. All rights reserved.</p>
105
+ </footer>
106
+ </body>
107
  </html>
products.html ADDED
@@ -0,0 +1,151 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Shop | Pleiadian Collective</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Space+Mono&display=swap" rel="stylesheet">
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
9
+ <style>
10
+ :root {
11
+ --purple: #5a2d82;
12
+ --teal: #2bb3b3;
13
+ --deep-space: #0a0a1a;
14
+ --starlight: #fffae6;
15
+ }
16
+ body {
17
+ font-family: 'Montserrat', sans-serif;
18
+ margin: 0;
19
+ padding: 0;
20
+ background-color: var(--deep-space);
21
+ color: var(--starlight);
22
+ }
23
+ .navbar {
24
+ display: flex;
25
+ justify-content: space-between;
26
+ padding: 20px 5%;
27
+ align-items: center;
28
+ border-bottom: 1px solid var(--teal);
29
+ }
30
+ .logo {
31
+ font-family: 'Space Mono', monospace;
32
+ font-size: 1.8rem;
33
+ color: var(--teal);
34
+ }
35
+ .nav-links a {
36
+ margin: 0 15px;
37
+ color: var(--starlight);
38
+ text-decoration: none;
39
+ transition: color 0.3s;
40
+ }
41
+ .nav-links a:hover {
42
+ color: var(--teal);
43
+ }
44
+ .products-header {
45
+ text-align: center;
46
+ padding: 50px 0;
47
+ }
48
+ .products-grid {
49
+ display: grid;
50
+ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
51
+ gap: 30px;
52
+ padding: 0 5% 50px;
53
+ }
54
+ .product-card {
55
+ border: 1px solid var(--teal);
56
+ padding: 20px;
57
+ border-radius: 5px;
58
+ transition: transform 0.3s;
59
+ }
60
+ .product-card:hover {
61
+ transform: translateY(-5px);
62
+ box-shadow: 0 10px 20px rgba(43, 179, 179, 0.2);
63
+ }
64
+ .product-image {
65
+ width: 100%;
66
+ height: 300px;
67
+ object-fit: cover;
68
+ margin-bottom: 15px;
69
+ }
70
+ .product-title {
71
+ font-size: 1.2rem;
72
+ margin-bottom: 10px;
73
+ color: var(--teal);
74
+ }
75
+ .product-price {
76
+ font-weight: bold;
77
+ margin-bottom: 15px;
78
+ }
79
+ .add-to-cart {
80
+ background: var(--teal);
81
+ color: var(--deep-space);
82
+ border: none;
83
+ padding: 10px 20px;
84
+ cursor: pointer;
85
+ width: 100%;
86
+ transition: opacity 0.3s;
87
+ }
88
+ .add-to-cart:hover {
89
+ opacity: 0.8;
90
+ }
91
+ footer {
92
+ text-align: center;
93
+ padding: 30px 0;
94
+ border-top: 1px solid var(--teal);
95
+ margin-top: 50px;
96
+ }
97
+ </style>
98
+ </head>
99
+ <body>
100
+ <nav class="navbar">
101
+ <div class="logo">Pleiadian Collective</div>
102
+ <div class="nav-links">
103
+ <a href="index.html">Home</a>
104
+ <a href="products.html">Shop</a>
105
+ <a href="#">Mission</a>
106
+ <a href="#">Contact</a>
107
+ <a href="#"><i class="fas fa-shopping-cart"></i></a>
108
+ </div>
109
+ </nav>
110
+
111
+ <div class="products-header">
112
+ <h1>Starseed Collection</h1>
113
+ <p>Sacred designs for awakened beings</p>
114
+ </div>
115
+
116
+ <div class="products-grid">
117
+ <div class="product-card">
118
+ <img src="http://static.photos/abstract/640x360/1" alt="Pleiadian T-Shirt" class="product-image">
119
+ <h3 class="product-title">Pleiadian Activation Tee</h3>
120
+ <p>Channel higher frequencies with this sacred geometry design</p>
121
+ <div class="product-price">$34.99</div>
122
+ <button class="add-to-cart">Add to Cart</button>
123
+ </div>
124
+ <div class="product-card">
125
+ <img src="http://static.photos/abstract/640x360/2" alt="Orion Hoodie" class="product-image">
126
+ <h3 class="product-title">Orion Energy Hoodie</h3>
127
+ <p>Stay warm while carrying Orion's wisdom</p>
128
+ <div class="product-price">$59.99</div>
129
+ <button class="add-to-cart">Add to Cart</button>
130
+ </div>
131
+ <div class="product-card">
132
+ <img src="http://static.photos/abstract/640x360/3" alt="Sirius Tank" class="product-image">
133
+ <h3 class="product-title">Sirius Star Tank</h3>
134
+ <p>Connect with your Sirius lineage</p>
135
+ <div class="product-price">$29.99</div>
136
+ <button class="add-to-cart">Add to Cart</button>
137
+ </div>
138
+ <div class="product-card">
139
+ <img src="http://static.photos/abstract/640x360/4" alt="Arcturus Tote" class="product-image">
140
+ <h3 class="product-title">Arcturus Tote Bag</h3>
141
+ <p>Carry your essentials with Arcturian energy</p>
142
+ <div class="product-price">$24.99</div>
143
+ <button class="add-to-cart">Add to Cart</button>
144
+ </div>
145
+ </div>
146
+
147
+ <footer>
148
+ <p>&copy; 2023 Pleiadian Collective. All rights reserved.</p>
149
+ </footer>
150
+ </body>
151
+ </html>