Tipps & Tricks der #moodlebande

Mit den folgenden Codeschnipseln lassen sich die Kacheln formatieren (Editor in den Textmodus)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
    // Formatierung der Kacheln
    // <![CDATA[
    $(document).ready(function() {
        $('ul.tiles .tile').css('border-radius', '0.25rem');
//        $('ul.tiles .tile').css('background-image', 'linear-gradient(0deg,#cfe2f3 0%, #cfe2f3 100%)');
        $('ul.tiles .tile').css('background-image', 'linear-gradient(0deg,#f2f2f2 0%, #f2f2f2 100%)');
//        $('ul.tiles .tile').css('border-top-color', '#cfe2f3');
        $('ul.tiles .tile').css('border-top-color', '#f2f2f2');
        $('ul.tiles .tile').css('border-top', '.0em solid #0000');
        $('ul.tiles .tile').css('max-height', '120px');
        $('.format-tiles .tileiconcontainer .icon').css('width', '42px');
        $('.format-tiles .tileiconcontainer .icon').css('height', '42px');
        $('.tile-text').css('height', '70px');
        $('.tile-text').css('margin-top', '-15px');
//        $('.tile-text').css('font-size', '1.0rem');
//        $('.tile-text').css('font-weight', '600');
        $('.photo-tile-text h3').css('color', '#083a66');
        $('.photo-tile-text h3').css('background-color', 'rgba(0,0,0,0)');
        $('.photo-tile-text h3').css('font-size', '1.25rem');
        $('.photo-tile-text h3').css('font-weight', '400');
    });
    // ]]>
</script>

<style>
.format-tiles .sectiontitle::after, .format-tiles .badge-info {
    background-color: rgb(204, 204, 204);
}
</style>

<!--
<style>
.tile.current::after {
content: "Aktuelles Thema";
background-color: rgba(255,0,0, 0.7);
color: rgba(255,255,255,.85);
padding: 2px 7px 2px 7px;
position: absolute;
bottom: 40px;
left:0px;
font-size:1.1em;
text-align:center;
 width: 100%;
}
</style>
-->

<style>
.tile.current::after {
content: "!";
background-color: rgba(255,0,0,0.25); // rgba(15,108,191, 0.25);
border-radius:0.25rem;
color: rgba(0,0,0, 0.0);
padding: 2px 7px 2px 7px;
position: absolute;
bottom: 0px;
left:0px;
font-size:78px; // 6.0em;
text-align:center;
width: 100%;
}
</style>

<!-- Aktuelles Thema - aktueller Abschnitt -->

<!-- <style>
#aktuellesthema {
color: rgba(255,255,255,1.0);
background-color: #ff0000;
text-align: center;
display:inline;
padding: .375rem .75rem;
}

 #aktuellesthema::before {
 content: " ";
 height: 120px;
 margin-top: -120px;
}
</style>
-->