desi_template/contact.html at main · SBouchard01/desi_template · GitHub

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
---
title: Contact
layout: default
---

<section class="section">
    <div class="container">
        <div class="content">
            <h1 class="title" data-i18n="Contact us!">Contact us!</h1>

            <div class="notification is-danger">
                <button class="delete"></button>
                <div class="content" data-i18n="disabled">
                    <p>This contact form is currently disabled.</p>
                </div>
            </div>

            <p data-i18n="Contact content">If you have any questions or need assistance, please reach out to us via the form below.</p>

            <!-- Needs to be linked with a backend framework through an API or js functions -->
            <fieldset disabled>
            <form action="/submit_contact" method="post">
                <div class="field is-horizontal">
                    <div class="field-label is-normal">
                        <label class="label" data-i18n="From">From</label>
                    </div>
                    <div class="field-body">
                        <div class="field">
                            <p class="control has-icons-left">
                                <input class="input" type="text" placeholder="Name" required>
                                <span class="icon is-small is-left">
                                    <i class="fas fa-user"></i>
                                </span>
                            </p>
                        </div>
                        <div class="field">
                            <p class="control has-icons-left has-icons-right">
                                <input class="input" type="email" placeholder="yourname@example.com" required>
                                <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-check"></i>
                                </span> -->
                            </p>
                        </div>
                    </div>
                </div>
                <div class="field is-horizontal">
                    <div class="field-label is-normal">
                        <label class="label" data-i18n="Subject">Subject</label>
                    </div>
                    <div class="field-body">
                        <div class="field">
                            <p class="control has-icons-left">
                                <input class="input" type="text" id="subject" placeholder="Subject" required>
                                <span class="icon is-small is-left">
                                    <i class="fas fa-tag"></i>
                                </span>
                            </p>
                        </div>
                    </div>
                </div>
                <div class="field is-horizontal">
                    <div class="field-label is-normal">
                        <label class="label" for="message" data-i18n="Message">Message</label>
                    </div>
                   <div class="field-body">
                        <div class="field">
                            <div class="control">
                                <textarea class="textarea" id="message" name="message" required></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="field is-horizontal">
                    <div class="field-label">
                        <!-- Left empty for spacing -->
                    </div>
                    <div class="field-body">
                        <div class="field">
                            <div class="control">
                                <button class="button is-primary is-inverted" type="submit" data-i18n="Submit">Submit</button>
                                <button class="button is-danger is-inverted" type="reset" data-i18n="Cancel">Cancel</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            </fieldset>
        </div>
    </div>
</section>