LaunchPad/index.html at main · RedheadedProgrammer/LaunchPad · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>LaunchPad</title>
  <link rel="icon" href="./assets/rocket-solid-full.svg" type="image/png">
    <!-- Bootstrap CSS -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet">
  <!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
  <link rel="stylesheet" href="style.css">
  <!-- AOS CSS -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.css">
</head>
<body>
  <!-- Navbar -->
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
    <div class="container">
      <a class="navbar-brand" href="#"><i class="fas fa-rocket me-2"></i>LaunchPad</a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav ms-auto">
          <li class="nav-item"><a class="nav-link active" href="#">Home</a></li>
          <li class="nav-item"><a class="nav-link" href="#features">Features</a></li>
          <li class="nav-item"><a class="nav-link" href="#pricing">Pricing</a></li>
          <li class="nav-item"><a class="nav-link" href="login.html">Login / Sign Up</a></li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- Hero Section -->
  <div class="bg-dark text-secondary px-4 py-5 text-center" id="hero">
    <div class="py-5">
      <h1 class="display-5 fw-bold text-white" data-aos="fade-up">Launch Your Ideas Faster</h1>
      <div class="col-lg-6 mx-auto">
        <p class="fs-5 mb-4" data-aos="fade-up" data-aos-delay="200">
          Turn your vision into reality with LaunchPad — the platform built to help innovators deploy, scale, and succeed without limits.
        </p>
        <div class="d-grid gap-2 d-sm-flex justify-content-sm-center">
          <button type="button" class="btn btn-outline-info btn-lg px-4 me-sm-3 fw-bold ms-auto" data-aos="zoom-in" data-aos-delay="400">Sign Up</button>
        </div>
      </div>
    </div>
  </div>

  <!-- About Section -->
  <section id="about" class="py-5">
    <div class="container">
      <div class="row align-items-center">
        <div class="col-md-6" data-aos="fade-right">
          <h2>About LaunchPad</h2>
          <p>LaunchPad is a tech startup dedicated to helping innovators bring their ideas to life faster...</p>
        </div>
        <div class="col-md-6" data-aos="fade-left">
          <img src="https://via.placeholder.com/500x300" class="img-fluid rounded shadow" alt="About LaunchPad">
        </div>
      </div>
    </div>
  </section>

  <!-- Features Section -->
  <section id="features" class="py-5">
    <div class="container">
      <div class="row text-center">
        <div class="col-md-4" data-aos="flip-left">
          <div class="card shadow-sm p-4">
            <h3>🚀 Fast Deployment</h3>
            <p>Get your projects up and running in minutes.</p>
          </div>
        </div>
        <div class="col-md-4" data-aos="flip-up" data-aos-delay="200">
          <div class="card shadow-sm p-4">
            <h3>📈 Scalable Infrastructure</h3>
            <p>Grow without limits — our platform scales seamlessly.</p>
          </div>
        </div>
        <div class="col-md-4" data-aos="flip-right" data-aos-delay="400">
          <div class="card shadow-sm p-4">
            <h3>🛠️ 24/7 Support</h3>
            <p>Our team is always available to help you succeed.</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- Pricing Section -->
  <section id="pricing" class="py-5 bg-light">
    <div class="container">
      <h2 class="text-center mb-4" data-aos="fade-up">Pricing Plans</h2>
      <div class="row">
        <div class="col-md-4" data-aos="zoom-in">
          <div class="card shadow-sm text-center p-4">
            <h3>Free</h3>
            <p class="display-6">$0</p>
            <p>Basic features to get started.</p>
            <a href="login.html" class="btn btn-outline-primary">Get Started</a>
          </div>
        </div>
        <div class="col-md-4" data-aos="zoom-in" data-aos-delay="200">
          <div class="card shadow-sm text-center p-4">
            <h3>Pro</h3>
            <p class="display-6">$29/mo</p>
            <p>Advanced tools for growing teams.</p>
            <a href="login.html" class="btn btn-primary">Choose Pro</a>
          </div>
        </div>
        <div class="col-md-4" data-aos="zoom-in" data-aos-delay="400">
          <div class="card shadow-sm text-center p-4">
            <h3>Enterprise</h3>
            <p class="display-6">$99/mo</p>
            <p>Full support and scalability.</p>
            <a href="login.html" class="btn btn-dark">Contact Sales</a>
          </div>
        </div>
      </div>
    </div>
  </section>


  <!-- Call-to-Action Banner -->
  <section id="cta" class="py-5  text-white text-center">
    <div class="container">
      <h2 class="mb-3" data-aos="fade-up">Ready to Launch?</h2>
      <p class="lead" data-aos="fade-up" data-aos-delay="200">Join thousands of innovators using LaunchPad.</p>
      <a href="login.html" class="btn btn-light btn-lg" data-aos="zoom-in" data-aos-delay="400">Get Started Now</a>
    </div>
  </section>

   <!-- Testimonials Section -->
  <section id="testimonials" class="py-5 bg-light">
    <div class="container">
      <h2 class="text-center mb-4" data-aos="fade-up">What Our Users Say</h2>
      <div class="row">
        <div class="col-md-4" data-aos="fade-up">
          <blockquote class="blockquote">
            <p>"LaunchPad made deploying my app effortless!"</p>
            <footer class="blockquote-footer">Sarah, Developer</footer>
          </blockquote>
        </div>
        <div class="col-md-4" data-aos="fade-up" data-aos-delay="200">
          <blockquote class="blockquote">
            <p>"The scalability is unmatched. Highly recommend."</p>
            <footer class="blockquote-footer">David, Startup Founder</footer>
          </blockquote>
        </div>
        <div class="col-md-4" data-aos="fade-up" data-aos-delay="400">
          <blockquote class="blockquote">
            <p>"Support team is always there when I need them."</p>
            <footer class="blockquote-footer">Amina, Product Manager</footer>
          </blockquote>
        </div>
      </div>
    </div>
  </section>


<!-- Footer -->
<footer class="bg-dark text-white py-3 mt-5">
  <div class="container text-center">
    <p class="mb-0">&copy; 2026 LaunchPad. All rights reserved.</p>
    <div class="mt-2">
      <a href="#" class="text-white me-3 social-icon"><i class="fab fa-twitter fa-lg"></i></a>
      <a href="#" class="text-white me-3 social-icon"><i class="fab fa-linkedin fa-lg"></i></a>
      <a href="#" class="text-white social-icon"><i class="fab fa-github fa-lg"></i></a>
    </div>
  </div>
</footer>


  <!-- Bootstrap + AOS JS -->
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.js"></script>
  <script src="index.js"></script>
</body>
</html>