-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
187 lines (176 loc) · 9.64 KB
/
index.html
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
<!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>Gordon-Ramsay-Biography
</title>
<!-- google fonts -->
<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=Dancing+Script:wght@400;500;600;700&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;500;600;700&display=swap"
rel="stylesheet">
<!-- external style -->
<link rel="stylesheet" href="style.css" />
<!-- fontawsome -->
<script src="https://kit.fontawesome.com/8684e53235.js" crossorigin="anonymous"></script>
<!-- scripts -->
<script src="main.js" defer></script>
</head>
<body>
<!-- Asidebar Nav-->
<!-- <aside id="aside-nav">
<div class="aside--nav__content">
<img src="./img/chef-logo.svg" alt="side Navbar logo" class="aside--nav__content__logo" loading="lazy">
<nav class="aside-nav__content__nav" role="side nav">
<ul class="aside--nav__content__nav--social">
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
<li><a href="#"><i class="fab fa-dribbble"></i></a></li>
<li><a href="#"><i class="fa-brands fa-pinterest"></i></a></li>
</ul>
</nav>
</div>
</aside> -->
<!-- Main Content -->
<main>
<header id="header">
<div class="primary-nav-container">
<img src="./img/chef-logo.svg" alt="side Navbar logo" class="aside--nav__content__logo" loading="lazy">
<!-- hamburger icon -->
<div class="header__primary-nav--hamburger">
<div class="line line-1"></div>
<div class="line line-2"></div>
<div class="line line-3"></div>
</div>
<!-- Primary Nav -->
<nav id="header__primary-nav">
<ul class="header__primary-nav-links">
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">Home</a></li>
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">About</a></li>
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">Recipes</a></li>
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">Services</a></li>
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">Qoutes</a></li>
<li class="header__primary-nav-links--link-item"><a href="#"
class="header__primary-nav--nav-link">Contact</a></li>
</ul>
</nav>
</div>
</header>
<!-- hero section -->
<section id="show-case">
<h1 class="show-case__word">I am what I am. A fighter</h1>
<div class="show-case__content">
<h1 class="show-case__content-title"> Gordon Ramsay
</h1>
<p class="show-case__content--bio">Gordon James Ramsay OBE is a British chef,
restaurateur, television personality and
writer.
</p>
<a href="#" class="show-case__content--link">Read More →
</a>
</div>
</section>
<!-- About me section -->
<section id="about-chef">
<div class="about-chef__img">
<img src="./img/Dishes/aboutMe.jpg" alt="Gorden Ramzy" />
</div>
<div class="about-chef__content">
<h2 class="about-chef__content--header"> Gordon Ramsay</h2>
<p class="about-chef__content--description">Gordon James Ramsay ( born 8 November 1966) is a British
chef, restaurateur, television personality and writer. His restaurant group, Gordon Ramsay Restaurants, was founded in 1997 and has been awarded 17
Michelin stars overall; it currently holds a total of seven.His signature restaurant, Restaurant Gordon Ramsay in
Chelsea,London, has held three Michelin stars since 2001.After rising to fame on the British television
miniseries Boiling Point in 1999, Ramsay became one of the best-known and most influential chefs in the world</p>
<a href="#" class="about-chef__content--link">Read More</a>
</div>
</section>
<!-- work section -->
<section id="work">
<div class="work__card">
<img src="./img/Dishes/California-fried-chicken-sandwich.png" alt="recipe" class="recipe__image"loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">CALIFORNIA ‘FRIED’ CHICKEN SANDWICH
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
<div class="work__card">
<img src="./img/Dishes/CroppedFocusedImage.jpg" alt="recipe" class="recipe__image" loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">TEXAS HANGER STEAK TACOS WITH PICO DE GALLO FROM RAMSAY AROUND THE WORLD
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
<div class="work__card">
<img src="./img/Dishes/FruitsCake.png" alt="recipe" class="recipe__image"loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">MELTED BRIE TOAST WITH MACERATED BERRIES
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
<div class="work__card">
<img src="./img/Dishes/KingCake.jpg" alt="recipe" class="recipe__image"loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">MINI KING CAKE STACK WITH MAPLE PECAN GLAZE
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
<div class="work__card">
<img src="./img/Dishes/Lean-MACHINE-chicken-skewers.jpg" alt="recipe" class="recipe__image"loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">PIMENTO DIP
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
<div class="work__card">
<img src="./img/Dishes/Mushroomtoast.jpg" alt="recipe" class="recipe__image"loading="lazy" />
<section id="recipe">
<h2 class="recipe__name">PUERTO RICAN STYLE STEAK SANDWICH FROM RAMSAY AROUND THE WORLD
</h2>
<p class="recipe__description">
Recipes extracted from Gordon Ramsay’s Ultimate Fit Food by Gordon Ramsay, published by Hodder &
Stoughton,
</p>
</section>
</div>
</section>
<section>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod debitis dolores error adipisci qui et placeat voluptatum ullam illum. Ducimus iure placeat dolores reprehenderit laudantium, eos minima et quo possimus?
Fuga, neque vel asperiores est amet at culpa aliquid distinctio provident. Doloribus quaerat alias, deleniti nobis quia culpa inventore illo fugiat asperiores possimus corporis, harum, vel mollitia tempore placeat quae?
Voluptatem cum beatae quaerat, ut iste architecto reprehenderit rem sit quo facilis! Quasi corporis ut, dolore corrupti obcaecati reprehenderit magnam, iste ratione hic tempora exercitationem ipsum? Deleniti molestiae unde corrupti.</p>
</section>
</main>
</body>
</html>