Spaces:

kazzykaned
/

deepsite-project

Running

App Files Files Community

kazzykaned commited on Sep 28, 2025

Commit

9113acd

verified ·

1 Parent(s): 9c67857

Create the Mission and Contact pages

Browse files

Files changed (4) hide show

contact.html +169 -0
index.html +3 -3
mission.html +112 -0
products.html +3 -3

contact.html ADDED Viewed

	@@ -0,0 +1,169 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Contact Us | Pleiadian Collective</title>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Space+Mono&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+    <style>
+        :root {
+            --purple: #5a2d82;
+            --teal: #2bb3b3;
+            --deep-space: #0a0a1a;
+            --starlight: #fffae6;
+        }
+        body {
+            font-family: 'Montserrat', sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: var(--deep-space);
+            color: var(--starlight);
+            background-image: radial-gradient(circle at 50% 50%, rgba(90, 45, 130, 0.1) 0%, transparent 20%);
+        }
+        .navbar {
+            display: flex;
+            justify-content: space-between;
+            padding: 20px 5%;
+            align-items: center;
+            border-bottom: 1px solid var(--teal);
+        }
+        .logo {
+            font-family: 'Space Mono', monospace;
+            font-size: 1.8rem;
+            color: var(--teal);
+        }
+        .nav-links a {
+            margin: 0 15px;
+            color: var(--starlight);
+            text-decoration: none;
+            transition: color 0.3s;
+        }
+        .nav-links a:hover {
+            color: var(--teal);
+        }
+        .contact-hero {
+            text-align: center;
+            padding: 80px 5%;
+            background-image: url('http://static.photos/space/1200x630/44'), linear-gradient(to bottom, rgba(10,10,26,0.7), rgba(10,10,26,1));
+            background-blend-mode: overlay;
+            background-size: cover;
+        }
+        .contact-container {
+            max-width: 900px;
+            margin: 50px auto;
+            padding: 0 5%;
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+            gap: 50px;
+        }
+        .contact-info {
+            text-align: center;
+        }
+        .contact-info i {
+            font-size: 2rem;
+            color: var(--teal);
+            margin-bottom: 20px;
+        }
+        .contact-form {
+            background: rgba(10, 10, 26, 0.7);
+            padding: 30px;
+            border-radius: 8px;
+            border: 1px solid var(--teal);
+        }
+        .form-group {
+            margin-bottom: 20px;
+        }
+        label {
+            display: block;
+            margin-bottom: 8px;
+        }
+        input, textarea {
+            width: 100%;
+            padding: 12px;
+            background: var(--deep-space);
+            border: 1px solid var(--teal);
+            color: var(--starlight);
+            border-radius: 4px;
+        }
+        button {
+            background: var(--teal);
+            color: var(--deep-space);
+            border: none;
+            padding: 12px 30px;
+            cursor: pointer;
+            font-size: 1rem;
+            transition: opacity 0.3s;
+        }
+        button:hover {
+            opacity: 0.8;
+        }
+        footer {
+            text-align: center;
+            padding: 30px 0;
+            border-top: 1px solid var(--teal);
+            margin-top: 50px;
+        }
+    </style>
+</head>
+<body>
+    <nav class="navbar">
+        <div class="logo">Pleiadian Collective</div>
+        <div class="nav-links">
+            <a href="index.html">Home</a>
+            <a href="products.html">Shop</a>
+            <a href="mission.html">Mission</a>
+            <a href="contact.html">Contact</a>
+            <a href="#"><i class="fas fa-shopping-cart"></i></a>
+        </div>
+    </nav>
+    <section class="contact-hero">
+        <h1>Connect With Us</h1>
+        <p>We'd love to hear from our cosmic family</p>
+    </section>
+    <div class="contact-container">
+        <div class="contact-info">
+            <i class="fas fa-globe"></i>
+            <h3>Cosmic Headquarters</h3>
+            <p>123 Starseed Lane<br>Sedona, AZ 86336</p>
+            <i class="fas fa-envelope" style="margin-top: 30px;"></i>
+            <h3>Email Us</h3>
+            <p>contact@pleiadiancollective.com</p>
+            <i class="fas fa-phone" style="margin-top: 30px;"></i>
+            <h3>Call Us</h3>
+            <p>(555) 123-4567</p>
+        </div>
+        <div class="contact-form">
+            <h3>Send a Message</h3>
+            <form>
+                <div class="form-group">
+                    <label for="name">Name</label>
+                    <input type="text" id="name" required>
+                </div>
+                <div class="form-group">
+                    <label for="email">Email</label>
+                    <input type="email" id="email" required>
+                </div>
+                <div class="form-group">
+                    <label for="subject">Subject</label>
+                    <input type="text" id="subject" required>
+                </div>
+                <div class="form-group">
+                    <label for="message">Message</label>
+                    <textarea id="message" rows="5" required></textarea>
+                </div>
+                <button type="submit">Send Message</button>
+            </form>
+        </div>
+    </div>
+    <footer>
+        <p>&copy; 2023 Pleiadian Collective. All rights reserved.</p>
+    </footer>
+</body>
+</html>

