Erste Version der Website

This commit is contained in:
Theresa Nerz & Tahar Lamred 2026-05-08 15:49:50 +00:00
commit 7821e4a1f0
18 changed files with 272 additions and 0 deletions

4
.gitignore vendored Normal file
View file

@ -0,0 +1,4 @@
*.save
*.swp
*~
.DS_Store

25
about_us.html Normal file
View file

@ -0,0 +1,25 @@
<header>
<!-- In the <head> of every page -->
<link rel="icon" href="img/favicon.png" type="image/png">
<!-- Logo in header -->
<img src="./img/Logo.png" alt="Logo" style="height: 100px;">
<link rel="stylesheet" href="css/style.css">
<nav>
<a href="index.html">Home</a>
<a href="about_us.html">About Us</a>
<a href="eis_project.html">Project</a>
<a href="contact.html">Contact</a>
<a href="imprint.html">Imprint</a>
</nav>
</header>
<main>
<!-- Page content here -->
<p> Student: Tahar und Thereza</p>
</main>
<footer>
<p>&copy; 2025 EIS Learning Project</p>
</footer>

1
assets/index.html Normal file
View file

@ -0,0 +1 @@

27
contact.html Normal file
View file

@ -0,0 +1,27 @@
<header>
<!-- In the <head> of every page -->
<link rel="icon" href="img/favicon.png" type="image/png">
<!-- Logo in header -->
<img src="./img/Logo.png" alt="Logo" style="height: 100px;">
<link rel="stylesheet" href="css/style.css">
<nav>
<a href="index.html">Home</a>
<a href="about_us.html">About Us</a>
<a href="eis_project.html">Project</a>
<a href="contact.html">Contact</a>
<a href="imprint.html">Imprint</a>
</nav>
</header>
<main>
<!-- Page content here -->
<p> Wir sind erreichbar unter: 017682638021 und 016092360333</p>
</main>
<footer>
<p>&copy; 2025 EIS Learning Project</p>
</footer>

0
css/eis_projekt.html Normal file
View file

0
css/impressum.html Normal file
View file

0
css/kontakt.html Normal file
View file

55
css/style.css Normal file
View file

@ -0,0 +1,55 @@
{
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: Andalus;
color: #000000;
line-height: 1.6;
background-color:#FFFFFF;
}
nav {
display: flex;
align-items: center;
gap: 1.5rem;
padding: 1rem 2rem;
background: #ffff00;
border-bottom: 1px solid #e2e8f0;
flex-wrap: wrap;
}
nav a {
text-decoration: none;
color: #2563eb;
font-weight: 500;
}
nav a:hover {
text-decoration: underline;
}
.logo {
height: 40px;
}
.galerie {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 1rem;
margin: 1rem 0;
}
.galerie img {
width: 100%;
height: 200px;
object-fit: cover;
border-radius: 8px;
cursor: pointer;
transition: transform 0.2s;
}
.galerie img:hover {
transform: scale(1.03);
}

2
css/style.htm Normal file
View file

@ -0,0 +1,2 @@

0
css/ueber_uns.html Normal file
View file

31
eis_project.html Normal file
View file

@ -0,0 +1,31 @@
<header>
<!-- In the <head> of every page -->
<link rel="icon" href="img/favicon.png" type="image/png">
<link rel="stylesheet" href="css/style.css">
<!-- Logo in header -->
<img src="./img/Logo.png" alt="Logo" style="height: 100px;">
<nav>
<a href="index.html">Home</a>
<a href="about_us.html">About Us</a>
<a href="eis_project.html">Project</a>
<a href="contact.html">Contact</a>
<a href="imprint.html">Imprint</a>
</nav>
</header>
<main>
c <!-- Page content here --><P> Unser Project SoSe 2026
<h2>Fotogalerie</h2>
<div class="galerie">
<img src="img/bild1.jpg" alt="Mein Bild">
<img src="img/bild2.jpg" alt="Beschreibung Bild 2">
<img src="img/bild3.jpg" alt="Beschreibung Bild 3">
</div>
</main>
<footer>
<p>&copy; 2026 EIS Learning Project</p>
</footer>

BIN
img/Logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 117 KiB

