forked from Jaspreet099/propack
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
149 lines (127 loc) · 6.85 KB
/
index.html
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
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="/images/icons/48.ico">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"
integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
crossorigin="anonymous"></script>
<!-- FONT AWESOME CDN-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
crossorigin="anonymous" />
<link rel="stylesheet" href="css/style.css">
<!-- Animate on Scroll -->
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<title>Propack</title>
</head>
<body>
<!-- prloader start -->
<div id="spinner-wrapper">
<div class="sk-folding-cube">
<div class="sk-cube1 sk-cube"></div>
<div class="sk-cube2 sk-cube"></div>
<div class="sk-cube4 sk-cube"></div>
<div class="sk-cube3 sk-cube"></div>
</div>
</div>
<!-- prloader End -->
<!-- navbar-start -->
<div id="navbar"></div>
<!-- navbar-end -->
<div class="cursor d-none d-sm-block"></div>
<section class="d-flex justify-content-md-center flex-wrap-reverse ">
<div class=" col-lg-6 px-4 text-center text-lg-start text-dark align-self-center">
<h1 class="display-3 fw-bold lh-1 mb-3">ProPack</h1>
<p class="lead">ProPack is the single sure source that brings you <br>fundamental yet amazing
projects with live demo and code.</p>
<a type="button" class="btn btn-secondary-custom text-light rounded-pill px-4"
href="./projects/project.html">Get
Started</a>
</div>
<div class="image p-sm-2 d-none d-lg-block justify-content-md-center">
<img src="images/rocket.png" class="img-fluid svg-animation" alt="Hero Image" width="500" height="400">
</div>
</section>
<div class="row text-center m-0 px-4">
<h1 class="fw-bold">What Do We Provide?</h1>
<p class="lead text-muted">The new and free way to improve your programming skills.</p>
</div>
<div class="d-flex justify-content-center my-5" data-aos="fade-up" data-aos-easing="linear" data-aos-delay="200" data-aos-duration="600">
<div class="container rounded-3 p-lg-5 pt-0 p-sm-1 col-11 mb-5">
<div class="row p-2">
<div class="col-md-4 my-1">
<div class="card h-100 shadow-sm">
<div class="card-body p-4">
<h5 class="card-title fw-bold">True, Project-based Learning</h5>
<p class="card-text">
We mainly believe in project-based learning. Learn with real work experience by
building beginner to advanced level projects.</p>
</div>
</div>
</div>
<div class="col-md-4 my-1">
<div class="card h-100 shadow-sm">
<div class="card-body p-4">
<h5 class="card-title fw-bold">Top Free Resources</h5>
<p class="card-text">We not only provide you a platform to see various projects but
we also focus on how did you get all the resources regarding web development.
</p>
</div>
</div>
</div>
<div class="col-md-4 my-1">
<div class="card h-100 shadow-sm">
<div class="card-body p-4">
<h5 class="card-title fw-bold">Open Source Community</h5>
<p class="card-text">Propack is an open-source community and anyone can contribute to
it.
This is a solution for every beginner programmer to learn and develop awesome
projects.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-md-center flex-wrap-reverse mb-5">
<div class="image p-sm-2 d-none d-lg-block justify-content-md-center">
<img src="images/success.png" class="img-fluid svg-animation" alt="Success Image" width="350"
height="50">
</div>
<div class=" col-lg-7 px-4 text-center text-dark align-self-center px-0">
<h1 class=" fw-bold lh-1 mb-3">Change the way you engage with programmers</h1>
<p class="lead">Unleash your inner hacker and start to code</p>
<a type="button" class="btn btn-secondary-custom text-light rounded-pill px-4"
href="/pages/contact.html">Contact <i class="fas fa-paper-plane mx-1"></i></a>
<a type="button" class="btn btn-primary-custom shadow-sm rounded-pill px-4"
href="https://discord.gg/NgWxbsAFmW">Discord <i class="fab fa-discord mx-1 fs-5"></i></a>
</div>
</div>
<!-- footer-end -->
<div id="footer"></div>
<!-- footer-end -->
<!--scroll to top button-->
<button id="scrollToTopButton" title="Go to top" class="mx-4 shadow-sm scrollToTopBtn">
<i class="fa fa-rocket align-self-center text-light" aria-hidden="true"></i>
</button>
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous">
</script>
<script>
$(function () {
$("#navbar").load("include/navbar.html");
$("#footer").load("include/footer.html");
});
</script>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>