Skip to content

Commit ddc98c2

Browse files
bsbravobsbravo
authored
Update index.html
1 parent bcf4ec1 commit ddc98c2

1 file changed

Lines changed: 92 additions & 32 deletions

File tree

‎Chapter01/StarterFiles/index.html‎

Lines changed: 92 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,92 @@
1-
body {
2-
padding-top: 50px;
3-
}
4-
.starter-template {
5-
padding: 40px 15px;
6-
text-align: center;
7-
}
8-
.content-area {
9-
margin: 30px;
10-
}
11-
.input-area {
12-
margin: 25px;
13-
}
14-
.task-text {
15-
display: flex;
16-
align-items: center;
17-
height: 40px;
18-
}
19-
.hidden {
20-
display: none;
21-
}
22-
.delete-icon-area {
23-
display: flex;
24-
align-items: center;
25-
height: 40px;
26-
}
27-
.delete-icon {
28-
color: red;
29-
}
30-
.complete {
31-
text-decoration: line-through;
32-
}
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>To-Do-List</title>
8+
<link rel="stylesheet" href="styles.css">
9+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
10+
</head>
11+
<body>
12+
13+
<nav class="navbar navbar-inverse navbar-fixed-top">
14+
<div class="container">
15+
<div class="navbar-header">
16+
<a class="navbar-brand" href="/">ToDo List</a>
17+
</div>
18+
</div>
19+
</nav>
20+
21+
<div class="container">
22+
23+
<div class="content-area row">
24+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
25+
26+
<div class="col-md-8 col-xs-8 col-lg-8 col-sm-8">
27+
<h2>ToDo List</h2>
28+
29+
<div class="row input-area">
30+
<div class="col-md-1"></div>
31+
<div class="form-group col-md-9">
32+
<input type="text" placeholder="New Task" class="form-control" id="addTask">
33+
</div>
34+
<div class="form-group col-md-1">
35+
<button class="btn btn-primary">Add</button>
36+
</div>
37+
<div class="col-md-1"></div>
38+
</div>
39+
40+
<ul class="list-group" id="taskList">
41+
<li class="list-group-item checkbox">
42+
<div class="row">
43+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
44+
<label><input type="checkbox" value="" class="" checked></label>
45+
</div>
46+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text complete">
47+
First item
48+
</div>
49+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
50+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
51+
</div>
52+
</div>
53+
</li>
54+
<li class="list-group-item checkbox">
55+
<div class="row">
56+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
57+
<label><input type="checkbox" value="" class=""></label>
58+
</div>
59+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text">
60+
Second item
61+
</div>
62+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
63+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
64+
</div>
65+
</div>
66+
</li>
67+
<li class="list-group-item checkbox">
68+
<div class="row">
69+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
70+
<label><input type="checkbox" value="" class=""></label>
71+
</div>
72+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text">
73+
Third item
74+
</div>
75+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
76+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
77+
</div>
78+
</div>
79+
</li>
80+
</ul>
81+
</div>
82+
83+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
84+
</div>
85+
86+
</div><!-- /.container -->
87+
88+
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
89+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
90+
<script src="scripts.js"></script>
91+
</body>
92+
</html>

0 commit comments

Comments
 (0)