Skip to content

Commit e577f4b

Browse files
author
Ian Redpath
committed
fix in forms page, work on form-fields page
1 parent 25a86dd commit e577f4b

File tree

2 files changed

+210
-47
lines changed

2 files changed

+210
-47
lines changed

‎public/assignment/form-fields.html‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
8+
<meta name="description" content="">
9+
<meta name="author" content="">
10+
11+
<title>Dashboard Template for Bootstrap</title>
12+
13+
<!-- Bootstrap core CSS -->
14+
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
15+
16+
<!-- Custom styles for this template -->
17+
<link href="./css/dashboard.css" rel="stylesheet">
18+
</head>
19+
<body>
20+
<nav class="navbar navbar-inverse navbar-fixed-top">
21+
<div class="container-fluid">
22+
<div class="navbar-header">
23+
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
24+
<span class="sr-only">Toggle navigation</span>
25+
<span class="icon-bar"></span>
26+
<span class="icon-bar"></span>
27+
<span class="icon-bar"></span>
28+
</button>
29+
<a class="navbar-brand" href="#">Form Maker</a>
30+
</div>
31+
<div id="navbar" class="navbar-collapse collapse">
32+
<ul class="nav navbar-nav navbar-right">
33+
<li><a href="#">Username</a></li>
34+
<li><a href="#">Logout</a></li>
35+
</ul>
36+
</div>
37+
</div>
38+
</nav>
39+
40+
<div class="container-fluid">
41+
<div class="row">
42+
<div class="col-sm-3 col-md-2 sidebar">
43+
<ul class="nav nav-sidebar">
44+
<li><a href="./home.html">Home</a></li>
45+
<li><a href="./profile.html">Profile</a></li>
46+
<li><a href="./admin.html">Admin</a></li>
47+
<li class="active"><a href="./forms.html">Forms<span class="sr-only">(current)</span></a></li>
48+
</ul>
49+
</div>
50+
</div>
51+
</div>
52+
53+
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
54+
<h1 class="page-header">Forms : Registration Form</h1>
55+
<ul class="nav nav-tabs">
56+
<li role="presentation"><a href="./forms.html">Forms</a></li>
57+
<li role="presentation" class="active"><a href="./form-fields.html">Fields</a></li>
58+
</ul>
59+
<form class="form-horizontal">
60+
<div class="form-group">
61+
<label for="first-name" class="col-sm-2 control-label">First Name:</label>
62+
<div class="col-sm-6">
63+
<input type="text" class="form-control" id="first-name" placeholder="Username">
64+
</div>
65+
<div class="col-sm-4 icons">
66+
<span class="glyphicon glyphicon-pencil" />
67+
<span class="glyphicon glyphicon-plus" />
68+
<span class="glyphicon glyphicon-remove" />
69+
<span class="glyphicon glyphicon-menu-hamburger" />
70+
</div>
71+
</div>
72+
<div class="form-group">
73+
<label for="last-name" class="col-sm-2 control-label">Last Name:</label>
74+
<div class="col-sm-6">
75+
<input type="text" class="form-control" id="last-name" placeholder="Password">
76+
</div>
77+
<div class="col-sm-4 icons">
78+
<span class="glyphicon glyphicon-pencil" />
79+
<span class="glyphicon glyphicon-plus" />
80+
<span class="glyphicon glyphicon-remove" />
81+
<span class="glyphicon glyphicon-menu-hamburger" />
82+
</div>
83+
</div>
84+
<div class="form-group">
85+
<label for="dob" class="col-sm-2 control-label">Date of Birth:</label>
86+
<div class="col-sm-6">
87+
<input type="date" class="form-control" id="dob" placeholder="Select date">
88+
</div>
89+
<div class="col-sm-4 icons">
90+
<span class="glyphicon glyphicon-pencil" />
91+
<span class="glyphicon glyphicon-plus" />
92+
<span class="glyphicon glyphicon-remove" />
93+
<span class="glyphicon glyphicon-menu-hamburger" />
94+
</div>
95+
</div>
96+
<div class="form-group">
97+
<label for="gender" class="col-sm-2 control-label">Gender:</label>
98+
<div class="col-sm-6">
99+
<select class="form-control" id="gender">
100+
<option class="active">Male</option>
101+
<option>Female</option>
102+
<select>
103+
</div>
104+
<div class="col-sm-4 icons">
105+
<span class="glyphicon glyphicon-pencil" />
106+
<span class="glyphicon glyphicon-plus" />
107+
<span class="glyphicon glyphicon-remove" />
108+
<span class="glyphicon glyphicon-menu-hamburger" />
109+
</div>
110+
</div>
111+
<div class="form-group">
112+
<label for="roles" class="col-sm-2 control-label">Roles:</label>
113+
<div class="col-sm-6" id="roles">
114+
<label><input type="checkbox" class="form-control">Admin</label>
115+
<label><input type="checkbox" class="form-control">Student</label>
116+
<label><input type="checkbox" class="form-control">User</label>
117+
</div>
118+
<div class="col-sm-4 icons">
119+
<span class="glyphicon glyphicon-pencil" />
120+
<span class="glyphicon glyphicon-plus" />
121+
<span class="glyphicon glyphicon-remove" />
122+
<span class="glyphicon glyphicon-menu-hamburger" />
123+
</div>
124+
</div>
125+
<div class="form-group">
126+
<label for="license-agreement" class="col-sm-2 control-label">License Agreement:</label>
127+
<div class="col-sm-6" id="license-agreement">
128+
<label><input type="radio" name="license-radio" class="form-control">Yes</label>
129+
<label><input type="radio" name="license-radio" class="form-control">No</label>
130+
</div>
131+
<div class="col-sm-4 icons">
132+
<span class="glyphicon glyphicon-pencil" />
133+
<span class="glyphicon glyphicon-plus" />
134+
<span class="glyphicon glyphicon-remove" />
135+
<span class="glyphicon glyphicon-menu-hamburger" />
136+
</div>
137+
</div>
138+
<div class="form-group">
139+
<label for="add-new-field" class="col-sm-2 control-label">Add New Field:</label>
140+
<div class="col-sm-6">
141+
<select class="form-control" id="add-new-field">
142+
<option class="active">Single Line Text</option>
143+
<option>Date</option>
144+
<option>Dropdown</option>
145+
<option>Checkboxes</option>
146+
<option>Radio Buttons</option>
147+
<option>Paragraph Text Field</option>
148+
</select>
149+
</div>
150+
<div class="col-sm-4 icons">
151+
<span class="glyphicon glyphicon-plus" />
152+
</div>
153+
</div>
154+
</form>
155+
</div>
156+
157+
<!-- Bootstrap core JavaScript
158+
================================================== -->
159+
<!-- Placed at the end of the document so the pages load faster -->
160+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
161+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
162+
</body>
163+
</html>

