From cc7513e5bded1b6d0a359a7ee85c8d365b5dd1b1 Mon Sep 17 00:00:00 2001
From: Emil Miler <emil.miler@pedf.cuni.cz>
Date: Fri, 25 Jun 2021 15:53:01 +0200
Subject: [PATCH] =?UTF-8?q?Modal=20s=20medailonky=20realiz=C3=A1tor=C5=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html | 39 +++++++++++++++++++++++++++++++++++----
 style.css  | 33 +++++++++++++++++++++++++++++++++
 2 files changed, 68 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 0ba9ae4..ecc08ec 100644
--- a/index.html
+++ b/index.html
@@ -80,29 +80,54 @@
 			<div class="wrap">
 				<h2>Realizační team</h2>
 				<div class="list">
-					<figure>
+					<figure onclick="modal_toggle('slezakova')">
 						<img src="img/team/jana-slezakova.jpg" alt="Jana Slezáková">
 						<label class="name">
 							Jana Slezáková
 						</label>
+						<div class="modal" id="slezakova">
+							<div class="content">
+								<p><strong>PhDr. Jana Slezáková, Ph.D.</strong> vystudovala PedF UK a doktorát získala na téže fakultě. Vyučuje na Pedagogické fakultě UK v&nbsp;Praze, kde se zabývá především didaktikou matematiky 1.&nbsp;stupně ZŠ a vede pedagogickou praxi studentů. Je spoluautorkou učebnic matematiky pro 1.&nbsp;stupeň ZŠ, které vyšly v&nbsp;letech 2018&ndash;2020 (učebnice pro 1.&nbsp;až 3.&nbsp;ročník Hejný a kol., další ročníky se připravují). Též je spoluautorkou Předmatematiky &mdash; Metodiky pro učitele mateřských škol (Hejného metoda), která vyšla v&nbsp;roce 2020. Je lektorkou a tutorkou (připravuje k&nbsp;lektorování budoucí lektory) ve společnosti H-mat, o.p.s. (<a href="https://www.h-mat.cz">www.h-mat.cz</a>). Poskytuje jak na PedF UK, tak ve společnosti H-mat, o.p.s kolegiální podporu učitelům v&nbsp;oblasti vyučování matematice.</p>
+								<p>V projektu SPIN má na starost na katedře KMDM garantování aktivit výuky, podílí se na tandemové výuce a vedení absolventských kaváren. Též se podílí na propojování spolupráce PedF UK a H-mat, o.p.s.</p>
+							</div>
+						</div>
 					</figure>
-					<figure>
+					<figure onclick="modal_toggle('vallin')">
 						<img src="img/team/petra-vallin.jpg" alt="Petra Vallin">
 						<label class="name">
 							Petra Vallin
 						</label>
+						<div class="modal" id="vallin">
+							<div class="content">
+								<p><strong>PhDr. Petra Vallin, Ph.D.</strong> vystudovala Učitelství pro 1.&nbsp;stupeň se specializací angličtina, kterou pak 10 let vyučovala. Aktuálně se věnuje lektorování seminářů a workshopů o&nbsp;inovacích ve vzdělávání, pilotování inovativních programů na ZŠ a koordinaci rozvojových projektů. Spolupracuje s&nbsp;International Training Center, Educentrem, NPI ČR, MŠMT a dalšími institucemi. Na Pedagogické fakultě UK vyučuje několik kurzů pro zahraniční studenty, podílí se na tandemové výuce didaktiky 1. stupně ZŠ a je zapojena do několika projektů týkajících se formativního hodnocení a propojování teorie a praxe. Působí jako metodik a lektor CLIL. Je spoluautorkou publikace <i>CLIL: Inovativní přístup nejen k&nbsp;výuce cizích jazyků.</i></p>
+								<p>V projektu SPIN zastává roli projektového manažera.</p>
+							</div>
+						</div>
 					</figure>
-					<figure>
+					<figure onclick="modal_toggle('jirotkova')">
 						<img src="img/team/darina-jirotkova.jpg" alt="Darina Jirotková">
 						<label class="name">
 							Darina Jirotková
 						</label>
