# Media Object
# Media - Bootstrap 4
snippet med
<div class="media">
    <a class="media-left" href="#$1">
        <img class="media-object" data-src="$2" alt="$3">
    </a>
    <div class="media-body">
        <h4 class="media-heading">${4:Media heading}</h4>
        $5
    </div>
</div>
endsnippet

# Media right - Bootstrap 4
snippet medr
<div class="media">
    <a class="media-right" href="$1#">
        <img class="media-object" data-src="$2" alt="$3">
    </a>
    <div class="media-body">
        <h4 class="media-heading">${4:Media heading}</h4>
        $5
    </div>
</div>
endsnippet

# Media middle - Bootstrap 4
snippet medm
<div class="media">
    <a class="media-left media-middle" href="$1#">
        <img class="media-object" data-src="$2" alt="$3">
    </a>
    <div class="media-body">
        <h4 class="media-heading">${4:Media heading}</h4>
        $5
    </div>
</div>
endsnippet

# Media bottom - Bootstrap 4
snippet medb
<div class="media">
    <a class="media-left media-bottom" href="$1#">
        <img class="media-object" data-src="$2" alt="$3">
    </a>
    <div class="media-body">
        <h4 class="media-heading">${4:Media heading}</h4>
        $5
    </div>
</div>
endsnippet

# Media List - Bootstrap 4
snippet medl
<ul class="media-list">
    <li class="media">
        <a class="media-left href="$1#">
            <img class="media-object" data-src="$2" alt="$3">
        </a>
        <div class="media-body">
            <h4 class="media-heading">${4:Media heading}</h4>
            $5
        </div>
    </li>
    <li class="media">
        <a class="media-left href="$1#">
            <img class="media-object" data-src="$2" alt="$3">
        </a>
        <div class="media-body">
            <h4 class="media-heading">${4:Media heading}</h4>
            $5
        </div>
    </li>
</ul>
endsnippet