MINIPROJEKT_3/index.html

69 lines
3.7 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Kontaktkort - Amir Alsalakh"> <!-- Beskrivning av sidan för SEO -->
<title>Kontaktkort Amir Alsalakh</title> <!-- Titeln på sidan som visas i webbläsarfliken -->
<link rel="stylesheet" href="styleSheet.css"> <!-- Länkar till CSS-stilmallen -->
<script src="script.js" defer></script> <!-- Länkar till JavaScript-filen (defer säkerställer att scriptet laddas efter HTML) -->
</head>
<body>
<div class="banner">
<img src="../Images/MINIPROJEKT1/egyLogo.webp" alt="Logotyp" class="banner-logo"> <!-- Logotyp för banner -->
<h1 class="banner-title">Kontakt</h1> <!-- Huvudrubrik i bannern -->
</div>
<div class="container"> <!-- Container för att hålla allt innehåll -->
<header class="header">
<img src="../Miniprojekt_2/images/amir.jpeg" alt="Amir Alsalakh foto" class="profile-photo"> <!-- Profilbild -->
<div class="header-text">
<h1>Amir Alsalakh</h1> <!-- Namn -->
<hr class="separator"> <!-- Horisontell linje för att separera namnet från övrig information -->
<p><strong>👨🏽🦱Elev:</strong> i Rönneberggymnasiet</p> <!-- Elevinformation -->
<p><strong>Arbete:</strong> 07alam@skola.engelholm.se</p> <!-- Arbets-e-post -->
<p><strong>Privat:</strong> amiralsallakh@gmail.com</p> <!-- Privat-e-post -->
<p><strong>📞Telefon:</strong> +46 700 13 13 62</p> <!-- Telefonnummer -->
</div>
</header>
<section class="address-info"> <!-- Sektion för adressinformation -->
<div class="work-address"> <!-- Arbetsadress -->
<h2>Gymnasie</h2> <!-- Rubrik för arbetsadress -->
<p>Ängelholms Gymnasieskola</p> <!-- Namn på skolan -->
<p>Skolgatan 8, 262 43</p> <!-- Adress -->
<p>Ängelholm</p> <!-- Stad -->
<a href="https://www.google.com/maps?q=Ängelholms+Gymnasieskola"> <!-- Länk till Google Maps -->
<img src="images/googleMaps.jpeg" alt="Maps Logotyp" class="address-logo"> <!-- Logotyp för Google Maps -->
</a>
</div>
<div class="home-address"> <!-- Hemadress -->
<h2>Hem</h2> <!-- Rubrik för hemadress -->
<p>Spovgränd</p> <!-- Gatuadress -->
<p>23</p> <!-- Husnummer -->
<p>Ängelholm</p> <!-- Stad -->
<a href="https://www.google.com/maps?q=Spovgränd+23"> <!-- Länk till Google Maps -->
<img src="images/googleMaps.jpeg" alt="Maps Logotyp" class="address-logo"> <!-- Logotyp för Google Maps -->
</a>
</div>
</section>
<footer class="footer"> <!-- Fotdel av sidan -->
<div class="left-icon"> <!-- Vänstra delen med logotyp -->
<img src="../Images/MINIPROJEKT1/egyLogo.webp" alt="Footer Logotyp" class="logo"> <!-- Logotyp -->
</div>
<a href="tel:+46700131362" class="icon phone center-icon" aria-label="Ring Amir">📞</a> <!-- Telefonlänk -->
<div class="right-icons"> <!-- Höger del av footern med kontaktikoner -->
<a href="sms:+46700131362" class="icon sms" aria-label="SMS till Amir">💬</a> <!-- SMS-länk -->
<a href="mailto:amiralsallakh@gmail.com" class="icon email" aria-label="E-posta Amir">✉️</a> <!-- E-postlänk -->
</div>
</footer>
</div>
</body>
</html>