-
Notifications
You must be signed in to change notification settings - Fork 0
/
form.html
137 lines (110 loc) · 5.06 KB
/
form.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="./css/main.css" rel="stylesheet">
<title>Form</title>
</head>
<body>
<br>
<form class="px-2 py-2 add-post-form" name="newPostForm">
<h2 >New Article Info</h2>
<hr>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="select-type">Type of article</label>
<select class="form-control input" name="type" id="select-type" placeholder="Choose type" required >
<option value="0">Video</option>
<option value="1">Audio</option>
<option value="2">Text</option>
</select>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="url">Image(url)</label>
<input class="form-control input" type="text" name="urlimage" id="url" placeholder="Add image">
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="title">Title</label>
<input class="form-control input" type="text" name="title" id="title" placeholder="Add title( Start with capital letter)" maxlength="20" minlength="2" required>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="author">Author</label>
<input class="form-control input" type="text" name="author" id="author" placeholder="Add author" maxlength="20" minlength="2"required>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="url-author">Photo(url)</label>
<input class="form-control input" type="text" name="urlauthor" id="url-author" placeholder="Add author`s photo" required>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="date">Post date</label>
<input class="form-control input" type="date" name="date" id="date" placeholder="Add date of post" required>
</div>
</div>
<div class="row info" >
<ul class="list-group mx-3 text-center text-warning">
<li class="list-group-item ">Start paragraph - 'p/'</li>
<li class="list-group-item ">End paragraph - '/p'</li>
<li class="list-group-item ">Start title - 't/'</li>
<li class="list-group-item ">End title - '/t'</li>
</ul>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="post">Description</label>
<textarea class="form-control textarea" type="text" name="text" id="post" placeholder="Write post" rows="10" cols="10" maxlength="1000" minlength="5" required></textarea>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="post">Quote</label>
<textarea class="form-control textarea" type="text" name="quote" id="quote" placeholder="Write quote" rows="5" cols="10" maxlength="100" minlength="5" required></textarea>
</div>
</div>
<div class="row mb-4">
<div class="col d-flex align-items-center">
<label class="mr-3 w-25" for="time">Reading time</label>
<select name="time" id="time"required>
<option value="5 min read">5 min </option>
<option value="7 min read">7 min </option>
<option value="10 min read">10 min </option>
<option value="15 min read">15 min </option>
</select>
</div>
</div>
<div class="row buttons">
<input type="submit" name="submit-btn" class="btn btn-dark button save " placeholder="Save">
<button name="cancel-btn" class="btn btn-dark button cancel">
<a href="index.html">Cancel</a>
</button>
</div>
</form>
<footer>
<div class="container">
<div class="row">
<div class="footer-box">
<div class="footer-box__icons">
<img class="icon" src="icons_first_page/a-icon-facebook.svg">
<img class="icon" src="icons_first_page/a-icon-instagram.svg">
<img class="icon" src="icons_first_page/a-icon-dribbble.svg">
</div>
<div class="logo">BlogWorld</div>
<div class="footer-box__c">
©2019 All Rights Reserved.
</div>
</div>
</div>
</div>
</footer>
</body>
<script type="module" src="js/Form/form.js"></script>
</html>