latest changes
This commit is contained in:
Sebastian Wendel
parent
37669334e7
commit
16718d1767
|
|
@ -2,6 +2,11 @@
|
|||
|
||||
This repository serves as a portfolio of my progress and learning journey through the Full-Stack Development Course at the Hamburg Coding School. The exercises included here cover various aspects of HTML and CSS, ranging from basic syntax to more advanced concepts such as responsive design and CSS frameworks.
|
||||
|
||||
## Disclamer
|
||||
|
||||
All information and code provided in this repository are for educational and research purposes only. I do not guarantee the accuracy of the information provided, and I am not liable for any damages or losses that may result from the use of this information.
|
||||
|
||||
|
||||
## License
|
||||
|
||||
This repository is licensed under the [MIT License](./LICENSE). You are free to use, modify, or distribute the code as per the terms of the license.
|
||||
207
css/mains.css
207
css/mains.css
|
|
@ -1,47 +1,170 @@
|
|||
@font-face {
|
||||
font-family: Roboto;
|
||||
src: url("/fonts/Roboto-Regular.woff2") format("woff2");
|
||||
}
|
||||
|
||||
body {
|
||||
margin: auto;
|
||||
max-width: 1100px;
|
||||
font-family: "Roboto", sans-serif;
|
||||
|
||||
}
|
||||
|
||||
.menu {
|
||||
text-align: right;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
.menu a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.menu a::after {
|
||||
content: '|';
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.menu a:hover {
|
||||
text-decoration: underline overline;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
h1 h2 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.info {
|
||||
font-size: 12px;
|
||||
color: #9b9b9b;
|
||||
}
|
||||
|
||||
.images {
|
||||
display: block;
|
||||
max-width: 1060px;
|
||||
background-color: rgb(241, 239, 237);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
nav {
|
||||
background-color: rgb(230, 68, 21);
|
||||
padding-left: 50px;
|
||||
padding-top: 28px;
|
||||
padding-bottom: 28px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 44px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin-top: 0;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
color: #e64415;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.source {
|
||||
color: #807e7c;
|
||||
}
|
||||
|
||||
.timestamp {
|
||||
color: #807e7c;
|
||||
}
|
||||
|
||||
.timereading {
|
||||
background-color: rgb(233, 241, 245);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.content {
|
||||
background-color: #fff;
|
||||
padding: 50px;
|
||||
}
|
||||
|
||||
.socials {
|
||||
color: black;
|
||||
border-top: 1px dashed #000;
|
||||
border-bottom: 1px dashed #000;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.socials li {
|
||||
margin-inline: 15px;
|
||||
}
|
||||
|
||||
.socials li:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #e64415;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
p a::after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-left: 5px;
|
||||
background-size: 12px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("/images/externallink.svg");
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: rgb(47, 45, 43);
|
||||
}
|
||||
|
||||
.more ul {
|
||||
border-top: 1px dashed #000;
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.more li {
|
||||
border-bottom: 1px dashed #000;
|
||||
}
|
||||
|
||||
.more>h3 {
|
||||
font-size: 20px;
|
||||
color: #e64415;
|
||||
}
|
||||
|
||||
.more a {
|
||||
text-decoration: none;
|
||||
font-size: calc(1em - 2px);
|
||||
font-weight: bold;
|
||||
color: black;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.more img {
|
||||
height: auto;
|
||||
margin: 50px;
|
||||
}
|
||||
|
||||
.about ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.about li {
|
||||
border: rgb(221, 219, 217) 1px solid;
|
||||
}
|
||||
|
||||
.about>h3 {
|
||||
font-size: 20px;
|
||||
color: #e64415;
|
||||
}
|
||||
|
||||
.about a {
|
||||
text-decoration: none;
|
||||
font-size: calc(1em - 2px);
|
||||
color: black;
|
||||
/* display: flex; */
|
||||
/* align-items: center; */
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.about img {
|
||||
height: auto;
|
||||
margin: 50px;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: rgb(47, 45, 43);
|
||||
align-items: center;
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: #bbb9b7;
|
||||
font-size: 12px;
|
||||
padding: 20px;
|
||||
margin: 0;
|
||||
justify-content: space-between;
|
||||
margin-inline: 10px;
|
||||
}
|
||||
|
|
@ -1,202 +0,0 @@
|
|||
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
Binary file not shown.
BIN
images/a380.jpg
BIN
images/a380.jpg
Binary file not shown.
|
Before Width: | Height: | Size: 56 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
BIN
images/article1.webp
Normal file
BIN
images/article1.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
images/article2.webp
Normal file
BIN
images/article2.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
images/article3.webp
Normal file
BIN
images/article3.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
7
images/copylink.svg
Normal file
7
images/copylink.svg
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<svg id="spon-copylink-xl" class="stroke-current" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<g id="xl-copylink-c638ac99-1953-4c8c-b10a-25b606e7a827" stroke-width="1.1" stroke-linecap="round">
|
||||
<path id="rectangle-c638ac99-1953-4c8c-b10a-25b606e7a827" d="M14.47 17.3s.945.944-.1 1.989l-2.137 2.137a3.5 3.5 0 01-4.95 0l-.354-.354-.354-.354a3.5 3.5 0 010-4.95l2.137-2.137c1.045-1.045 1.987-.102 1.987-.102" stroke-miterlimit="10"></path>
|
||||
<path id="rectangle_2-c638ac99-1953-4c8c-b10a-25b606e7a827" d="M17.299 14.471s.944.945 1.989-.1l2.137-2.137a3.5 3.5 0 000-4.95l-.354-.354-.354-.354a3.5 3.5 0 00-4.95 0L13.63 8.713c-1.045 1.045-.102 1.987-.102 1.987" stroke-miterlimit="10"></path>
|
||||
<path id="vector-c638ac99-1953-4c8c-b10a-25b606e7a827" d="M10.293 17.707l7.414-7.414"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 918 B |
5
images/envelop.svg
Normal file
5
images/envelop.svg
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<svg id="spon-mail-xl" class="stroke-current" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<g id="xl-mail-3a07eae2-03ff-42e8-80e3-64669d47fb3f">
|
||||
<path id="rectangle-3a07eae2-03ff-42e8-80e3-64669d47fb3f" d="M4.5 6.5h19m-19 0v15m0-15l6.5 7m12.5-7v15m0-15l-6.5 7m6.5 8h-19m19 0l-6.5-8m-12.5 8l6.5-8m0 0l3 2.833 3-2.833" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 494 B |
4
images/externallink.svg
Normal file
4
images/externallink.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="14" height="20" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<path class="stroke-current" d="M5 5.5H.5v11h11V12M9 3.5h4.5V8"></path>
|
||||
<path class="stroke-current" d="M13.5 3.5 5 12" stroke-width="1.1"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 285 B |
3
images/facebook.svg
Normal file
3
images/facebook.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg id="spon-facebook-xl" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<path d="M10.802 25.083v-9.576H7.467v-4.412h3.335v-3.12c0-3.337 2.152-5.058 5.165-5.058 1.4 0 2.69.107 3.013.107v3.551h-2.044c-1.614 0-2.045.754-2.045 1.937v2.583h4.412l-1.506 4.412H14.89v9.576h-4.089z" class="stroke-current" stroke-miterlimit="10" stroke-linejoin="round"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 457 B |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 34 KiB |
3
images/logo.svg
Normal file
3
images/logo.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg id="spon-spiegel-tablet-desktop" width="113" height="23" viewBox="0 0 113 23" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<path d="M22.956 9.047V3.833h5.233v5.214h-5.233zm9.696 1.38V2.453C32.652 1.073 31.575 0 30.19 0H16.646v3.833h1.847v15.334h-1.847V23h8.003v-3.833h-1.693V12.88h7.234c1.385 0 2.462-1.073 2.462-2.453zM40.501 19.167V3.833h1.847V0h-8.003v3.833h1.847v15.334h-1.847V23h8.003v-3.833h-1.847zM55.738 14.873v4.294h-5.233V12.88h6.926V9.047h-6.926V3.833h5.233v3.22h4.463V0H44.35v3.833h1.693v15.334h-1.693V23h15.852v-8.127h-4.463zM68.358 9.047v3.833h3.54v6.287h-5.233V3.833h5.233v3.22h4.617v-4.6c0-1.38-1.077-2.453-2.462-2.453h-9.234c-.616 0-1.232.307-1.54.613-.461.46-.923 1.074-.923 1.84v18.094c0 .766.308 1.38.923 1.84.462.46 1.078.613 1.693.613h11.543V9.047h-8.157zM90.059 14.873v4.294h-5.233V12.88h6.926V9.047h-6.926V3.833h5.233v3.22h4.463V0H78.67v3.833h1.693v15.334H78.67V23h15.852v-8.127h-4.463zM108.066 14.873v4.294h-5.078V3.833h1.846V0h-8.157v3.833h1.847v15.334h-1.847V23h15.853v-8.127h-4.464zM14.645 20.685V9.107H5.103V3.86h5.079v3.242h4.617V2.47C14.8.988 13.414 0 12.03 0h-9.08C1.562 0 .485 1.08.485 2.47v10.496h9.542v6.33H4.95v-4.323H.486v5.557c0 1.39 1.077 2.47 2.462 2.47h9.08c1.417 0 2.617-.926 2.617-2.315z" fill="#fff"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="65" height="65" viewBox="0 0 65 65"><g fill="none" fill-rule="evenodd"><path fill="#C00" d="M0 65h65V0H0z"/><g fill="#FEFEFE"><path d="M54.278 22.374v18.221c0 .723-.453 1.333-1.127 1.517a1.547 1.547 0 0 1-.397.053c-.514 0-1.106-.257-1.533-.982-.023-.039-1.714-2.957-4.295-7.404l-4.276-7.37c-.236-.404-.568-.594-.885-.508-.269.074-.444.321-.444.63v14.064c0 .723-.452 1.333-1.126 1.517-.576.158-1.387-.006-1.93-.929l-3.919-6.754-4.65-8.02c-.24-.405-.574-.595-.896-.507-.206.057-.447.255-.447.629v13.757c0 .906-.796 1.7-1.703 1.7h-6.984c-4.646 0-8.426-3.779-8.426-8.426 0-4.646 3.78-8.425 8.426-8.425h3.627v-2.763H19.67c-6.18 0-11.189 5.009-11.189 11.188 0 6.18 5.01 11.19 11.19 11.19h7.05c2.681.001 4.405-1.569 4.401-4.468v-6.381s4.5 7.749 4.706 8.1c2.855 4.851 8.252 2.846 8.252-1.329v-6.771s4.498 7.749 4.704 8.1c2.855 4.851 8.252 2.846 8.252-1.329v-18.3h-2.757z"/><path d="M12.162 33.563c0 4.137 3.367 7.504 7.504 7.504h6.985c.439 0 .78-.419.78-.778l.002-13.759c0-.724.452-1.333 1.126-1.517.577-.158 1.386.004 1.93.928l4.655 8.025 3.916 6.75c.237.405.572.594.893.506.207-.056.449-.254.449-.628V26.53c0-.725.45-1.335 1.122-1.517.573-.157 1.379.006 1.92.928l4.28 7.375 4.292 7.4c.238.405.572.595.894.506.207-.056.448-.254.448-.628v-18.22h-2.77v10.848s-4.498-7.75-4.705-8.1c-2.854-4.852-8.252-2.847-8.252 1.33v6.77s-4.498-7.75-4.703-8.1c-2.856-4.852-8.252-2.847-8.252 1.33v11.095a.738.738 0 0 1-.745.757h-4.234a4.742 4.742 0 1 1 0-9.483h3.597v-2.763h-3.628c-4.137 0-7.504 3.368-7.504 7.505"/></g></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
BIN
images/opel_chef.webp
Normal file
BIN
images/opel_chef.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 128 KiB |
3
images/social_x.svg
Normal file
3
images/social_x.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg id="spon-twitter-xl" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true">
|
||||
<path d="M15.8619 12.4686L23.1472 4H21.4208L15.095 11.3532L10.0425 4H4.21509L11.8554 15.1193L4.21509 24H5.94158L12.6219 16.2348L17.9576 24H23.785L15.8619 12.4686ZM6.56366 5.29968H9.21546L21.4216 22.7594H18.7698L6.56366 5.29968Z" shape-rendering="geometricPrecision" class="fill-current"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 469 B |
194
index.html
194
index.html
|
|
@ -2,9 +2,9 @@
|
|||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<title>Airbus to use A380 to test hydrogen-fueled engine | CNN Travel</title>
|
||||
<title>Opel: Autohersteller will E-Manta auf den Markt bringen – Comeback aus der Krise - DER SPIEGEL</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="viewport" content="wclassth=device-wclassth, initial-scale=1" />
|
||||
<meta name="description" content="HTML & CSS Course exercise.">
|
||||
<meta name="author" content="Sebastian Wendel" />
|
||||
<meta name="created" content="2024-04-17T09:30:00.450262740" />
|
||||
|
|
@ -13,73 +13,133 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<a href="https://www.cnn.com/">
|
||||
<img src="/images/logo_cnn.svg" alt="CNN Logo">
|
||||
</a>
|
||||
<nav>
|
||||
<a href="#">
|
||||
<img src="/images/logo.svg" alt="Spiegel Logo">
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
<div class="menu">
|
||||
<a href="/destinations/">DESTINATIONS</a>
|
||||
<a href="/food_drink/">FOOD & DRINK</a>
|
||||
<a href="/news/">NEWS</a>
|
||||
<a href="/stay/">STAY</a>
|
||||
<a href="/video/">VIDEO</a>
|
||||
<div class="content">
|
||||
|
||||
<div class="subtitle">Comeback aus der Krise</div>
|
||||
|
||||
<h2>»Boah ey« - Opel will E-Manta auf den Markt bringen</h2>
|
||||
|
||||
<p>
|
||||
Bis vor wenigen Jahren steckte Opel in einer tiefen Krise. Nun geht es laut einem Bericht dank E-Autos für
|
||||
die Traditionsmarke aufwärts - künftig auch mit einem ganz besonderen Modell.
|
||||
</p>
|
||||
|
||||
<p class="timestamp">10.10.2023, 12.37 Uhr</p>
|
||||
|
||||
<section>
|
||||
<ul class="socials">
|
||||
<li><a href="#"><img src="/images/social_x.svg" alt="Share on X"></a></li>
|
||||
<li><a href="#"><img src="/images/facebook.svg" alt="Share on Facebook"></a></li>
|
||||
<li><a href="#"><img src="/images/envelop.svg" alt="Send via E-Mail"></a></li>
|
||||
<li><a href="#"><img src="/images/copylink.svg" alt="Copy Link"></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<p class="timereading">Artikel zum Hören • 2 Min</p>
|
||||
|
||||
<figure>
|
||||
<img src="/images/opel_chef.webp"
|
||||
alt="Opel-Chef Huettl (r.) mit Thüringens Ministerpräsclassent Bodo Ramelow in Eisenach"
|
||||
title="Ab dem zweiten Halbjahr 2024 soll hier ein neues batterieelektrisches SUV entstehen" />
|
||||
Opel-Chef Huettl (r.) mit Thüringens Ministerpräsclassent Bodo Ramelow in Eisenach: Ab dem zweiten
|
||||
Halbjahr 2024 soll hier ein neues batterieelektrisches SUV entstehen <span class="source">Foto: Sascha Fromm
|
||||
/
|
||||
IMAGO</span>
|
||||
</figure>
|
||||
|
||||
<p>
|
||||
Erst vor wenigen Jahren schien <a href="https://www.spiegel.de/thema/opel/">Opel</a> kurz vor der
|
||||
Pleite,nun wächst der lange kriselnde Autobauer laut einem
|
||||
Zeitungsbericht dank seiner Elektroautos kräftig. »Weltweit sind wir dieses Jahr um zwölf Prozent bei
|
||||
den Verkäufen gewachsen«, sagte Opel-Chef Florian Huettl der <a
|
||||
href="https://www.augsburger-allgemeine.de/wirtschaft/interview-opel-chef-teurer-industriestrom-tut-unserer-branche-weh-class68121486.html">»AugsburgerAllgemeinen«</a>.
|
||||
</p>
|
||||
<p>
|
||||
Vor allem auf dem Heimatmarkt <a href="https://www.spiegel.de/thema/deutschland/">Deutschland</a> habe
|
||||
die vom Mutterkonzern Stellantis übernommene Marke zugelegt.
|
||||
»Im September konnten wir im Vergleich zum Vorjahr unseren Marktanteil in Deutschland von fünf auf mehr
|
||||
als sechs Prozent steigern.« Die Zahl der Neuzulassungen sei um rund 26 Prozent gestiegen.
|
||||
</p>
|
||||
<p>
|
||||
Opel werde auch den Manta als Elektroauto zurückbringen, kündigte Huettl in dem Interview an. »Wir bauen
|
||||
ganz sicher einen neuen Manta.« Bislang war der Opel Manta vor allem als sportlich-prolliges Coupé
|
||||
bekannt, die Neuauflage könnte Opels Präsentation auf der Automesse IAA zufolge <a
|
||||
href="https://www.spiegel.de/auto/iaa-in-muenchen-uebersicht-der-wichtigsten-neuheiten-a-d9c70b10-d862-4674-b265-2be771088497">jedoch
|
||||
eher wie ein SUV daherkommen</a>.
|
||||
</p>
|
||||
<p>
|
||||
Huettl sagte: Er werde »kein Retro-Produkt«. Allerdings werde das alte Modell das neue inspirieren. »Man
|
||||
kann den alten Manta im neuen noch spüren und im Detail auch sehen.«
|
||||
</p>
|
||||
|
||||
|
||||
<section class="more">
|
||||
<h3>Mehr zum Thema</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="#">Messe IAA: Darf's ein E-Auto für 16.990 Euro sein? Oder eins für eine Million?
|
||||
<span class="source">Von Thomas Geiger</span>
|
||||
<img src="/images/article1.webp" alt=""></a>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Autogramm Opel Astra Electric: Elektrisch, aber vertraut
|
||||
<span class="source">Von Thomas Geiger</span>
|
||||
<img src="/images/article2.webp" alt=""></a>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Höhere Preise, niedrigere Kosten: Opel-Mutterkonzern Stellantis verdient fast 17
|
||||
Milliarden Euro
|
||||
<img src="/images/article3.webp" alt=""></a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="about">
|
||||
<h3>Mehr lesen über</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="#">Autoindustrie </a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Opel</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Opel-Modelle</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Umweltfreundliche Fahrzeuge</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Elektroautos</a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<h3>SPIEGEL Gruppe</h3>
|
||||
<div>
|
||||
<a href="#">Abo</a>
|
||||
<a href="#">Abo kündigen</a>
|
||||
<a href="#">Shop</a>
|
||||
<a href="#">manager magazin</a>
|
||||
<a href="#">Harvard Business manager</a>
|
||||
<a href="#">11FREUNDE</a>
|
||||
<a href="#">Werbung</a>
|
||||
<a href="#">Jobs</a>
|
||||
<a href="#">MANUFAKTUR</a>
|
||||
<a href="#">SPIEGEL Akademie</a>
|
||||
<a href="#">SPIEGEL Ed</a>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<h1>Airbus to test hydrogen-fueled engine on A380 jet</h1>
|
||||
|
||||
<div class="info">Tamara Hardingham-Gill, CNN • Published 25th February 2022</div>
|
||||
|
||||
<img class="center" src="/images/a380.jpg" alt="A380 side view">
|
||||
|
||||
<strong>(CNN)</strong> — Airbus just moved one step closer to launching the world's first zero-emission commercial
|
||||
aircraft by 2035.
|
||||
|
||||
The French aircraft maker has announced plans to test hydrogen fuel technology using a modified version of one of
|
||||
its A380 jetliners, which were discontinued last year.
|
||||
|
||||
Airbus has partnered with CFM International, a joint venture between GE and Safran Aircraft Engines, on the hugely
|
||||
significant hydrogen demonstration program.
|
||||
|
||||
The plane manufacturer will use an "A380 flying testbed fitted with liquid hydrogen tanks" to trial propulsion
|
||||
technology for its future hydrogen aircraft.
|
||||
|
||||
<h2>'Flight laboratory'</h2>
|
||||
|
||||
"Our ambition is to take this (A380) aircraft and add a stub in between the rear doors at the upper level," says
|
||||
Glenn Llewellyn, vice president for zero emission aircraft at Airbus, in a video posted on the Airbus YouTube
|
||||
channel. "That stub will have on the end of it a hydrogen powered gas turbine."
|
||||
|
||||
Related content - How close are we to guilt-free flying?
|
||||
|
||||
He goes on to explain that the aircraft will be fitted with hydrogen storage and hydrogen distribution, which will
|
||||
feed its engine with the chemical element.
|
||||
|
||||
According to Llewellyn, the aim of the "flight laboratory" is to learn more about hydrogen propulsion systems in
|
||||
real ground and flight conditions, thus enabling Airbus to press on with its plans for a zero-emission aircraft in
|
||||
just over a decade.
|
||||
|
||||
Test flights are currently estimated to take place in 2026, provided everything goes to plan. The news comes over a
|
||||
year after Airbus unveiled three hydrogen-based concepts under the ZEROe banner.
|
||||
|
||||
<img class="center" src="/images/a380_2.jpg"
|
||||
alt="A rendering of the A380 flight test platform, which will put hydrogen combustion technology to the test.">
|
||||
|
||||
"This is the most significant step undertaken at Airbus to usher in a new era of hydrogen-powered flight since the
|
||||
unveiling of our ZEROe concepts back in September 2020," Sabine Klauke, chief technical officer for Airbus, said in
|
||||
a statement.
|
||||
|
||||
"By leveraging the expertise of American and European engine manufacturers to make progress on hydrogen combustion
|
||||
technology, this international partnership sends a clear message that our industry is committed to making
|
||||
zero-emission flight a reality."
|
||||
|
||||
<h2>Guilt-free flying?</h2>
|
||||
|
||||
Aviation generates 2.8% of global CO2 emissions, and the global fuel consumption by commercial airlines reached 95
|
||||
billion gallons in 2019.
|
||||
|
||||
The global aviation industry has pledged to slash emissions to half their 2005 levels by 2050.
|
||||
|
||||
CNN's Paul Sillers also contributed to this report
|
||||
</body>
|
||||
|
||||
</html>
|
||||
2
robots.txt
Normal file
2
robots.txt
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
User-agent: *
|
||||
Disallow: /
|
||||
Loading…
Reference in a new issue