Healthy-Cooking/index.html at main · Aya044/Healthy-Cooking · 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
228
229
230
231
232
233
234
235
236
<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css">
    <link rel="stylesheet" href="style.css">
    <title>Healthy Cooking</title>


</head>
<body>


    <header>
        <a href="#" class="logo"> Healthy Cooking</a>
        <nav class="navigation">
            <a href="#RECIPES"> RECIPES</a>
            <a href="#DIET">DIET </a>
            <a href="#ABOUT"> ABOUT</a>
        </nav>
    </header>


    <section class="main">
<div>
    <h2> <br><span>Healthy Cooking</span></h2>
    <h3>FOOD GUIDE</h3>

    <div class="social-icon">

    </div>
</div>
    </section >

<section style="background-color: salmon;" class="cards" id="RECIPES">
<h2 style="color: white;" class="title">Recipes For</h2>
<div class="content">
<div class="card">
<div class="icon">
    <i class="fas fa-cookie"></i>
</div>
<div class="info">
<h3>SNACKS</h3>
<p>We love healthy snacks and all these recipes will help keep you satisfied between meals</p>
</div>
</div>
<div class="card">
    <div class="icon">
        <i class="fas fa-bread-slice"></i>
    </div>
    <div class="info">
    <h3>BREAKFAST</h3>
    <p>Start your morning off with these quick, sweet and savory healthy breakfast</p>
    </div>
    </div>
    <div class="card">
        <div class="icon">
            <i class="fas fa-bowl-food"></i>
        </div>
        <div class="info">
        <h3>DINNER</h3>
        <p>
            I just love quick and easy dinners and there are so many delicious recipes you can browse through</p>
        </div>
        </div>
</div>
</section>


<section class="healthy-snacks-section">
    <div class="content">
        <h2>Healthy Snacks for Better Well-being</h2>
        <p class="healthy-snacks">
            Eating healthy snacks can help you maintain your energy levels throughout the day and keep your body nourished. Some great options include fresh fruits, vegetables with hummus, nuts, and yogurt. These snacks provide essential nutrients like vitamins, fiber, and protein, which support overall well-being. Avoiding processed, sugary snacks is key to sticking to a balanced diet. Opting for whole, natural foods is a simple way to fuel your body and stay healthy.
        </p>
    </div>
    <div class="image-container">
        <img src="images/Fruits-For-Diabetics-11-Best-Choices-For-You.jpg" alt="Healthy Snacks">
    </div>
</section>


<section class="healthy-snacks-section">
    <div class="content">
        <h2>Healthy Breakfast to Start Your Day Right</h2>
        <p class="healthy-snacks">
            A nutritious breakfast is the foundation of a productive day. Starting your morning with whole grains, fruits, and lean proteins can keep you energized and focused. Options like oatmeal with fresh berries, whole-grain toast with avocado, or a protein-packed smoothie can make for a healthy start. These choices are rich in essential vitamins and minerals to jumpstart your metabolism and keep you satisfied until lunch.
        </p>
    </div>
    <div class="image-container">
        <img src="images/breakfast.jpg" alt="Healthy Snacks">
    </div>
</section>


<section class="healthy-snacks-section">
    <div class="content">
        <h2>Healthy Dinner for a Balanced Evening Meal</h2>
        <p class="healthy-snacks">
            A healthy dinner should be balanced and not too heavy, helping your body recover overnight. Grilled vegetables, lean proteins like chicken or fish, and whole grains such as quinoa or brown rice are excellent choices. Incorporating a variety of nutrient-rich foods into your dinner ensures you get the vitamins and minerals you need while keeping your energy levels stable.
        </p>
    </div>
    <div class="image-container">
        <img src="images/1387918756116.jpeg">
    </div>
</section>


<section class="DIET" id="DIET">
<h2 class="title">DIET</h2>
<div class="content">
<div class="DIET-card">
<div class="DIET-image">
<img src="images/chicken-salad-1-378x504.jpg">
</div>
<div class="DIET-info">
<p class="DIET-category"></p>
<strong class="diet-title">
<span>Healthy Chicken Salad</span>
<a href="https://www.eatyourselfskinny.com/healthy-chicken-salad/" class="more-details"> More details</a>
</strong>
</div>
</div>
<div class="DIET-card">
    <div class="DIET-image">
    <img src="images/broccoli-salad-8-378x504.jpg">
    </div>
    <div class="DIET-info">
    <p class="DIET-category"></p>
    <strong class="diet-title">
    <span>Healthy Broccoli Salad</span>
    <a href="https://www.eatyourselfskinny.com/healthy-broccoli-salad/" class="more-details"> More details</a>
    </strong>
    </div>
    </div>

    <div class="DIET-card">
        <div class="DIET-image">
        <img src="images/ginger-soy-salmon-2-378x504.jpg">
        </div>
        <div class="DIET-info">
        <p class="DIET-category"></p>
        <strong class="diet-title">
        <span>Ginger Soya Glazed Salamon</span>
        <a href="https://www.eatyourselfskinny.com/sheet-pan-ginger-soy-glazed-salmon/" class="more-details"> More details</a>
        </strong>
        </div>
        </div>
        <div class="DIET-card">
            <div class="DIET-image">
            <img src="images/lemon-chicken-2-378x504.jpg">
            </div>
            <div class="DIET-info">
            <p class="DIET-category"></p>
            <strong class="diet-title">
            <span>Lemon Herb Griled Chicken</span>
            <a href="https://www.eatyourselfskinny.com/lemon-chicken-with-thyme/" class="more-details"> More details</a>
            </strong>
            </div>
            </div>
            <div class="DIET-card">
                <div class="DIET-image">
                <img src="images/sesame-chicken-1-378x504.jpg">
                </div>
                <div class="DIET-info">
                <p class="DIET-category"></p>
                <strong class="diet-title">
                <span>Sesame Chicken and Veggies</span>
                <a href="https://www.eatyourselfskinny.com/lemon-chicken-with-thyme/" class="more-details"> More details</a>
                </strong>
                </div>
                </div>
                <div class="DIET-card">
                    <div class="DIET-image">
                    <img src="images/sheet-pan-shrimp-111-378x504.jpg">
                    </div>
                    <div class="DIET-info">
                    <p class="DIET-category"></p>
                    <strong class="diet-title">
                    <span>Lemon Garlic Shrimp and Asparagus</span>
                    <a href="https://www.eatyourselfskinny.com/sheet-pan-lemon-garlic-shrimp-and-asparagus/" class="more-details"> More details</a>
                    </strong>
                    </div>
                    </div>
</div>
</section>

<section class="cards ABOUT" id="ABOUT">
<h2 class="title">Lets Make Our Life Better</h2>
<div class="content">
<div class="card">
<div class="icon">
    <i class="fas fa-phone"></i>
</div>
<div class="info">
    <h3>Phone</h3>
<p>01000100011</p>

</div>
</div>
<div class="card">
    <div class="icon">
        <i class="fas fa-envelope"></i>
    </div>
    <div class="info">
        <h3>Email</h3>
    <p>Aya.000@gmail.com</p>

    </div>
    </div>
</div>
</section>


<footer class="footer">
<p class="footer-title">Copyrights@<span>Healthy Cooking</span></p>
<div class="social-icon">
    <a href=""><i class="fab fa-youtube"></i></a>
    <a href=""><i class="fab fa-square-instagram"></i></a>
    <a href=""><i class="fab fa-facebook"></i></a>
        </div>
</footer>
</form>
</body>
</html>