7.2.2.3.1.1 Alte Bereichshervorhebungen

Übersicht zur Überführung[]

Bereichsersetzung1.png
Bereichsersetzung2a.png
Bereichsersetzung2b.png
Bereichsersetzung2c.png
Bereichsersetzung3.png
Wichtig

Dieser Bereich ist noch Diskussionsgrundlage und noch keine finale Empfehlung

Bei der Umstellung von Kursformaten können auch weiterhin die Bereichshervorhebungen des alten Kursdesigns verwendet werden. Sollen die neuen Bereichshervorhebungen verwendet werden, schlagen wir folgende Umformatierung vor:

Altes Kursdesign Neues Kursdesign Code
important-purple hint-box
<div class="hint-box">
<h4></h4>
<p></p>
</div>
link-pink link-box
<div class="link-box">
<h4></h4>
<p></p>
</div>
task-blue exercise-box
<div class="exercise-box">
<h4></h4>
<p></p>
</div>
book-grey custom-icon-box
<div class="custom-icon-box" 
  style="--color: #6688A6; --icon: '\F194">
<h4></h4>
<p></p>
</div>
cal-green info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
quest-orange custom-icon-box
<div class="custom-icon-box" 
  style="--color: #D67E7A; --icon: '\F64E';">
    <h4></h4>
    <p></p>
</div>
example-green info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
watch-turquoise info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
zitat-blue custom-icon-box
<div class="custom-icon-box" 
  style="--color: #6688A6; --icon: '\F6B0';">
    <h4></h4>
    <p></p>
</div>
paragraph-blue custom-icon-box
<div class="custom-icon-box" 
  style="--color: #6688A6; --icon: '\F6B0';">
    <h4></h4>
    <p></p>
</div>
quiz-green exercise-box
<div class="exercise-box">
<h4></h4>
<p></p>
</div>
download-blue link-box
<div class="link-box">
<h4></h4>
<p></p>
</div>
pay-green info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
forum-blue exercise-box
<div class="exercise-box">
<h4></h4>
<p></p>
</div>
certificate-yellow info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
education-orange info-box
<div class="info-box">
<h4></h4>
<p></p>
</div>
docs-grey custom-icon-box
<div class="custom-icon-box" 
  style="--color: #6688A6; --icon: '\F194">
<h4></h4>
<p></p>
</div>
math-blue custom-icon-box
<div class="custom-icon-box" 
  style="--color: #6688A6; --icon: '\F1E0';">
    <h4></h4>
    <p></p>
</div>

alte Hervorhebungen im mooin 1.0 Kursdesign[]

Diese funktionieren immer noch, mit dem neuen Kursdesign wurden aber die neuen Bereichshervorhebungen definiert (s.o.).

Aufgabe[]

Task-blue.png
Code
<div class="task-blue"><h4>Überschrift</h4><p>Text</p></div>

Bibliothek/Links[]

Book-grey.png
Code
<div class="book-grey"><h4>Überschrift</h4><p>Text</p></div>


Externer Link[]

Link-pink.png
Code
<div class="link-pink"><h4>Überschrift</h4><p>Text</p></div>


Termin[]

Cal-green.png
Code
<div class="cal-green"><h4>Überschrift</h4><p>Text</p></div>


Frage[]

Question-orange.png
Code
<div class="quest-orange"><h4>Überschrift</h4><p>Text</p></div>


Beispiel[]

Example-green.png
Code
<div class="example-green"><h4>Überschrift</h4><p>Text</p></div>


Vertiefung[]

Watch-turquoise.png
Code
<div class="watch-turquoise"><h4>Überschrift</h4><p>Text</p></div>


Zitate[]

Zitat-blue.png
Code
<div class="zitat-blue"><h4>Überschrift</h4><p>Text</p></div>


Gesetze und Paragraphen[]

Paragraph-blue.png
Code
<div class="paragraph-blue"><h4>Überschrift</h4><p>Text</p></div>


Quiz[]

Quiz-green.png
Code
<div class="quiz-green"><h4>Überschrift</h4><p>Text</p></div>


Wichtig/Hinweis/Idee[]

Important-purple.png
Code
<div class="important-purple"><h4>Überschrift</h4><p>Text</p></div>


Download[]

Download-blue.png
Code
<div class="download-blue"><h4>Überschrift</h4><p>Text</p></div>


Bezahlen[]

Pay-green.png
Code
<div class="pay-green"><h4>Überschrift</h4><p>Text</p></div>


Forum[]

Forum-blue.png
Code
<div class="forum-blue"><h4>Überschrift</h4><p>Text</p></div>


Zertifikat[]

Certificate-yellow.png
Code
<div class="certificate-yellow"><h4>Überschrift</h4><p>Text</p></div>


Online-Lernmaterial[]

Education-orange.png
Code
<div class="education-orange"><h4>Überschrift</h4><p>Text</p></div>


Verlinkte Datei[]

Docs-grey.png
Code
<div class="docs-grey"><h4>Überschrift</h4><p>Text</p></div>


Formel[]

Math-blue.png
Code
<div class="math-blue"><h4>Überschrift</h4><p>Text</p></div>