oc-project3/index.html at main · Riccardo911/oc-project3 · 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
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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Ohmyfood</title>
    <link href="css/style1.css" rel="stylesheet" type="text/css" />
    <script src="https://kit.fontawesome.com/9a7786a750.js" crossorigin="anonymous"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap" rel="stylesheet">
    <!-- Shrikhand font-->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital@1&family=Roboto:wght@100;300;400&family=Shrikhand&display=swap" rel="stylesheet">
</head>
<body>
    <!-- Loader -->
    <div class="loader-wrapper">
        <span class="loader"><span class="loader-inner"></span></span>
    </div>
    <header class="border">
        <div class="logo center border">
            <img alt="ohmyfood" src="images/logo/ohmyfood.png">
        </div>
    </header>
    <main class="border">
        <section>
            <div class="location border">
                <div class="location__box center border">
                    <div class="location__icon border">
                    <i class="fas fa-map-marker-alt"></i></div>
                    <div class="location__text border center font-0">Paris, Belleville</div>
                </div>
            </div>
            <div class="title-0-box center font-0 border"><b>Book the menu you like</b></div>
            <div class="sub-title-box border">
                <div class="sub-title-box__text font-0 center border">Discover top-of-the-art restaurants we picked for you</div>
            </div>
            <div class="explore-button-box center border">
                <button type="button"><b>Explore our restaurants</b></button>
            </div>
            <div class="title-1 border font-0"><b>How it works</b></div>
            <div class="instruction border">
                <div class="inst-box shadow border">
                    <div class="number border center font-0">1</div>
                    <div class="inst-box__icon center border">
                        <i class="fas fa-mobile-alt"></i>
                    </div>
                    <div class="inst-box__text border font-0"><b>Chose a restaurant</b></div>
                </div>
                <div class="inst-box shadow">
                    <div class="number border center font-0">2</div>
                    <div class="inst-box__icon center border">
                        <i class="fas fa-bars"></i>
                    </div>
                    <div class="inst-box__text border font-0"><b>Create a menu</b></div>
                </div>
                <div class="inst-box shadow">
                    <div class="number border center font-0">3</div>
                    <div class="inst-box__icon center ">
                        <i class="fas fa-store"></i>
                    </div>
                    <div class="inst-box__text border font-0"><b>Go enjoy it at the restaurants</b></div>
                </div>
            </div>
        </section>
        <section class="cards">
            <div class="title-2 border font-0"><b>Restaurants</b></div>
            <div class="cards-section border">
                <div class="box shadow border">
                    <a href="./full_palette.html">
                    <div class="box__dish-photo border">
                        <img alt="image" src="images/restaurants/1.jpg">
                        <div class="new font-0 center border">New</div>
                    </div>
                    </a>
                    <div class="box__heading border">
                        <div class="box__heading__description">
                            <div class="dish-photo-text font-0 border"><b>The Full Palette</b></div>
                            <div class="location-text font-0 border">New York</div>
                        </div>
                        <div class="favorite border">
                            <i class="far fa-heart open-heart"></i>
                            <i class="fas fa-heart full-heart"></i>
                        </div>
                    </div>
                </div>
                <div class="box shadow border">
                    <a href="./enchanted_plate.html">
                    <div class="box__dish-photo border">
                        <img alt="image" src="images/restaurants/2.jpg">
                        <div class="new font-0 center border">New</div>
                    </div>
                    </a>
                    <div class="box__heading border">
                        <div class="box__heading__description">
                            <div class="dish-photo-text font-0 border"><b>The Enchanted Plate</b></div>
                            <div class="location-text font-0 border">New York</div>
                        </div>
                        <div class="favorite border">
                            <i class="far fa-heart open-heart"></i>
                            <i class="fas fa-heart full-heart"></i>
                        </div>
                    </div>
                </div>
                <div class="box shadow border">
                    <a href="./bastille.html">
                    <div class="box__dish-photo border">
                        <img alt="image" src="images/restaurants/3.jpg">
                        <!--<div class="new font-0 center border">New</div>-->
                    </div>
                    </a>
                    <div class="box__heading border">
                        <div class="box__heading__description border">
                            <div class="dish-photo-text font-0 border"><b>Bastille</b></div>
                            <div class="location-text font-0 border">New York</div>
                        </div>
                        <div class="favorite border">
                            <i class="far fa-heart open-heart"></i>
                            <i class="fas fa-heart full-heart"></i>
                        </div>
                    </div>
                </div>
                <div class="box shadow border">
                    <a href="./gourmand.html">
                    <div class="box__dish-photo border">
                        <img alt="image" src="images/restaurants/4.jpg">
                        <!--<div class="new font-0 center border">New</div>-->
                    </div>
                    </a>
                    <div class="box__heading border">
                        <div class="box__heading__description border">
                            <div class="dish-photo-text font-0 border"><b>Le Gourmand</b></div>
                            <div class="location-text font-0 border">New York</div>
                        </div>
                        <div class="favorite border">
                            <i class="far fa-heart open-heart"></i>
                            <i class="fas fa-heart full-heart"></i>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </main>
    <footer>
        <div class="logo-footer font-1 border">ohmyfood</div>
        <div class="row-fot border">
            <div class="row-fot__icon center border">
                <i class="fas fa-utensils"></i>
            </div>
            <div class="row-fot__text font-0 border">Suggest a restaurant</div>
        </div>
        <div class="row-fot border">
            <div class="row-fot__icon center border">
                <i class="fas fa-hands-helping"></i>
            </div>
            <div class="row-fot__text font-0 border">Become a partner</div>
        </div>
        <div class="row-fot border">
            <div class="row-fot__text1 font-0 border">Legal</div>
        </div>
        <div class="row-fot border">
            <a href="mailto:info@ohmyfood.com">
            <div class="row-fot__text1 font-0 border">Contact</div>
            </a>
        </div>
    </footer>
</body>
</html>