BIN
img/bild1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
img/bild2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

BIN
img/bild3.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

32
imprint.html Normal file
View file

@ -0,0 +1,32 @@
<header>
<link rel="icon" href="img/favicon.png" type="image/png">
<img src="./img/Logo.png" alt="Logo" style="height: 100px;">
<link rel="stylesheet" href="css/style.css">
<nav>
<a href="index.html">Home</a>
<a href="about_us.html">About Us</a>
<a href="eis_project.html">Project</a>
<a href="contact.html">Contact</a>
<a href="imprint.html">Imprint</a>
</nav>
</header>
<main>
<h1>Imprint</h1>
<p>Responsible: Theresa und Tahar</p>
<p>Email: theresa.nerz@stud.ph-weingarten.de & tahar.lamred01@stud.ph-weingartenh.de</p>
<p>This website is a learning project as part of the course
"Development of Interactive Software Applications" at PH Weingarten.</p>
<a href="assets/project_info.pdf" download>Download Project Info (PDF)</a>
</main>
<footer>
<p>&copy; 2026 EIS Learning Project</p>
</footer>

47
index.html Normal file
View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<link rel="icon" href="img/favicon.png" type="image/png">
</head>
<nav>
<a href="index.html">Home</a>
<a href="about_us.html">About Us</a>
<a href="eis_project.html">Project</a>
<a href="contact.html">Contact</a>
<a href="imprint.html">Imprint</a>
</nav>
<header>
<!-- Logo in header -->
<img src="./img/Logo.png" alt="Logo" style="height: 100px;">
<body>
<h1>Wilkommen beim Lernprojekt EIS!</h1>
<p>My first page on the server.</p>
<script src="script.js"></script>
</body>
</html><a href="imprint.html">imprint.html</a>
</nav>
</header>
<link rel="stylesheet" href="css/style.css">
<main>
<p>Auf dieser Website stellen wir unser Projekt im Rahmen der Lehrveranstaltung
Entwicklung interaktiver Softwareanwendungen vor.</p>
<p>
<a href="assets/projektinfo.pdf" download>Projektinfo herunterladen (PDF)</a>
</p>
</main>
<footer>
<p>&copy; 2026 Lernprojekt EIS</p>
</footer>
<script src="js/script.js"></script>
</body>

48
js/script.js Normal file
View file

@ -0,0 +1,48 @@
document.querySelectorAll('.galerie img').forEach(img => {
img.addEventListener('click', () => {
const overlay = document.createElement('div');
overlay.style.cssText =
'position:fixed;inset:0;background:rgba(0,0,0,.8);display:flex;' +
'align-items:center;justify-content:center;cursor:pointer;z-index:999';
const big = document.createElement('img');
big.src = img.src;
big.style.maxWidth = '90vw';
big.style.maxHeight = '90vh';
big.style.borderRadius = '10px';
overlay.appendChild(big);
overlay.addEventListener('click', () => overlay.remove());
document.body.appendChild(overlay);
});
});console.log("Meine Seite läuft!");
document.querySelectorAll('.galerie img').forEach(img => {
img.addEventListener('click', () => {
const overlay = document.createElement('div');
overlay.style.cssText =
'position:fixed;inset:0;background:rgba(0,0,0,.8);display:flex;' +
'align-items:center;justify-content:center;cursor:pointer;z-index:999';
const big = document.createElement('img');
big.src = img.src;
big.style.maxWidth = '90vw';
big.style.maxHeight = '90vh';
overlay.appendChild(big);
overlay.addEventListener('click', () => overlay.remove());
document.body.appendChild(overlay);
});
});
document.querySelectorAll('.gallery img').forEach(img => {
img.addEventListener('click', () => {
const overlay = document.createElement('div');
overlay.style.cssText =
'position:fixed;inset:0;background:rgba(0,0,0,.8);display:flex;' +
'align-items:center;justify-content:center;cursor:pointer;z-index:999';
const big = document.createElement('img');
big.src = img.src;
big.style.maxWidth = '90vw';
big.style.maxHeight = '90vh';
overlay.appendChild(big);
overlay.addEventListener('click', () => overlay.remove());
document.body.appendChild(overlay);
});
});