Skip to content

Commit ba82487

Browse files
vaibhavsingh97vaibhavsingh97
committed
Added boilerplate code
1 parent 7ba75e9 commit ba82487

File tree

12 files changed

+21534
-0
lines changed

12 files changed

+21534
-0
lines changed

‎.DS_Store

6 KB
Binary file not shown.

‎css/materialize.css

Lines changed: 9039 additions & 0 deletions
Large diffs are not rendered by default.

‎css/materialize.min.css

Lines changed: 13 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎css/style.css

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
nav ul a,
2+
nav .brand-logo {
3+
color: #444;
4+
}
5+
6+
p {
7+
line-height: 2rem;
8+
}
9+
10+
.sidenav-trigger {
11+
color: #26a69a;
12+
}
13+
14+
.parallax-container {
15+
min-height: 380px;
16+
line-height: 0;
17+
height: auto;
18+
color: rgba(255,255,255,.9);
19+
}
20+
.parallax-container .section {
21+
width: 100%;
22+
}
23+
24+
@media only screen and (max-width : 992px) {
25+
.parallax-container .section {
26+
position: absolute;
27+
top: 40%;
28+
}
29+
#index-banner .section {
30+
top: 10%;
31+
}
32+
}
33+
34+
@media only screen and (max-width : 600px) {
35+
#index-banner .section {
36+
top: 0;
37+
}
38+
}
39+
40+
.icon-block {
41+
padding: 0 15px;
42+
}
43+
.icon-block .material-icons {
44+
font-size: inherit;
45+
}
46+
47+
footer.page-footer {
48+
margin: 0;
49+
}

‎images/.DS_Store

6 KB
Binary file not shown.

‎images/background1.jpg

97.2 KB
Loading

‎images/background2.jpg

183 KB
Loading

‎images/background3.jpg

172 KB
Loading

