<div class="card dashboard-card {{^visible}}dimmed{{/visible}}" role="listitem" data-region="course-content" data-course-id="{{{id}}}">
    <a href="{{courseurl}}" tabindex="-1">
    <div class="card-img dashboard-card-img" style="background-image: url({{{image}}});">
        <span class="sr-only">{{fullname}}</span>
        <div class="course-category">
            {{{category}}}
        </div>
        {{#hasenrolmenticons}}
            <div class="enrolmenticons d-flex">
                {{#enrolmenticons}}
                    <div class="enrolmenticon">
                        {{{.}}}
                    </div>
                {{/enrolmenticons}}
            </div>
        {{/hasenrolmenticons}}
    </div>
    </a>
    <div class="card-body course-info-container">
        <div class="d-flex align-items-start">
            <div class="w-100">
                <a href="{{courseurl}}" class="aalink coursename mr-2 mb-1 {{^visible}}dimmed{{/visible}}">
                {{{fullname}}}
                </a>
            </div>
        </div>

        <div class="customfields">
            {{{customfields}}}
        </div>

        <div class="course-summary">
            {{{summary}}}
        </div>
    </div>
    {{#hasprogress}}
        <div class="d-flex align-items-start">
            <div class="card-footer dashboard-card-footer border-0 bg-white w-100">
                <div class="progress">
                    <div class="progress-bar" role="progressbar" aria-valuenow="{{{progress}}}" style="width: {{{progress}}}%" aria-valuemin="0" aria-valuemax="{{{progress}}}"></div>
                </div>
                <p class="mb-0">{{#str}}completepercent, block_myoverview, {{progress}}{{/str}}</p>
            </div>
        </div>
    {{/hasprogress}}

    {{#hascontacts}}
        <div class="course-contacts">
            {{#contacts}}
                <a href="{{config.wwwroot}}/user/profile.php?id={{{id}}}" class="contact" data-toggle="tooltip" title="{{{fullname}}}">
                <img src="{{{userpicture}}}" class="rounded-circle" alt="{{{fullname}}}">
                <div class="info">
                    <p class="name">{{{fullname}}}</p>
                    <p class="role">{{{role}}}</p>
                </div>
                </a>
            {{/contacts}}
        </div>
    {{/hascontacts}}
</div>