Bearbeiten von „Bootstrap“

Bootstrap ist ein Webdesign-Framework, auf dem [[moodle]] Themes basieren. Dadurch lassen sich die Gestaltungsmöglichkeiten von Bootstrap, die auf https://getbootstrap.com/docs/4.6/getting-started/introduction/ dokumentiert sind, unkompliziert in moodle-Kursen nutzen.

=== Farbige Kästen ===
Als wiederkehrende Elemente, z.B. für Aufgabenstellungen, Hinweise und andere "leitende" Elemente, könnten farbige Bootstrap-Kästen genutzt werden. Diese sind über die Klasse "alerts" nutzbar.

'''Beispiel'''<syntaxhighlight lang="html" line="1">
<div class="alert alert-primary" role="alert">
  Ein farbiger Kasten in einem blau, das in der Farb-Variable "primary" moodle-weit festgelegt ist.
</div>
</syntaxhighlight>Alle Beispiele zu alerts bzw. farbigen Bootstrap-Kästen finden Sie hier: https://getbootstrap.com/docs/4.6/components/alerts/

=== Buttons ===
[[Datei:Bootstrap button beispiel.png|mini|Screenshot eines Buttons aus einem moodle-Kurs]]
An vielen Stellen im moodle-Kurs bietet es sich an, Links nicht als typisch unterstrichene Texte darzustellen, sondern in Button-Optik.

Mit den Klassen '''btn btn-primary''' wandelt man einen Link in einen Button um:<syntaxhighlight lang="html">
<a href="#" class="btn btn-primary rounded">Anleitung im mebis Infoportal aufrufen</a>
</syntaxhighlight>

* Die Klasse btn gibt an, dass der Link als Button angezeigt werden soll.
* Die Klasse btn-primary legt die Farbe fest.
* Die Klasse rounded gibt dem Button zeitgemäße, abgerundete Ecken.

Weitere Beispiele und Informationen zu Bootstrap Buttons finden Sie hier: https://getbootstrap.com/docs/4.6/components/buttons/