-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathform.html
121 lines (107 loc) · 4.71 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
<!DOCTYPE HTML>
<html>
<head>
<title>Contact Form</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.css">
<script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
</head>
<div class="container is-fluid">
<div class="notification">
<div class="field">
<label class="label">Name</label>
<div class="control">
<input class="input" type="text" placeholder="Text input">
</div>
</div>
<div class="field">
<label class="label">Username</label>
<div class="control has-icons-left has-icons-right">
<input class="input is-success" type="text" placeholder="Text input" value="bulma">
<span class="icon is-small is-left">
<i class="fas fa-user"></i>
</span>
<span class="icon is-small is-right">
<i class="fas fa-check"></i>
</span>
</div>
<p class="help is-success">This username is available</p>
</div>
<div class="field">
<label class="label">Email</label>
<div class="control has-icons-left has-icons-right">
<input class="input is-danger" type="email" placeholder="Email input" value="hello@">
<span class="icon is-small is-left">
<i class="fas fa-envelope"></i>
</span>
<span class="icon is-small is-right">
<i class="fas fa-exclamation-triangle"></i>
</span>
</div>
<p class="help is-danger">This email is invalid</p>
</div>
<div class="field">
<label class="label">Subject</label>
<div class="control">
<div class="select">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<label class="label">Message</label>
<div class="control">
<textarea class="textarea" placeholder="Textarea"></textarea>
</div>
</div>
<div class="field">
<div class="control">
<label class="checkbox">
<input type="checkbox">
I agree to the <a href="#">terms and conditions</a>
</label>
</div>
</div>
<div class="field">
<div class="control">
<label class="radio">
<input type="radio" name="question">
Yes
</label>
<label class="radio">
<input type="radio" name="question">
No
</label>
</div>
</div>
<div class="field is-grouped">
<div class="control">
<button class="button is-link">Submit</button>
</div>
<div class="control">
<button class="button is-text">Cancel</button>
</div>
</div>
<div class="field">
<label class="label">Label</label>
<div class="control">
<input class="input" type="text" placeholder="Text input">
<section>
<u><h1>Nos Adresses</h1></u>
<br/>
<div>
<h2>Service d'accueillantes conventionnées</h2>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2519.155683285305!2d4.336508915745785!3d50.84680127953203!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c3c475c47e2b2d%3A0x7e43c4d4318bd857!2sBoulevard+de+l'Abattoir+27%2C+1000+Bruxelles!5e0!3m2!1sfr!2sbe!4v1533559201352" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
<br/>
<div>
<h2>Halte-Acceuil l'Aquarelle</h2>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2517.733317395394!2d4.351507915746766!3d50.87313667953595!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c3c3a39b07778d%3A0x7663faa32fb3894!2sRue+du+Tivoli+45%2C+1020+Bruxelles!5e0!3m2!1sfr!2sbe!4v1533559302983" width="400" height="300" frameborder="0" style="border:50px" allowfullscreen></iframe>
</div>
</section>
</div>
</div>
</div>