‎index.html

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
5+
<meta name="viewport" content="width=device-width, initial-scale=1"/>
6+
<title>Yogdaan</title>
7+
8+
<!-- CSS -->
9+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
10+
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
11+
<link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
12+
</head>
13+
<body>
14+
<nav class="white" role="navigation">
15+
<div class="nav-wrapper container">
16+
<a id="logo-container" href="#" class="brand-logo">Logo</a>
17+
<ul class="right hide-on-med-and-down">
18+
<li><a href="#">Navbar Link</a></li>
19+
</ul>
20+
21+
<ul id="nav-mobile" class="sidenav">
22+
<li><a href="#">Navbar Link</a></li>
23+
</ul>
24+
<a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
25+
</div>
26+
</nav>
27+
28+
<div id="index-banner" class="parallax-container">
29+
<div class="section no-pad-bot">
30+
<div class="container">
31+
<br><br>
32+
<h1 class="header center teal-text text-lighten-2">Title</h1>
33+
<div class="row center">
34+
<h5 class="header col s12 light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit error voluptas veritatis quae nihil quam. Asperiores dolorum ab, voluptates voluptatem fugit laudantium magnam nemo alias sit dolor quaerat, natus nostrum.</h5>
35+
</div>
36+
<div class="row center">
37+
<a href="#!" id="download-button" class="btn-large waves-effect waves-light teal lighten-1">Get Started</a>
38+
</div>
39+
<br><br>
40+
41+
</div>
42+
</div>
43+
<div class="parallax"><img src="images/background1.jpg" alt="Unsplashed background img 1"></div>
44+
</div>
45+
46+
47+
<div class="container">
48+
<div class="section">
49+
50+
<!-- Icon Section -->
51+
<div class="row">
52+
<div class="col s12 m4">
53+
<div class="icon-block">
54+
<h2 class="center brown-text"><i class="material-icons">domain</i></h2>
55+
<h5 class="center">Title</h5>
56+
57+
<p class="light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptate, id architecto perferendis ipsa, amet perspiciatis et incidunt praesentium, tempora veritatis fugit. Minus non exercitationem maxime ratione officiis, error doloribus esse.</p>
58+
</div>
59+
</div>
60+
61+
<div class="col s12 m4">
62+
<div class="icon-block">
63+
<h2 class="center brown-text"><i class="material-icons">group</i></h2>
64+
<h5 class="center">Title</h5>
65+
66+
<p class="light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptate, id architecto perferendis ipsa, amet perspiciatis et incidunt praesentium, tempora veritatis fugit. Minus non exercitationem maxime ratione officiis, error doloribus esse.</p>
67+
</div>
68+
</div>
69+
70+
<div class="col s12 m4">
71+
<div class="icon-block">
72+
<h2 class="center brown-text"><i class="material-icons">public</i></h2>
73+
<h5 class="center">Title</h5>
74+
75+
<p class="light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptate, id architecto perferendis ipsa, amet perspiciatis et incidunt praesentium, tempora veritatis fugit. Minus non exercitationem maxime ratione officiis, error doloribus esse.</p>
76+
</div>
77+
</div>
78+
</div>
79+
80+
</div>
81+
</div>
82+
83+
84+
<div class="parallax-container valign-wrapper">
85+
<div class="section no-pad-bot">
86+
<div class="container">
87+
<div class="row center">
88+
<h5 class="header col s12 light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Reiciendis corrupti natus pariatur ducimus nisi unde nam? Expedita est, fugit officiis aliquid voluptatum odio. Repudiandae aut, facere ea ratione porro maiores.</h5>
89+
</div>
90+
</div>
91+
</div>
92+
<div class="parallax"><img src="images/background2.jpg" alt="Unsplashed background img 2"></div>
93+
</div>
94+
95+
<div class="container">
96+
<div class="section">
97+
98+
<div class="row">
99+
<div class="col s12 center">
100+
<h3><i class="mdi-content-send brown-text"></i></h3>
101+
<h4>Contact Us</h4>
102+
<p class="left-align light">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam scelerisque id nunc nec volutpat. Etiam pellentesque tristique arcu, non consequat magna fermentum ac. Cras ut ultricies eros. Maecenas eros justo, ullamcorper a sapien id, viverra ultrices eros. Morbi sem neque, posuere et pretium eget, bibendum sollicitudin lacus. Aliquam eleifend sollicitudin diam, eu mattis nisl maximus sed. Nulla imperdiet semper molestie. Morbi massa odio, condimentum sed ipsum ac, gravida ultrices erat. Nullam eget dignissim mauris, non tristique erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;</p>
103+
</div>
104+
</div>
105+
106+
</div>
107+
</div>
108+
109+
110+
<div class="parallax-container valign-wrapper">
111+
<div class="section no-pad-bot">
112+
<div class="container">
113+
<div class="row center">
114+
<h5 class="header col s12 light">Lorem ipsum dolor sit amet consectetur adipisicing elit. Et qui minima repudiandae atque, totam maiores possimus similique quod ab, saepe quasi blanditiis ut soluta natus libero temporibus, odit praesentium itaque?</h5>
115+
</div>
116+
</div>
117+
</div>
118+
<div class="parallax"><img src="images/background3.jpg" alt="Unsplashed background img 3"></div>
119+
</div>
120+
121+
<footer class="page-footer teal">
122+
<div class="container">
123+
<div class="row">
124+
<div class="col l6 s12">
125+
<h5 class="white-text">Title</h5>
126+
<p class="grey-text text-lighten-4">Lorem ipsum dolor sit amet consectetur adipisicing elit. Consequuntur, soluta omnis. Laudantium facilis, rerum deleniti, assumenda impedit maxime officia perspiciatis repudiandae saepe pariatur omnis praesentium nisi accusantium, cum molestias eligendi?</p>
127+
128+
129+
</div>
130+
<div class="col l3 s12">
131+
<h5 class="white-text">Title</h5>
132+
<ul>
133+
<li><a class="white-text" href="#!">Link 1</a></li>
134+
<li><a class="white-text" href="#!">Link 2</a></li>
135+
<li><a class="white-text" href="#!">Link 3</a></li>
136+
<li><a class="white-text" href="#!">Link 4</a></li>
137+
</ul>
138+
</div>
139+
<div class="col l3 s12">
140+
<h5 class="white-text">Title</h5>
141+
<ul>
142+
<li><a class="white-text" href="#!">Link 1</a></li>
143+
<li><a class="white-text" href="#!">Link 2</a></li>
144+
<li><a class="white-text" href="#!">Link 3</a></li>
145+
<li><a class="white-text" href="#!">Link 4</a></li>
146+
</ul>
147+
</div>
148+
</div>
149+
</div>
150+
<div class="footer-copyright">
151+
<div class="container">
152+
Made with <span style="color: #e25555;">&hearts;</span> by devs.
153+
</div>
154+
</div>
155+
</footer>
156+
157+
158+
<!-- Scripts-->
159+
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
160+
<script src="js/materialize.js"></script>
161+
<script src="js/init.js"></script>
162+
163+
</body>
164+
</html>

‎js/init.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
(function($){
2+
$(function(){
3+
4+
$('.sidenav').sidenav();
5+
$('.parallax').parallax();
6+
7+
}); // end of document ready
8+
})(jQuery); // end of jQuery name space

0 commit comments

Comments
 (0)