‎public/assignment/forms.html‎

Lines changed: 47 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -55,54 +55,54 @@ <h1 class="page-header">Forms</h1>
5555
<ul class="nav nav-tabs">
5656
<li role="presentation" class="active"><a href="./forms.html">Forms</a></li>
5757
<li role="presentation"><a href="./form-fields.html">Fields</a></li>
58-
<table class="table table-striped">
59-
<thead>
60-
<tr>
61-
<th>
62-
<div class="table-header-div">
63-
<span class="glyphicon glyphicon-chevron-down"></span>
64-
Form Name
65-
</div>
66-
</th>
67-
<th>
68-
<div class="table-header-div">
69-
<span class="glyphicon glyphicon-chevron-down"></span>
70-
Action
71-
</div>
72-
</th>
73-
</tr>
74-
<tr>
75-
<th><input type="text" placeholder="name"></th>
76-
<th><div class="icon-div">
77-
<span class="glyphicon glyphicon-plus" />
78-
<span class="glyphicon glyphicon-ok" />
79-
</div></th>
80-
</tr>
81-
</thead>
82-
<tbody>
83-
<tr>
84-
<th><a href="./form-fields.html">Registration Form</a></th>
85-
<th><div class="icon-div">
86-
<span class="glyphicon glyphicon-remove" />
87-
<span class="glyphicon glyphicon-pencil" />
88-
</div></th>
89-
</tr>
90-
<tr>
91-
<th><a href="./form-fields.html">Contact List</a></th>
92-
<th><div class="icon-div">
93-
<span class="glyphicon glyphicon-remove" />
94-
<span class="glyphicon glyphicon-pencil" />
95-
</div></th>
96-
</tr>
97-
<tr>
98-
<th><a href="./form-fields.html">To Do List</a></th>
99-
<th><div class="icon-div">
100-
<span class="glyphicon glyphicon-remove" />
101-
<span class="glyphicon glyphicon-pencil" />
102-
</div></th>
103-
</tr>
104-
</table>
10558
</ul>
59+
<table class="table table-striped">
60+
<thead>
61+
<tr>
62+
<th>
63+
<div class="table-header-div">
64+
<span class="glyphicon glyphicon-chevron-down"></span>
65+
Form Name
66+
</div>
67+
</th>
68+
<th>
69+
<div class="table-header-div">
70+
<span class="glyphicon glyphicon-chevron-down"></span>
71+
Action
72+
</div>
73+
</th>
74+
</tr>
75+
<tr>
76+
<th><input type="text" placeholder="name"></th>
77+
<th><div class="icon-div">
78+
<span class="glyphicon glyphicon-plus" />
79+
<span class="glyphicon glyphicon-ok" />
80+
</div></th>
81+
</tr>
82+
</thead>
83+
<tbody>
84+
<tr>
85+
<th><a href="./form-fields.html">Registration Form</a></th>
86+
<th><div class="icon-div">
87+
<span class="glyphicon glyphicon-remove" />
88+
<span class="glyphicon glyphicon-pencil" />
89+
</div></th>
90+
</tr>
91+
<tr>
92+
<th><a href="./form-fields.html">Contact List</a></th>
93+
<th><div class="icon-div">
94+
<span class="glyphicon glyphicon-remove" />
95+
<span class="glyphicon glyphicon-pencil" />
96+
</div></th>
97+
</tr>
98+
<tr>
99+
<th><a href="./form-fields.html">To Do List</a></th>
100+
<th><div class="icon-div">
101+
<span class="glyphicon glyphicon-remove" />
102+
<span class="glyphicon glyphicon-pencil" />
103+
</div></th>
104+
</tr>
105+
</table>
106106
</div>
107107

108108
<!-- Bootstrap core JavaScript

0 commit comments

Comments
 (0)