Skip to content

Commit c046c02

Browse files
committedApr 18, 2019
basic FE
1 parent 82920f3 commit c046c02

File tree

10 files changed

+161
-2
lines changed

10 files changed

+161
-2
lines changed
 

‎client/images/color1.png

1.42 KB
Loading

‎client/images/color2.png

1.75 KB
Loading

‎client/images/color3.png

969 Bytes
Loading

‎client/images/color4.png

874 Bytes
Loading

‎client/images/color5.png

902 Bytes
Loading

‎client/images/slides/04.jpg

34.3 KB
Loading

‎client/images/slides/05.jpg

33.4 KB
Loading

‎client/index.html

+150-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
12
<!DOCTYPE html>
23
<html lang="en">
34

@@ -7,11 +8,158 @@
78
<meta http-equiv="X-UA-Compatible" content="ie=edge">
89
<link rel="stylesheet" href="main.css">
910
<title>Clean City</title>
11+
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
12+
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
13+
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
14+
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
15+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
16+
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
17+
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
18+
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
19+
<link rel="stylesheet" href="style.css">
20+
<script src="main.js"></script>
1021
</head>
1122

1223
<body>
13-
Clean City
14-
<script src="./main.js"></script>
24+
25+
<header>
26+
<nav class="navbar navbar-expand-lg navbar-light " >
27+
28+
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
29+
<span class="navbar-toggler-icon"></span>
30+
</button>
31+
32+
<div class="collapse navbar-collapse" id="navbarSupportedContent">
33+
<ul class="navbar-nav mr-auto">
34+
<li class="nav-item active ">
35+
<a class="nav-link scrolly" href="#home">Home <span class="sr-only"></span></a>
36+
</li>
37+
<li class="nav-item active">
38+
<a class="nav-link scrolly" href="#upload">Upload</a>
39+
</li>
40+
<li class="nav-item active">
41+
<a class="nav-link scrolly " href="#">About Us</a>
42+
</li>
43+
</ul>
44+
45+
</div>
46+
</nav>
47+
</header>
48+
49+
<section id="home">
50+
<div id="carouselExampleIndicators" data-interval="2000" class="carousel slide" data-ride="carousel">
51+
<ol class="carousel-indicators">
52+
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
53+
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
54+
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
55+
</ol>
56+
<div class="carousel-inner">
57+
<div class="carousel-item active">
58+
<img src="images/slides/04.jpg" style="height: 600px" class="d-block w-100" alt="...">
59+
</div>
60+
<div class="carousel-item">
61+
<img src="images/slides/05.jpg" style="height: 600px" class="d-block w-100" alt="...">
62+
</div>
63+
<div class="carousel-item">
64+
<img src="images/slides/04.jpg" style="height: 600px" class="d-block w-100" alt="...">
65+
</div>
66+
</div>
67+
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
68+
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
69+
<span class="sr-only">Previous</span>
70+
</a>
71+
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
72+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
73+
<span class="sr-only">Next</span>
74+
</a>
75+
</div>
76+
<br>
77+
<div class="container">
78+
<div class="row">
79+
<div class="col-md-4">
80+
<div class="thumbnail">
81+
<img src="images/color5.png" alt="Lights" style="width:100%;height:300px">
82+
83+
84+
</div>
85+
</div>
86+
<div class="col-md-4">
87+
<div class="thumbnail">
88+
89+
<img src="images/color2.png" alt="Nature" style="width:100%;height:300px">
90+
91+
</div>
92+
</div>
93+
<div class="col-md-4">
94+
<div class="thumbnail">
95+
<img src="images/color3.png" alt="Fjords" style="width:100%;height:300px">
96+
97+
</div>
98+
</div>
99+
100+
101+
</div>
102+
</div>
103+
<br><br>
104+
</section>
105+
<section id="upload">
106+
107+
<div class="uploadform border border-primary rounded"></span>
108+
109+
110+
<div style="padding: 20px">
111+
<h3>Any problems in your area?
112+
Post them here!</h3><br>
113+
<form action="#">
114+
115+
<div class="container">
116+
<div class="row">
117+
<div class="col">
118+
<b>Name&emsp;&emsp;</b><input id="name" placeholder="Your name here"><br><br>
119+
</div>
120+
<div class="col">
121+
<b>Location&emsp;&emsp;</b><input id="location" placeholder="Location(area,state)"><br><br>
122+
</div>
123+
</div><br>
124+
<div class="row">
125+
126+
<label><b>&emsp;Description of the report&emsp;&emsp;</b></label>
127+
<textarea placeholder="Short Description" id="description" rows="2" cols="50"></textarea>
128+
<br><br>
129+
</div>
130+
<br>
131+
<div class="row">
132+
<div class="col">
133+
<div class="form-group">
134+
<label><b>Select type of report</b></label>
135+
<select class="form-control" id="problemtype">
136+
<option>Garbage Heap</option>
137+
<option>Accident</option>
138+
<option>Water Shortage</option>
139+
<option>Electricity cut off</option>
140+
<option>Crime</option>
141+
</select>
142+
</div>
143+
</div>
144+
<div class="col">
145+
146+
<div class="form-group">
147+
<label for="picfile"><b>Upload Image</b></label>
148+
<input type="file" class="form-control-file" id="picfile">
149+
</div>
150+
</div>
151+
</div>
152+
</div>
153+
154+
<button style="margin-left: 4em" type ="submit" class="btn btn-primary">Submit</button>
155+
156+
<button style="margin-left: 4em" type="reset" class="btn btn-primary">Reset</button>
157+
</fieldset>
158+
</form>
159+
</div>
160+
</div>
161+
<br><br>
162+
</section>
15163
</body>
16164

17165
</html>

‎client/main.css

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.uploadform{
2+
width: 800px;
3+
margin: 0 auto;
4+
}

‎client/main.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
2+
// Scrolly.
3+
$('.scrolly')
4+
.scrolly({
5+
speed: 2000,
6+
offset: $header.outerHeight()
7+
});

0 commit comments

Comments
 (0)
Please sign in to comment.