WebDesignProject/order.php at master · nskobelevs/WebDesignProject · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Cuisine Catering | Chose your cuisine</title>
    <?php include("php/templates/head.php"); ?>

</head>
<body id="order">
<?php include("php/templates/header.php"); ?>
<main>
    <section id="header-section">
        <h1>Order</h1>
    </section>
    <section class="progress">
            <span id="number-1" class="current fa-stack number-icon">
                <span class="fa fa-circle-o fa-stack-2x"></span>
                <strong class="fa-stack-1x">1</strong>
            </span>
        <div class="line"></div>
        <span id="number-2" class="fa-stack number-icon">
                <span class="fa fa-circle-o fa-stack-2x"></span>
                <strong class="fa-stack-1x">2</strong>
            </span>
        <div class="line"></div>
        <span id="number-3" class="fa-stack number-icon">
                <span class="fa fa-circle-o fa-stack-2x"></span>
                <strong class="fa-stack-1x">3</strong>
            </span>
    </section>
    <section class="tabs">
        <section id="tab-1" class="tab current-tab">
            <h2>Pick your cuisine</h2>
            <div class="tab-content">
                <div id="american-cuisine" class="cuisine-image">
                    <h3>American</h3>
                    <i class="hidden fas fa-check"></i>
                </div>
                <div id="chinese-cuisine" class="cuisine-image">
                    <h3>Chinese</h3>
                    <i class="hidden fas fa-check"></i>
                </div>
                <div id="italian-cuisine" class="cuisine-image">
                    <h3>Italian</h3>
                    <i class="hidden fas fa-check"></i>
                </div>
                <div id="japanese-cuisine" class="cuisine-image">
                    <h3>Japanese</h3>
                    <i class="hidden fas fa-check"></i>
                </div>
            </div>
        </section>
        <section id="tab-2" class="tab">
            <h2>Pick your group size</h2>
            <div class="tab-contents">
                <form>
                    <label for="capacity">Number of people</label>
                    <input id="capacity" type="number" min="10" max="500"/>
                </form>
            </div>
        </section>
        <section id="tab-3" class="tab">
            <h2>Confirmation</h2>
            <p>Thank you for your order!</p>
        </section>
    </section>
    <span id="next-button" class="button">Next</span>
</main>

<?php include("php/templates/footer.php"); ?>
<?php include("php/templates/scripts.php"); ?>
</body>
</html>