-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
171 lines (169 loc) · 4.96 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
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="./style.css" />
<title>Test Bikes</title>
</head>
<body>
<div class="header">
<div class="container0">
<p class="headline">Test◯Bikes</p>
<a class="link" href="#contact">Werkstatt</a>
<a class="link" href="https://github.com/TomSoerr/odin-landing-page"
>GitHub</a
>
</div>
</div>
<div class="section1">
<div class="container1">
<div>
<img
src="./img/bicycle.jpg"
alt="Foto von einem Fahrrad vor einer Wand.
An der Wand sind mit Farbe zwei Kinder gemalt."
/>
</div>
<div class="hero-text">
<p class="headline">
Fahrrad, Reperatur, E-Bike sowie individuelle Beratung und
Radanpassungen
</p>
<p class="secondary text">
Das Radfahren ist nicht ohne Grund Lieblingssport der Deutschen. Es
bietet viele Vorteile und wer sich auf den Drahtesel schwingt, tut
nicht nur etwas für die eigene Gesundheit.
</p>
<button>Termin vereinbaren</button>
</div>
</div>
</div>
<div class="section2">
<div class="container2">
<p class="text-large">Mitarbeiter</p>
<div class="container2-1">
<div>
<div class="placeholder">
<br /><br />
Platzhalter für ein Bild
</div>
<p class="text">
<span class="text-mid">Max Müller</span><br />- Inhaber
</p>
</div>
<div>
<div class="placeholder">
<br /><br />
Platzhalter für ein Bild
</div>
<p class="text">
<span class="text-mid">Fritz Huber</span><br />- Verkäufer
</p>
</div>
<div>
<div class="placeholder">
<br /><br />
Platzhalter für ein Bild
</div>
<p class="text">
<span class="text-mid">Mathias Wilber</span><br />-
Werkstattleiter
</p>
</div>
<div>
<div class="placeholder">
<br /><br />
Platzhalter für ein Bild
</div>
<p class="text">
<span class="text-mid">Alex Berger</span><br />- Mechaniker
</p>
</div>
</div>
</div>
</div>
<div class="section3">
<div class="container3">
<p class="text-large">
Wir sind ein zuverlässiges Familienunternehmen und legen extrem großen
Wert auf qualitativ hochwertige und langlebige Fahrräder! Wer bei uns
ein Fahrrad kauft, soll auch zu 100 Prozent sicher sein, dass es die
nächsten Jahre ohne Probleme fährt und Freude bereitet. Genauso halten
wir es mit Fahrradreparaturen, die wir mit größter Sorgfalt
durchführen und ausschließlich solide Ersatzteile verwenden.
</p>
<img
src="./img/workshop.jpg"
alt="Foto von einem Arbeitsplatz eines Mechanikers"
/>
</div>
</div>
<div id="contact" class="section4">
<div class="container4">
<p class="text">
<span class="text-mid">Anschrift</span> <br />
<br />
Test Bikes <br />
Beispielstraße 42 <br />
42069 Bonn
</p>
<p class="text">
<span class="text-mid">Kontakt</span> <br />
<br />
Mail: <br />
Rheiner.Zufall@Test-Bike.de <br />
Fon: 418 1235813 <br />
</p>
<p class="text">
<span class="text-mid">Öffnungszeiten</span> <br />
<br />
Montag: Ruhetag <br />
Dienstag: 10 - 19 Uhr <br />
Mittwoch: 10 - 19 Uhr <br />
Donnerstag: 10 - 19 Uhr <br />
Freitag: 10 - 21 Uhr <br />
Samstag: 10 - 21 Uhr
</p>
<button>Termin vereinbaren</button>
</div>
</div>
<div class="footer">
<p>Copyright © The Odin Project 2022</p>
</div>
<a
style="
position: fixed;
bottom: 0;
right: 0;
color: black;
background-color: white;
text-decoration: none;
font-size: 16px;
font-family: sans-serif;
padding: 2px;
border: thin solid black;
text-decoration: underline;
"
href="https://tomsoerr.github.io/#/impressum"
>
Imprint
</a>
<span
style="
z-index: 1000;
position: fixed;
bottom: 0;
left: 0;
color: black;
background-color: white;
text-decoration: none;
font-size: 16px;
font-family: sans-serif;
padding: 2px;
border: thin solid black;
"
>
Not a commercial site, only for educational purposes.
</span>
</body>
</html>