improve my 7th grade linked-information slides

* Use more icons
* Add more explanations to the slides
* Separate some repetition slides, to reuse them more easily

1 files changed, 45 insertions, 17 deletions

diff --git a/Info/7/1/Hypertext/slides.md b/Info/7/1/Hypertext/slides.md
index 57421e0a..15329825 100644
--- a/Info/7/1/Hypertext/slides.md
+++ b/Info/7/1/Hypertext/slides.md
@@ -1,16 +1,16 @@
 ---
 header-includes: |
     \newcommand{\link}[1]{\textcolor{blue}{\underline{\url{#1}}}}
-    \let\tightlist\relax
 ---
 
-## Wiederholung
+## \faIcon{chalkboard-teacher} Wiederholung
 
+\let\tightlist\relax
 * Was ist ein Verweis im Internet?
 * Welcher andere Begriff wird auch oft verwendet?
 * Aus welchen Teilen besteht er?
 
-## Wiederholung - Die Klasse VERWEIS
+## \faIcon{chalkboard-teacher} Wiederholung - Die Klasse VERWEIS
 
 \begin{center}
 \begin{tikzpicture}[font=\Large]
@@ -74,18 +74,20 @@ header-includes: |
 \end{tikzpicture}
 \end{center}
 
-## Verweise graphisch darstellen
+## \faIcon{chalkboard-teacher} Verweise graphisch darstellen {.t}
 
 Wie könnte man mehrere Webseiten mit Verweisen übersichtlich graphisch darstellen?
 
+\pause
+
 ### Als Graph!
 
 \begin{center}
 \begin{tikzpicture}[font=\Large]
 \node[rounded corners, draw, minimum width=1cm] (verweis) {Seite mit Verweis};
 \node[rounded corners, right=3cm of verweis, draw, minimum width=1cm] (verweisziel) {Zielseite};
-\draw[->] (verweis) -- (verweisziel);
-\only<2>{
+\draw[->] (verweis) -- node[yshift=0.5cm, opacity=0] {\includegraphics[keepaspectratio, height=2cm]{img/surfer.png}} (verweisziel);
+\only<3>{
 \draw[->] (verweis) -- node[yshift=0.5cm] {\includegraphics[keepaspectratio, height=2cm]{img/surfer.png}} (verweisziel);
 }
 \end{tikzpicture}
@@ -103,28 +105,44 @@ Wie könnte man mehrere Webseiten mit Verweisen übersichtlich graphisch darstel
 \end{tikzpicture}
 \end{center}
 
-## \faIcon{desktop} Arbeitsauftrag - 10min
+## \faIcon{desktop} Arbeitsauftrag: Rainer und Pyro \hfill 10min {.t}
 
 ::: columns
 :::: {.column width=70%}
-Auf den Webseiten \link{https://schule.muhq.space/klasse7/} sind ebenfalls viele Verweise zu finden.
-\vspace{0.3cm}
+Auf den Webseiten \link{https://bycs.link/rainer-pyro} sind viele Verweise zu finden.
 
-Die nebenstehende Abbildung verdeutlicht, welche Webseiten miteinander verknüpft sind. Die Übersicht ist aber nicht fertig. 
-\vspace{0.3cm}
+Die rechte Abbildung verdeutlicht, welche Webseiten miteinander verknüpft sind.
+Die Übersicht ist aber nicht fertig. 
 
-**Übernehme die Abbildung auf ein Blatt, rufe die Webseite auf und ergänze die fehlenden Teile.**
+\begin{tikzpicture}
+\only<1>{
+  \node[minimum height=2cm] {\includegraphics[keepaspectratio, width=0.9\textwidth]{img/rainer-pyro-index.png}};
+  \node[draw=red, line width=0.75pt, minimum width=1.2cm, minimum height=0.4cm, anchor=west] at (-0.3cm, 0.7cm) {};
+}
+\only<2>{
+  \node {\includegraphics[keepaspectratio, width=0.9\textwidth]{img/rainer.png}};
+  \node[draw=red, line width=0.75pt, minimum width=1.7cm, minimum height=0.6cm, anchor=west] at (2.6cm, 0.7cm) {};
+}
+\end{tikzpicture}
 ::::
 
 :::: {.column width=30%}
 \begin{tikzpicture}[font=\Large]
-\node[rounded corners, draw] (index) {\textbf{index.html}};
-\node[rounded corners, below=3cm of verweis, draw, xshift=-0.2cm] (rainer) {\textbf{rainer.html}};
-\draw[->] (index) -- (rainer);
+\only<1>{
+  \node[rounded corners, draw, fill=orange!50] (index) {\textbf{index.html}};
+}
+\only<2->{
+  \node[rounded corners, draw] (index) {\textbf{index.html}};
+  \node[rounded corners, fill=orange!50, below=3cm of verweis, draw, xshift=-0.2cm] (rainer) {\textbf{rainer.html}};
+  \draw[->] (index) -- (rainer);
+}
 \end{tikzpicture}
 ::::
 :::
 
+\vspace{1cm}
+**Übernehme die Abbildung auf ein Blatt, rufe die Webseite auf und ergänze die fehlenden Teile.**
+
 ##
 
 ![](img/pokemon-hyperstruktur.png){.center}
@@ -155,18 +173,28 @@ Beispiel: *\<Bild deines Graphens\>*
 
 `\end{tcolorbox}`{=latex}
 
-## \faIcon{desktop} \faIcon{pencil-alt} Arbeitsauftrag - 10min
+## \faIcon{desktop} \faIcon{pencil-alt} Arbeitsauftrag: Nachbarländer Italiens \hfill 10min
 
 Informiere dich auf \link{de.wikipedia.org/wiki/Italien} über alle Staaten, die an Italien grenzen und stelle die Beziehung in einem Graphen dar. 
 \vspace{1cm}
 
+\begin{tcolorbox}[title=Möglicher Start]
+\centering
+\begin{tikzpicture}
+  \node[draw, rounded corners=2pt] (it) {Italien};
+  \node[draw, rounded corners=2pt, left=of it] (au) {Österreich};
+  \draw (it) -- (au);
+\end{tikzpicture}
+\end{tcolorbox}
+
+\vspace{1cm}
 **Vergiss die beiden Kleinstaaten innerhalb Italiens nicht!**
 
 ##
 
 ![](img/italien-hyperstruktur.png){.center}
 
-## \faIcon{desktop} Arbeitsauftrag - Wissenswertes über Italien
+## \faIcon{desktop} Arbeitsauftrag: Wissenswertes über Italien
 
 Übertrage den Graphen in eine **Hypertextstruktur**.