-
Notifications
You must be signed in to change notification settings - Fork 0
/
verbrauch.html
157 lines (130 loc) · 8.43 KB
/
verbrauch.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
<!DOCTYPE html>
<html lang="de">
<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>Global Coffee Hub</title>
<!-- BOOTSTRAP CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<!-- BOOTSTRAP JS -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous">
</script>
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Lexend+Deca&family=Noto+Sans+TC&display=swap" rel="stylesheet">
<!--Google Icons-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Leaflet CSS -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
crossorigin=""/>
<!-- Leaflet JS -->
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
crossorigin=""></script>
<!-- Leaflet Providers Plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.12.0/leaflet-providers.min.js"
integrity="sha512-LixflAm9c0/qONbz9F1Ept+QJ6QBpb7wUlPuyv1EHloTVgwSK8j3yMV3elnElGQcv7Y5QTFlF/FqyeE/N4LnKQ=="
crossorigin="anonymous"></script>
<!-- Costum CSS -->
<link rel="stylesheet" href="costum.css">
<!-- Eigene Main JS -->
<script defer src="main.js"></script>
</head>
</head>
<body>
<nav class="navbar navbar-expand-md navbackgrounddark navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="https://globalcoffeehub.github.io/">
<div id=logocontainer><img src="images/cup-149682.svg" alt="" width="100%" ></div>
<span class="p-1" id="websitetitle">Global Coffee Hub</span>
</a>
<!-- Toggler/collapsibe Button -->
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Navbar links -->
<div class="collapse navbar-collapse justify-content-end" id="navbarToggleExternalContent">
<ul class="navbar-nav">
<li class="nav-item" id="hovernavitem">
<a class="nav-link" x href="/index.html">Start</a>
</li>
<li class="nav-item" id="activehover">
<a class="nav-link" x href="/verbrauch.html">Verbrauch</a>
</li>
<li class="nav-item" id="hovernavitem">
<a class="nav-link" href="/export.html">Export</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container-xl pt-5">
<div class="row">
<div class="col-xl-9 ">
<img src="images/coffeebeans.jpg" width="100%" class="mx-auto d--block">
<figcaption class="figure-caption"><a href="https://pixabay.com/de/users/negative-space-2379030/?utm_source=link-attribution&utm_medium=referral&utm_campaign=image&utm_content=1324126">Negative-Space</a> auf <a href="https://pixabay.com/de/?utm_source=link-attribution&utm_medium=referral&utm_campaign=image&utm_content=1324126">Pixabay</a></figcaption>
<h1 class="pt-4 pb-2"> Wo kann man nicht ohne Kaffee?</h1>
<p class="lead">
Kaffee ist eines der beliebtesten Heißgetränke der Welt. Vor allem im Globalen Norden wird sehr viel Kaffee konsumiert.
So ist Spitzenreiter im Kaffeekonsum Finnland, gefolgt von den Niederlanden und Schweden. Aber auch auf der restlichen Welt,
vor allem im asiatischen Raum, wo traditionell eher Tee getrunken wird, steigt der Kaffeekonsum. Quelle: <a href="https://www.handpresso.com/de/blog/einige-daten-zum-weltweiten-kaffeekonsum-n84">handpresso.com</a> </p>
<p>
Das Wort Kaffee kommt aus dem Arabischen und bedeutet so viel wie "anregendes Getränk". "Kaffee" ist an den Ort Kaffa in Äthiopien angelehnt, von dem aus der Kaffee sich weltweit verbreitete.
Zuerst im Osmanischen Reich, von dort dann nach Europa, vor allem Paris, Venedig und London.
Von Afrika aus verbreitete sich die Pflanze nach Südamerika, wo Brasilien mittlerweile zum größten Kaffeeproduzent der Welt geworden ist.
Erst ein Getränk, dass sich wie Kakao nur die Reichsten leisten konnten, ist Kaffee heutzutage ein erschwingliches globales Getränk geworden. Quelle: <a href="https://www.die-kaffeeseite.de/kaffeeverbrauch.php">die-kaffeeseite.de</a>. </p>
<p>
Kaffee soll außerdem gesundheitsfördernde Eigenschaften besitzen, was gemeinhin auf das Enthalten von Antioxidanten zurückzuführen sei. Quelle: <a href="https://www.brandeins.de/corporate-publishing/kaffee-in-zahlen/kaffee-in-zahlen-2015/wie-wirkt-kaffee-im-koerper">brandeins.de</a>. </p>
<!-- Die Map -->
<div id="mapid"></div>
</div>
<div class="col-xl-3">
<!-- Akkordion -->
<div class="accordion" id="accordionExample">
<div class="accordion-item dashedborder">
<h3 class="accordion-header" id="headingOne">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
<strong>Wasserverbrauch für eine Tasse Kaffee:</strong>
</button>
</h3>
<div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
Circa 140 Liter virtuelles Wasser! <a href="https://www.sueddeutsche.de/wissen/der-wasser-fussabdruck-140-liter-fuer-eine-tasse-kaffee-1.913295">sz.de</a>
</div>
</div>
</div>
<div class="accordion-item dashedborder">
<h3 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
<strong> Lohn eines Kaffeebauern:</strong>
</button>
</h3>
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
<div class="accordion-body">
Umgerechnet nur etwa 50€ im Monat! <a href="https://https://taz.de/Kaffee-und-die-ungerechte-Weltordnung/!5565350/">taz.de</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-sm navbar-light upborder mt-5 sticky-bottom">
<div class="container-fluid">
<a href="#"><span class="material-icons md-48">arrow_upward</span></a>
<ul class="navbar-nav">
<li class="nav-item">
<p class="nav-link disabled" disabled>2021</p>
</li>
<li class="nav-item">
<p class="nav-link disabled" disabled>Benzinger Marlene, Haring Marcel, Vossbeck Karolin</p>
</li>
</ul>
</div>
</nav>
</body>
</html>