+						<div class="modal" id="jirotkova">
+							<div class="content">
+								<p><strong>doc. RNDr. Darina Jirotková, Ph.D.</strong> vystudovala MFF UK v&nbsp;Praze. Docenturu získala v&nbsp;oboru didaktika matematiky na Pedagogické fakultě UK v&nbsp;Praze, kde vyučuje na Katedře matematiky a didaktiky matematiky.</p>
+								<p>Je členkou oborové rady didaktiky matematiky pro doktorská studia, školí doktorandy. Podílela se na koncepci geometricky zaměřených předmětů v&nbsp;přípravě učitelů 1.&nbsp;st. ZŠ a v&nbsp;poslední době se orientuje zejména na oblast didaktiky matematiky 1. stupně ZŠ. Podílí se na rozvoji Hejného metody vyučování matematice. Je spoluautorkou sady učebnic matematiky Hejného metodou a doprovodných materiálů pro 1.&nbsp;stupeň ZŠ a 6.&nbsp;a 7.&nbsp;roč. 2.&nbsp;st.&nbsp;ZŠ. Je lektorkou a tutorkou Hejného metody, školí lektory Hejného metody ve společnosti H-mat, o.p.s. Zde je též zapojena do projektu Kolegiální podpora jako tuto a lektor. Je členkou národního kabinetu Matematika a její aplikace v&nbsp;projektu SYPO - Systém podpory profesního rozvoje učitelů a ředitelů, NPI ČR,  kde se podílí i na tvorbě metodických materiálů. Je též členkou jádrového týmu ESF projektu PPUČ, NPI ČR - Podpora práce učitelů.</p>
+								<p>V projektu SPIN má na starost na katedře KMDM garantování výukových aktivit, koordinaci tandemové výuky a vedení absolventských kaváren. Přispívá rozvoji spolupráce PedF UK s&nbsp;H-mat, o.p.s. zejména v&nbsp;oblasti propojování teorie a praxe.</p>
+							</div>
+						</div>
 					</figure>
-					<figure>
+					<figure onclick="modal_toggle('kargerova')">
 						<img src="img/team/jana-poche-kargerova.jpg" alt="Jana Poche Kargerová">
 						<label class="name">
 							Jana Poche Kargerová
 						</label>
+						<div class="modal" id="kargerova">
+							<div class="content">
+								<p><strong>PhDr. Jana Poche Kargerová, Ph.D.</strong> vystudovala FF UK v&nbsp;Praze, doktorát získala na PedF UK. Vyučuje na Pedagogické fakultě UK v&nbsp;Praze, kde se zabývá především didaktikou 1.&nbsp;stupně ZŠ a organizací pedagogických praxí včetně kurzu mentoringu pro fakultní učitele. Je lektorkou vzdělávacího programu Začít spolu a spoluautorkou <i>Metodického průvodce pro 1.&nbsp;stupeň základní školy tohoto programu</i>. Je také autorkou publikace <i>Spolupráce s&nbsp;rodinou a komunitou v&nbsp;programu Začít spolu</i>. Prostřednictvím lektorské činnosti a skupinové reflexe WANDA poskytuje pedagogům podporu v&nbsp;rozvoji jejich profesních kompetencí. Zaměřuje se na implementaci vzájemné kolegiální podpory v&nbsp;základních i mateřských školách.</p>
+								<p>V projektu SPIN má na starost garantování tandemové výuky na KPPP, vedení absolventských kaváren a propojování spolupráce PedF UK a Step by Step, o.p.s.</p>
+							</div>
+						</div>
 					</figure>
 				</div>
 			</div>
@@ -147,6 +172,12 @@
 		</footer>
 
 	</main>
+
+	<script>
+		function modal_toggle(target) {
+			document.getElementById(target).classList.toggle("visible");
+		}
+	</script>
 </body>
 </html>
 
diff --git a/style.css b/style.css
index 9fe32c1..2bf8ff9 100644
--- a/style.css
+++ b/style.css
@@ -101,6 +101,7 @@ main .team figure {
 	padding: 1em;
 	margin: 0;
 }
+main .team figure, main .team figure * { cursor: pointer }
 main .team figure img { width: 100% }
 main .team figure label {
 	display: block;
@@ -145,3 +146,35 @@ footer img {
 footer img.pedf { width: 10em }
 footer img:hover { transform: scale(1.1) }
 
+.modal {
+	visibility: hidden;
+	position: fixed;
+	left: 0;
+	top: 0;
+	width: 100%;
+	height: 100vh;
+
+	display: flex;
+	align-items: center;
+	justify-content: center;
+
+	background-color: rgba(0,0,0,0.5);
+
+	transition: opacity .2s ease-out;
+	opacity: 0;
+}
+.modal .content {
+	max-width: var(--width);
+	padding: 3em;
+	background-color: #fff;
+	transform: translate(0, -2em);
+	transition: transform .2s ease-out;
+}
+.modal.visible {
+	visibility: visible;
+	opacity: 1;
+}
+.modal.visible .content {
+	transform: translate(0);
+}
+