Sindbad~EG File Manager

{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
<div class="block09 block09design3 blockbgwhite">
  <div class="container">
      <div id="block09design3-slider" class="splide" >
          <div class="splide__track" >
              <ul class="splide__list " >
                {{#block09}}
                {{#block09background}}
                    <li class="splide__slide ">
                        <div class="card text-center">
                          <div class="card-body {{^bgcolor}}single-box{{/bgcolor}} {{#bgcolor}}single-box-color{{/bgcolor}}" 
                                    {{#imgurl}}  style= "background-image: url({{{imgurl}}});"{{/imgurl}}
                                    {{#bgcolor}} style= "background-color:{{bgcolor}};"{{/bgcolor}}
                                    >
                            <div class="{{^bgcolor}}single-box-alt{{/bgcolor}}{{#bgcolor}}single-box-alt-color{{/bgcolor}}"
                                        style="background-color: {{sitecolor}} ;">
                              <a class="text-decoration-none text-white" href="{{catagoryURL}}">
                                <h6 class="card-title">{{#shortentext}} 37, {{catagoryname}} {{/shortentext}}</h6>
                              </a>
                              <p class="card-text text-white">{{#str}} over, theme_almondb {{/str}} {{coursecount}} {{#str}}courses, moodle {{/str}}</p>
                            </div>  
                          </div>
                        </div>
                    </li>
                {{/block09background}}   
                {{^block09background}}
                <li class="splide__slide ">
                  <div class="">
                      <div class="card text-center">
                          <div class="card-body">
                            <a class="text-decoration-none hytext" href="{{catagoryURL}}">
                              <h6 class="card-title">{{#shortentext}} 37, {{catagoryname}} {{/shortentext}}</h6>
                              <p class="card-text">{{#str}} over, theme_almondb {{/str}} {{coursecount}} {{#str}}courses, moodle {{/str}}</p>
                            </a>
                          </div>
                      </div>
                  </div>
                </li>  
                {{/block09background}}
                {{/block09}}    
              </ul>
          </div>
      </div>
  </div>
</div>   
<script>
document.addEventListener( 'DOMContentLoaded', function () {
  new Splide( '#block09design3-slider', {
        type    : 'loop',
        autoplay: true,
        gap: '1rem',
        perPage: 4,
        perMove: 1,
        pagination: false,
        direction: document.dir,
        breakpoints: {
            1200:{ 
              perPage: 3,
            },
            980:{
                perPage: 2,
            },
            700: {
                perPage: 1,
                pagination: false,
        },
      }
  } ).mount();
} );
</script>