Food-Assignment/index.html at main · MdRifatchimu/Food-Assignment · 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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
<!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>Food Assignment</title>
    <link rel="stylesheet" href="style.css">
    <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=Lato:wght@300;400;700&display=swap" rel="stylesheet">
</head>

<body>
    <section class="intro">
        <div class="half-width">
            <h1><span style="color: cornflowerblue;">Eat</span> Healthy ,<br> So That You <br> Be Happy
                Always </h1>
            <br>
            <p> Imagine being fit is what you always wanted. So we are here for you to provide you the best <strong>
                    food tips</strong> and <strong> charts</strong> .</p>
            <br>
            <br>

            <a class="button" href="https://mdrifatchimu.github.io/Food-Assignment/" target="_blank"
                rel="noopener noreferrer">Order
                Food</a>

        </div>

        <div class="half-width">
            <img src="images/1st pic.png" alt="1st pic">

        </div>

    </section>

    <section class="about">

        <div class="half-width">
            <img src="images/2nd pic.png" alt="2nt pic">
        </div>

        <div class="half-width">
            <h1>About Us</h1>
            <p> We are here to help you become healthy and punctual. We have a leading food blog website. You can trust
                us without any hesitation because we won't lie to you, because we care about your health. </p>
            <br>
            <br>
            <br>

            <a class="button" href="https://github.com/MdRifatchimu/Food-Assignment" target="_blank"
                rel="noopener noreferrer">Contact Us</a>

        </div>
    </section>
    <br>
    <section class="recipe">
        <div>
            <h2 class="recipe-h2">Food Recipes</h2>

            <p class="recipe-p">Our cookbook is available now wherever books are sold! <br> More than 100 utterly
                simple,
                <br>
                crazy-delicious vegan recipes that satisfy cravings all day, everyday.
            </p>
        </div>


        <div class="container">
            <div class="recipe-card1">
                <div class="recipe-card">
                    <img src="images/food1.jpg" alt="food-pic">
                    <div>
                        <h2>Steak</h2>
                        <p>A steak is a meat generally sliced across the muscle fibers, potentially including a bone. It
                            is normally grilled, though can also be pan-fried. It is often grilled in an attempt to
                            replicate the flavor of steak cooked over the glowing coals of an open fire</p>
                    </div>
                </div>
            </div>

            <div class="recipe-card2">
                <div class="recipe-card">
                    <img src="images/food2.png" alt="food-pic">
                    <div>
                        <h2>Fruit salad</h2>
                        <p>Fruit salad is a dish consisting of various kinds of fruit, sometimes served in a liquid,
                            either their own juices or a syrup. In different forms, fruit salad can be served as an
                            appetizer, a side salad, or a dessert. </p>
                    </div>
                </div>
            </div>
            <div class="recipe-card3">
                <div class="recipe-card">
                    <img src="images/food3.png" alt="food-pic">
                    <div>
                        <h2>Vegetables</h2>
                        <p>Vegetables are parts of plants that are consumed by humans or other animals as food. The
                            original meaning is still commonly used and is applied to plants collectively to refer to
                            all edible plant matter, including the flowers, fruits, stems, leaves, roots, and seeds.</p>
                    </div>
                </div>
            </div>
        </div>

    </section>


    <section class="form">
        <br>
        <div>
            <h1 style="color: #126FF7; text-align: center;">Write Your Opinion</h1>
        </div>
        <div class="form-box">
            <form>
                <label for="name">Name</label>
                <input type="text" placeholder="Name">

                <label for="name"> Your Opinion</label>
                <textarea placeholder="Opinions On Improving Our Services or Correcting Our Blogs..." name="opinion"
                    cols="30" rows="10"></textarea>

                <input type="submit" value="Submit">
            </form>
        </div>
        <br>
    </section>

    <section class="tips">
        <div>
            <h2 class="tips-h2">Food Tips To Keep You Healthy</h2>

            <p class="tips-p">You are not hungry, You are just bored,
                <br>
                Drink a glass of water, <small>and see the </small> <strong style="color: #24a3fd;">difference</strong>
            </p>
        </div>


        <div class="container">
            <div class="tips-card1">
                <div class="tips-card">
                    <img src="images/blood.jpg" alt="tips-pic">
                    <div>
                        <h2>
                            Maintain high or low blood pressure easily
                        </h2>
                        <p>Hypertension is almost a lifelong disease. At this time, we need diet therapy to improve.
                            There are many specific diet therapy methods for hypertension. Friends don’t understand.
                            Next, I will introduce the diet therapy methods for hypertension.</p>
                    </div>
                </div>
            </div>

            <div class="tips-card2">
                <div class="tips-card">
                    <img src="images/vitamin.jpg" alt="tips-pic">
                    <div>
                        <h2> Why we need vitamin for good health </h2>
                        <p>It has been pointed out in a popular medical science article. Vitamins do not eat more and
                            more supplements, so do not take single-dose supplements, such as vitamin E, calcium
                            tablets, etc. </p>
                    </div>
                </div>
            </div>
            <div class="tips-card3">
                <div class="tips-card">
                    <img src="images/lime-water.jpg" alt="tips-pic">
                    <div>
                        <h2>
                            Simple Way To Lose Weight
                        </h2>
                        <p>Fasting is a phased process. It is necessary to know how to proceed step by step. It is also
                            important to note that fasting does not mean that you cannot eat anything during the fasting
                            period. Although the fasting process is very simple, there are many things to pay attention
                            to and taboos and they are very complicated.</p>
                    </div>
                </div>
            </div>
        </div>

    </section>

    <div class="popular">
        <h1>Our <span style="color: #126FF7;">Popularity</span></h1>
    </div>
    <section class="subscribe">

        <div class="subs-box">
            <div>
                <h1>
                    7000k
                </h1>
                <p>Youtube Subscriber</p>
            </div>

            <div>
                <h1>
                    80k
                </h1>
                <p>Instagram Followers</p>
            </div>

            <div>
                <h1>
                    900k
                </h1>
                <p>Facebook like</p>
            </div>

        </div>

    </section>
    <br>
    <br>
    <footer>
        <h1 class="footer"><span style="color: rgb(253, 187, 63);">Food</span><span style="color:rgb(195, 211, 231);">
                Valley</span>
        </h1>
        <p><span style="color: honeydew;"> Let food be thy medicine, thy medicine shall be thy food</span></p>
        <span style="color: ivory;"> <small>@All Right Reserved </small> </span>
    </footer>
</body>

</html>