116 lines
3.8 KiB
HTML
116 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
|
|
<head>
|
|
<link rel="stylesheet" href="basic.css">
|
|
<link rel="stylesheet" href="contact.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
<title> Contact </title>
|
|
<meta charset="UTF-8">
|
|
</head>
|
|
|
|
<body>
|
|
<header>
|
|
<div class="navigation">
|
|
<ul>
|
|
<li>
|
|
<a href="about_me.html"> About Me! </a>
|
|
</li>
|
|
<li>
|
|
<a href="contact.html" class="active"> Contact </a>
|
|
</li>
|
|
<li>
|
|
<a href="portfolio.html"> Portfolio </a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<svg width="650" height="160">
|
|
<ellipse cx="325" cy="0" rx="300" ry="150" stroke="#011f4b" stroke-width="5" fill="#005b96" />
|
|
<text fill="#ffffff" font-size="40" x="200" y="70"> C O N T A C T </text>
|
|
</svg>
|
|
|
|
</header>
|
|
|
|
<div class="achthundert">
|
|
|
|
<div class="socialMedia">
|
|
<div class="socialMediaText">
|
|
<h1> Facebook </h1>
|
|
<h2> Justin Dretvic </h2>
|
|
</div>
|
|
<a href="https://www.facebook.com/justin.dretvic.1">
|
|
<i class="fa fa-facebook-square" style="font-size:150px"></i>
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="socialMedia">
|
|
<div class="socialMediaText">
|
|
<h1> Instagram </h1>
|
|
<h2> @justin_da_ghost </h2>
|
|
</div>
|
|
<a href="https://www.instagram.com/justin_da_ghost/">
|
|
<i class="fa fa-instagram" style="font-size:150px"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="socialMedia">
|
|
<div class="socialMediaText">
|
|
<h1> Xing </h1>
|
|
<h2> Justin Dretvic </h2>
|
|
</div>
|
|
<a href="https://www.xing.com/profile/Justin_Dretvic/cv">
|
|
<i class="fa fa-xing" style="font-size:150px"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="socialMedia">
|
|
<div class="socialMediaText">
|
|
<h1> E-Mail </h1>
|
|
<h2> Justin.Dretvic@hs-furtwangen.de </h2>
|
|
</div>
|
|
<a href="mailto:Justin.Dretvic@hs-furtwangen.de">
|
|
<i class="fa fa-envelope" style="font-size:150px"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="contact_me">
|
|
<h1>Kontaktiere mich doch!</h1>
|
|
<form>
|
|
<input type="text" placeholder="Vorname">
|
|
<input type="text" placeholder="Nachname">
|
|
<input type="text" placeholder="E-Mail">
|
|
<textarea id="textInput" placeholder="Nachricht"></textarea>
|
|
<p id="extra">Mit Absenden der Nachricht bestätige ich <br>den <a href="files/leertext.pdf">Datenschutz</a></p>
|
|
<input type="submit" onclick="alert('Ihre Nachricht wurde verschickt')">
|
|
</form>
|
|
</div>
|
|
|
|
<!-- <div class="quick_tip">
|
|
<p> Look for stuff py pressing <kbd>Ctrl + F</kbd> </p>
|
|
<p> Hier ist eine <a href="files/leertext.pdf">PDF</a> mit Leertext verlinkt! </p>
|
|
</div> -->
|
|
|
|
</div>
|
|
|
|
<footer>
|
|
<div>
|
|
<p> Dieser Inhalt steht in einem footer! </p>
|
|
<p> Jegliche Inhalte werden nicht monetär verwendet! </p>
|
|
<p> Alle Bilder, die keine Logos sind, wurden von
|
|
<a href="https://pixabay.com/de/"> Pixabay</a> bezogen </p>
|
|
<div class="second_nav">
|
|
<a href=""> <i class="fa fa-facebook-square"></i> </a>
|
|
<a href=""> <i class="fa fa-instagram"></i> </a>
|
|
<a href=""> <i class="fa fa-envelope"></i> </a>
|
|
<a href=""> <i class="fa fa-xing"></i> </a>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
|
|
</html> |