Compare commits

...

7 Commits

5 changed files with 137 additions and 83 deletions

View File

@ -14,6 +14,9 @@
<main>
<h1>Absolvententreffen</h1>
<h2>2025</h2>
<h2><strong>Datum:</strong> Donnerstag, 25.September 2025</h2>
<h2><strong>Uhrzeit:</strong> 17:00 bis 20:00 Uhr</h2>
<h2><strong>Ort:</strong> Speisesaal des SZU, Ungargasse 69,1030 Wien</h2>
<div class="buttons">
<button class="btn green" onclick="toggleOverlay('zusage')">
Zusage
@ -33,7 +36,7 @@
<input name="firstname" type="text" placeholder="Vorname" required />
<input name="lastname" type="text" placeholder="Nachname" required />
<input name="email" type="email" placeholder="Email" required />
<input name="department" type="text" placeholder="Abteilung" />
<input name="faculty" type="text" placeholder="Fachrichtung" />
<input name="year" type="text" placeholder="Jahrgang" />
<input
name="zusage"
@ -57,7 +60,7 @@
<input name="firstname" type="text" placeholder="Vorname" required />
<input name="lastname" type="text" placeholder="Nachname" required />
<input name="email" type="email" placeholder="Email" required />
<input name="department" type="text" placeholder="Abteilung" />
<input name="faculty" type="text" placeholder="Fachrichtung" />
<input name="year" type="text" placeholder="Jahrgang" />
<input
name="absage"

View File

@ -1,114 +1,115 @@
body {
font-family: Arial, sans-serif;
margin: 0;
text-align: center;
background-color: #fff;
font-family: Arial, sans-serif;
margin: 0;
text-align: center;
background-color: #fff;
}
header {
background: #ccc;
padding: 10px;
text-align: left;
background: #ccc;
padding: 1rem;
text-align: left;
}
.logo {
height: 60px;
height: 4rem; /* Relative H<>he */
}
main {
padding: 50px 20px;
padding: 5rem 2rem; /* Relative Werte f<>r Padding */
}
h1 {
font-size: 48px;
margin: 0;
font-size: clamp(1.8rem, 5vw, 3rem); /* Relative Schriftgr<67><72>e */
margin: 0;
text-align:center;
word-wrap: break-word;
}
h2 {
font-size: 24px;
color: #666;
margin-bottom: 30px;
font-size: 1.5rem;
color: #666;
margin-bottom: 2rem;
}
.buttons {
display: flex;
justify-content: center;
gap: 15px;
display: flex;
justify-content: center;
gap: 1rem;
}
.btn {
padding: 10px 25px;
font-size: 16px;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
padding: 0.6rem 2rem; /* Relative Werte f<>r Padding */
font-size: 1rem; /* Relative Schriftgr<67><72>e */
color: white;
border: none;
border-radius: 0.5rem;
cursor: pointer;
}
.btn.green {
background-color: #28a745;
}
.btn.green {
background-color: #28a745;
}
.btn.red {
background-color: #dc3545;
}
.btn.red {
background-color: #dc3545;
}
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
display: none;
align-items: center;
justify-content: center;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
display: none;
align-items: center;
justify-content: center;
}
.form-box {
background: white;
padding: 30px;
border-radius: 10px;
width: 90%;
max-width: 400px;
position: relative;
text-align: left;
background: white;
padding: 2rem;
border-radius: 1rem;
width: 90%;
max-width: 25rem; /* Maximale Breite relativ */
position: relative;
text-align: left;
}
.form-box h3 {
text-align: center;
}
.form-box h3 {
text-align: center;
}
.form-box p {
font-size: 12px;
text-align: center;
}
.form-box p {
font-size: 0.75rem; /* Relativer Wert */
text-align: center;
}
.form-box form {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 15px;
}
.form-box form {
display: flex;
flex-direction: column;
gap: 1rem; /* Relative Gap */
margin-top: 1.5rem;
}
.form-box input {
padding: 10px;
font-size: 14px;
}
.form-box input {
padding: 1rem;
font-size: 0.875rem; /* Relativer Wert */
}
.form-box button {
background: black;
color: white;
padding: 10px;
font-size: 16px;
border: none;
margin-top: 10px;
cursor: pointer;
}
.form-box button {
background: black;
color: white;
padding: 1rem;
font-size: 1rem;
border: none;
margin-top: 1rem;
cursor: pointer;
}
.form-logo {
display: block;
margin: 20px auto 0;
height: 40px;
display: block;
margin: 2rem auto 0;
height: 2.5rem; /* Relative H<>he */
}

View File

@ -32,7 +32,7 @@ app.use(bodyParser.urlencoded({ extended: true }));
app.post("/post", (req, res) => {
fs.writeFile(
`./data/${req.body.firstname}-${req.body.lastname}.json`,
`./data/${req.body.email}.json`,
JSON.stringify(req.body),
(err) => {
console.log(err);
@ -69,7 +69,7 @@ app.post("/post", (req, res) => {
<p>❗Falls du wider Erwarten doch nicht teilnehmen kannst, bitten wir dich um eine kurze Absage per E-Mail an dieselbe Adresse. So können wir besser planen vielen Dank!</p>
<p>Wir freuen uns auf einen stimmungsvollen Abend mit dir und auf viele schöne Begegnungen!</p>
<p>Wir freuen uns auf einen Abend mit viele schöne Begegnungen!</p>
<p>Herzliche Grüße<br>
Gerti Brindlmayer &amp; Lukas Aigner<br>
@ -84,12 +84,20 @@ app.post("/post", (req, res) => {
}
);
return res.sendFile("bestaetigung.html", {
return res.sendFile("zusage.html", {
root: path.join(__dirname, "views"),
});
});
app.post("/cancel", (req, res) => {
fs.writeFile(
`./data/${req.body.email}.json`,
JSON.stringify(req.body),
(err) => {
console.log(err);
}
);
transporter.sendMail(
{
from: "Alumnihub <alumnihub@kocoder.xyz>",
@ -126,7 +134,7 @@ app.post("/cancel", (req, res) => {
}
);
return res.sendFile("bestaetigung.html", {
return res.sendFile("absage.html", {
root: path.join(__dirname, "views"),
});
});

View File

@ -14,11 +14,11 @@
<main>
<h1>Absolvententreffen</h1>
<h2>2025</h2>
<div class="buttons">
Vielen Dank für das hinterlassen der Informationen zu dir und das
Interesse am Absolventinnentreffen. Wir werden dich über folgende
Veranstaltungen informieren.
</div>
</main>
</body>
</html>

42
views/zusage.html Normal file
View File

@ -0,0 +1,42 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Absolvententreffen 2025</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header>
<img src="logo.png" alt="HTL Ungargasse Logo" class="logo" />
</header>
<main>
<h1>Absolvententreffen</h1>
<h2>2025</h2>
<h2>Vielen Dank für deine Anmeldung!</h2>
<p>
Deine Anmeldung zum Absolvent*innentreffen am Donnerstag, 25.
September 2025, von 17:00 bis 20:00 Uhr im Speisesaal des SZU wurde
erfolgreich übermittelt.
</p>
<p>
Du erhältst in Kürze ein Bestätigungsmail mit allen wichtigen
Informationen.
</p>
<p>
Solltest du das Mail nicht innerhalb weniger Minuten sehen, wirf bitte
auch einen Blick in deinen Spam-Ordner.
</p>
<p>
Wir freuen uns schon sehr darauf, dich im September wieder am SZU zu
begrüßen!
</p>
</main>
</body>
</html>