index.html CHANGED Viewed

@@ -88,9 +88,9 @@
         <div class="nav-links">
             <a href="index.html">Home</a>
             <a href="products.html">Shop</a>
-            <a href="#">Mission</a>
-            <a href="#">Contact</a>
-            <a href="#"><i class="fas fa-shopping-cart"></i></a>
         </div>
     </nav>
     <section class="hero">

         <div class="nav-links">
             <a href="index.html">Home</a>
             <a href="products.html">Shop</a>
+            <a href="mission.html">Mission</a>
+            <a href="contact.html">Contact</a>
+<a href="#"><i class="fas fa-shopping-cart"></i></a>
         </div>
     </nav>
     <section class="hero">

mission.html ADDED Viewed

	@@ -0,0 +1,112 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Our Mission | Pleiadian Collective</title>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Space+Mono&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+    <style>
+        :root {
+            --purple: #5a2d82;
+            --teal: #2bb3b3;
+            --deep-space: #0a0a1a;
+            --starlight: #fffae6;
+        }
+        body {
+            font-family: 'Montserrat', sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: var(--deep-space);
+            color: var(--starlight);
+            background-image: radial-gradient(circle at 50% 50%, rgba(90, 45, 130, 0.1) 0%, transparent 20%);
+        }
+        .navbar {
+            display: flex;
+            justify-content: space-between;
+            padding: 20px 5%;
+            align-items: center;
+            border-bottom: 1px solid var(--teal);
+        }
+        .logo {
+            font-family: 'Space Mono', monospace;
+            font-size: 1.8rem;
+            color: var(--teal);
+        }
+        .nav-links a {
+            margin: 0 15px;
+            color: var(--starlight);
+            text-decoration: none;
+            transition: color 0.3s;
+        }
+        .nav-links a:hover {
+            color: var(--teal);
+        }
+        .mission-hero {
+            text-align: center;
+            padding: 80px 5%;
+            background-image: url('http://static.photos/space/1200x630/43'), linear-gradient(to bottom, rgba(10,10,26,0.7), rgba(10,10,26,1));
+            background-blend-mode: overlay;
+            background-size: cover;
+        }
+        .mission-content {
+            max-width: 900px;
+            margin: 50px auto;
+            padding: 0 5%;
+            line-height: 1.8;
+        }
+        .mission-section {
+            margin-bottom: 50px;
+        }
+        .mission-section h2 {
+            color: var(--teal);
+            margin-bottom: 20px;
+            font-size: 1.8rem;
+        }
+        footer {
+            text-align: center;
+            padding: 30px 0;
+            border-top: 1px solid var(--teal);
+            margin-top: 50px;
+        }
+    </style>
+</head>
+<body>
+    <nav class="navbar">
+        <div class="logo">Pleiadian Collective</div>
+        <div class="nav-links">
+            <a href="index.html">Home</a>
+            <a href="products.html">Shop</a>
+            <a href="mission.html">Mission</a>
+            <a href="contact.html">Contact</a>
+            <a href="#"><i class="fas fa-shopping-cart"></i></a>
+        </div>
+    </nav>
+    <section class="mission-hero">
+        <h1>Our Cosmic Mission</h1>
+        <p>Awakening humanity through sacred galactic designs</p>
+    </section>
+    <div class="mission-content">
+        <div class="mission-section">
+            <h2>Starseed Origins</h2>
+            <p>The Pleiadian Collective was founded by starseeds who remember their cosmic origins. Our mission is to help awaken others to their true galactic heritage through sacred symbols, high-vibration fabrics, and designs that activate DNA.</p>
+        </div>
+        <div class="mission-section">
+            <h2>Conscious Creation</h2>
+            <p>Each piece is created with intention, using sustainable materials and infused with sacred geometry. Our manufacturing partners are carefully selected for their ethical practices and alignment with our vision.</p>
+        </div>
+        <div class="mission-section">
+            <h2>Galactic Community</h2>
+            <p>5% of all proceeds fund programs that support starseed awakening and cosmic education. We host regular community gatherings both online and in sacred locations around the world.</p>
+        </div>
+    </div>
+    <footer>
+        <p>&copy; 2023 Pleiadian Collective. All rights reserved.</p>
+    </footer>
+</body>
+</html>

products.html CHANGED Viewed

@@ -102,9 +102,9 @@
         <div class="nav-links">
             <a href="index.html">Home</a>
             <a href="products.html">Shop</a>
-            <a href="#">Mission</a>
-            <a href="#">Contact</a>
-            <a href="#"><i class="fas fa-shopping-cart"></i></a>
         </div>
     </nav>

         <div class="nav-links">
             <a href="index.html">Home</a>
             <a href="products.html">Shop</a>
+            <a href="mission.html">Mission</a>
+            <a href="contact.html">Contact</a>
+<a href="#"><i class="fas fa-shopping-cart"></i></a>
         </div>
     </nav>