DylanBarnes/eis-website
1
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

Quiz Seite erstellt und README aktualisiert

Browse source
This commit is contained in:
DylanBarnes 2026-06-03 13:19:11 +00:00
parent de17bf9291
commit 9cb9754e9c
3 changed files with 20 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
css/style.css
View file

@ -4,11 +4,8 @@
font-size: 2.5rem; font-size: 2.5rem;
font-weight: 700; font-weight: 700;
text-align: center; text-align: center;
padding: 2rem 1rem; padding: 2rem;
margin: 1rem 0;
background: rgba(255, 255, 255, 0.9);
border-radius: 12px; border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
transition: all 0.5s ease; transition: all 0.5s ease;
} }
@ -2195,27 +2192,32 @@ body.dark .kinetic-btn:hover {
.quiz-answers { .quiz-answers {
display: grid; display: grid;
gap: 1rem; gap: 1.5rem;
margin: 2rem 0; margin: 2rem 0;
} }
.answer-btn { .answer-btn {
padding: 1rem 1.5rem; padding: 1.75rem 2rem;
border: 2px solid #e2e8f0; min-height: 70px;
border: 2px solid #cbd5e1;
background: white; background: white;
color: #1e293b; color: #1e293b;
border-radius: 12px; border-radius: 16px;
font-size: 1rem; font-size: 1.1rem;
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: all 0.3s ease;
text-align: left; text-align: left;
font-weight: 500; font-weight: 600;
display: flex;
align-items: center;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
} }
.answer-btn:hover:not(:disabled) { .answer-btn:hover:not(:disabled) {
border-color: #667eea; border-color: #667eea;
background: rgba(102, 126, 234, 0.05); background: linear-gradient(135deg, rgba(102, 126, 234, 0.08), rgba(118, 75, 162, 0.05));
transform: translateX(4px); transform: translateX(6px) translateY(-2px);
box-shadow: 0 8px 20px rgba(102, 126, 234, 0.2);
} }
.answer-btn:disabled { .answer-btn:disabled {
@ -2223,15 +2225,17 @@ body.dark .kinetic-btn:hover {
} }
.answer-btn.correct { .answer-btn.correct {
background: #dcfce7; background: linear-gradient(135deg, #dcfce7, #d1fae5);
border-color: #16a34a; border-color: #16a34a;
color: #15803d; color: #15803d;
box-shadow: 0 4px 12px rgba(22, 163, 74, 0.2);
} }
.answer-btn.incorrect { .answer-btn.incorrect {
background: #fee2e2; background: linear-gradient(135deg, #fee2e2, #fecaca);
border-color: #dc2626; border-color: #dc2626;
color: #991b1b; color: #991b1b;
box-shadow: 0 4px 12px rgba(220, 38, 38, 0.2);
} }
.feedback { .feedback {

2
index.html
View file

@ -26,7 +26,7 @@
<span class="word" style="--index: 3">Website!</span> <span class="word" style="--index: 3">Website!</span>
</h1> </h1>
<p class="hero-subtitle">Ein interaktives Lernprojekt im Bereich der Web-Entwicklung</p> <p class="hero-subtitle">Ein interaktives Lernprojekt im Bereich der Web-Entwicklung</p>
<p class="hero-subtitle" id="begruessung"></p> <p id="begruessung"></p>
<div class="scroll-indicator"> <div class="scroll-indicator">
<span>Scroll zum Erkunden</span> <span>Scroll zum Erkunden</span>
<svg class="scroll-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <svg class="scroll-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">

2
quiz.html
View file

@ -13,7 +13,7 @@
<main> <main>
<section class="content-section"> <section class="content-section">
<h1 class="section-title">🧠 EIS Mini-Quiz</h1> <h1 class="section-title">EIS Mini-Quiz</h1>
<p class="section-subtitle">Teste dein Wissen über Web-Entwicklung und unsere PH Weingarten!</p> <p class="section-subtitle">Teste dein Wissen über Web-Entwicklung und unsere PH Weingarten!</p>
<div id="quiz-container" class="quiz-container"> <div id="quiz-container" class="quiz-container">