-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathwebpage.html
250 lines (245 loc) · 9.91 KB
/
webpage.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
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
237
238
239
240
241
242
243
244
245
246
247
248
249
250
<!DOCTYPE html>
<html>
<head>
<!--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=Open+Sans:wght@300&display=swap" rel="stylesheet">
<!---META DATA FOR WEBSITE WHICH INCLUDES THE AUTHOR INFO ETC -->
<meta charset="utf-8">
<title>TOP 10 food you must try</title>
<style>
/*Navbar contents*/
#HOME{
display: flex;
justify-content: end;
border: 1px solid black;
padding: 100px 100px 100px 100px ;
}
#contacts_navbar{
background-color: rgb(17, 17, 35);
display: flex;
justify-content: start;
border: 1px solid black;
border-radius: 2px;
}
/*Semantics*/
nav{
text-transform: uppercase ;
font-family: "Balto",Helvetica, sans-serif;
border: 2px solid black;
padding: 10px;
margin-left: 100px;
width: 2300px;
background-color: coral;
display: flex;
justify-content: center
}
#button_div{
display: flex;
justify-content: end;
padding-right: 20px;
padding-bottom: 20px;
}
#contact{
border-radius: 10px;
box-shadow: 1px blue;
color: blue;
}
footer{
background-color:aqua ;
}
body{
background-image:url("https://img.freepik.com/free-vector/abstract-light-textured-grunge-web-background-vector_532963-1887.jpg?w=2000");
background-size: cover;
}
h1{
text-shadow: 1px 1px red;
text-align: center;
font-family: 'Open Sans', sans-serif;
}
header{
margin-left: 100px;
width: 2300px;
border: 2px solid black;
border-radius: 2px;
background-color: cornsilk;
padding: 10px;
}
article{
background-color: cornsilk;
background-image:url();
border: 2px solid black;
border-radius: 2px;
margin: 0px 100px 100px 100px ;
}
/*titles*/
.sushi{
text-align: center;
font-size: xx-large;
font-family: 'Open Sans', sans-serif;
color: tomato;
}
/*Pictures*/
#hyper_link{
border: 1px solid black;
display: flex;
}
#bakalava_photo{
height: 600px;
}
#manti_photo{
height: 600px;
}
#sushi_picture{
height: 600px;
}
#Bilberries_image{
height: 600px;
}
#Bilberries_image_2{
height: 600px;
}
#sushi_picture_2{
height: 600px;
}
/*TEXT and buttons */
button {
padding: 15px 25px;
border: unset;
border-radius: 15px;
color: #212121;
z-index: 1;
background: #e8e8e8;
position: relative;
font-weight: 1000;
font-size: 17px;
-webkit-box-shadow: 4px 8px 19px -3px rgba(0,0,0,0.27);
box-shadow: 4px 8px 19px -3px rgba(0,0,0,0.27);
transition: all 250ms;
overflow: hidden;
}
button::before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 0;
border-radius: 15px;
background-color: #212121;
z-index: -1;
-webkit-box-shadow: 4px 8px 19px -3px rgba(0,0,0,0.27);
box-shadow: 4px 8px 19px -3px rgba(0,0,0,0.27);
transition: all 250ms
}
button:hover {
color: #e8e8e8;
}
button:hover::before {
width: 100%;
}
._text{
font-family: 'Open Sans', sans-serif;
font-size: larger;
text-align: left;
}
/*Table Data */
table,th,td,tr{
margin: 10px 10px 10px 800px;
border: solid black 1px;
font-family: 'Open Sans', sans-serif;
}
</style>
</head>
<body>
<header>
<h1>Top 10 foods you must try</h1>
</header>
<nav>
<div id="contacts_navbar" >
<a>contacts</a>
</div>
<div id="Recipes_Navbar">
<a>Recipes</a>
</div>
<div>
<a id="#">HOME</a>
</div>
</nav>
<article>
<!--SUSHI ARTICLE-->
<h2 class="sushi">Sushi</h2>
<img id="sushi_picture" src="https://cdn.pixabay.com/photo/2018/08/03/08/33/food-3581341_1280.jpg" alt="sushi picture">
<img id="sushi_picture_2" src="https://cdn.pixabay.com/photo/2017/10/15/11/41/sushi-2853382_1280.jpg" alt="sushi picture"><br>
<p class="_text">Prepared with vinegared rice and a wide range of ingredients including seafood, vegetables,
and sometimes fruits. Sushi tastes best when served with wasabi, pickled ginger, and soy sauce.
A popular garnish for this dish is Daikon radish. The type of fish in it defines a sushi's taste.
However, the vinegared rice gives the dish a tangy taste overall. Tuna, eel, and Salmon tend
to have a light flavour while octopus flavoured sushi is generally strong in taste.</p>
<!--BİLBERRİ ARTİCLE-->
<h2 class="sushi">2-Bilberries</h2>
<img id="Bilberries_image" src="https://img.freepik.com/free-photo/fresh-blueberries-background-top-view-macro-texture-blueberry-berries-with-water-drops_132254-833.jpg?w=2000">
<img id="Bilberries_image_2" src="https://img.freepik.com/free-photo/blueberry_74190-7867.jpg?t=st=1650628213~exp=1650628813~hmac=944a5eba79a5e85f74739ce76fa16047733ec8b43b3ba8520a05f8c95ca03a24&w=2000">
<p class="_text">Like most berries, bilberries are a nutrient-rich fruit.
With a nutritional profile resembling that of blueberries, they are commonly known as European blueberriesBilberries are rich in antioxidants,
which are beneficial plant compounds that help protect your body against damage and disease.
</p>
<!--Table Data for Bilberrie nutriton-->
<table>
<tr>
<th>fruit</th>
<th>magnesium</th>
<th>vitamin C</th>
<th>vitamin K</th>
</tr>
<tr>
<td>blueberries</td>
<td>25% of the RDI</td>
<td>36% of the RDI</td>
<td>36% of the RDI</td>
</tr>
<tr>
<td>carrot</td>
<td>22% of the RDI</td>
<td>10% of The RDI</td>
<td>1% of the RDI</td>
</tr>
</table>
<!--MANTI article -->
<h2 class="sushi">3-Mantı</h2>
<img id="manti_photo" alt="manti_photo" src="https://thumbs.dreamstime.com/z/turkish-manti-isolated-white-40533749.jpg">
<p class="_text">Often called Turkish ravioli, mantı is a hot dish served with cold yogurt and garlic. You can think of mantı as some kind of dumplings consisting of the dough and its filling.
In the classical Anatolian (Kayseri) style, the dough is made of water, flour and salt. Some add eggs to increase the flavor. The thinner the dough and the smaller the wrapped pieces are,
the more masterful the cook is. The filling contains grounded beef or lamb, onion, salt and pepper.
</p>
<!--BAKLAVA ARTICLE-->
<h2 id="sushi">4-Baklava</h2>
<img id="baklava_photo" src="https://as2.ftcdn.net/v2/jpg/02/87/66/71/1000_F_287667152_On2JMQVUX2rQZ2BS5gbjGSWLBh8b3NGI.jpg">
<p class="_text">Baklava is a layered pastry dessert made of filo pastry, filled with chopped nuts, and sweetened with syrup or honey. It was one of the most popular sweet pastries of Ottoman cuisine.</p>
<div id="hyper_link">
<a><img src="https://upload.wikimedia.org/wikipedia/commons/c/cb/Little_Hagia_Sophia.JPG" alt="Hagia_sophia"></a>
<p class="_text">
Küçük Ayasofya Camii, İstanbul'un Küçük Ayasofya semtindeki cami. Bizans (Doğu Roma) İmparatoru I. Justinianus ve karısı Theodora tarafından 527-536 yılları arasında Aya Sergios ve Bachos Kilisesi
(Yunanca: Eκκλησία τῶν Άγίων Σεργίου καί Βάκχου ὲν τοῖς Ὸρμίσδου) adıyla yaptırılan kilise 1497'de sultan II. Beyazıt Topkapı Sarayı Darüssaade ağası Hüseyin Ağa döneminde camiye çevrilmiştir.
Temelinde 3 metreye 1,8 metrelik blok taşlar kullanılmıştır. 8 köşeli ana kubbesi bulunmaktadır. İstanbul'un en eski Bizans Dönemi yapısı olarak bilinir. Bahçesinin güney kısmında 24 odalı geniş bir bahçesi ve ortasında şadırvanı olan Hüseyin Ağa Medresesi yer alır.
Medrese Yesevi Vakfı tarafından restore edilmiş ve Türk el sanatlarının hizmetine verilmiştir. Yakınında Kesikbaş Hüseyin Ağa türbesi yer alır.
Yapı 1836 ve 1956 yıllarında iki onarım görmüş, muhtelif kurşun ve sıvaları yenilenmiş, tek minaresi önemli ölçüde onarılmıştır.
Söylencelere göre kilise ismini I. Anastasius'un Doğa Roma İmparatoru olduğu zamanda gerçekleşen bir olaydan alır. I. Anastasius devrinde imparatora karşı bir toplumsal ayaklanma gerçekleşir ve bu isyana I. Justinianus'un da adı karışır.
Bunun üzerine, I. Justinianus imparator tarafından idam cezasına çarptırılır mamafih hükümün gerçekleşeceği sabahtan önceki gece Aziz Sergius ve Aziz Bacchus imparator I. Anastasius'un rüyasına girerler ve I. Justinianus'un lehinde tanıklık ederler. Bu rüya yahut görü imparatora, verilen hükmün hakkaniyeti üzerine tekrar düşünmesine sebebiyet verecek derecede tesir eder.
I. Anastasius verdiği karardan vazgeçerek I. Justinianus'u bağışlar. I. Justinianus tahta çıktıktan sonra, I. Anastasius tarafından hayatının bağışlanması kararına mucip olan Azizlere şükran borcunu ödemek için bir adak kilisesi olarak Aziz Sergius ve Aziz Bacchus adına halihazırda Küçük Ayasofya Camii olarak hizmet veren kiliseyi inşa ettirir.[1]
</p>
</div>
<fieldset>
<legend>Personalia:</legend>
Name: <input type="text"><br>
Email: <input type="text"><br>
Date of birth: <input type="text">
</fieldset>
<p class="text-flicker-in-glow">FUCK YOU FUCK YOU </p>
<div id="button_div">
<button>subscribe</button>
</div>
</article>
</body>
</html>