Source: dist/css/virtual_boot.css, line 8349

13.8.2 Video Thumbnail

Description: The header is just a bit of design flair that can be colored, background swapped out and also the icon can be changed to the content of the presentation.

Example s

Default styling

bg_primary

is the default background color

bg_accent

any background color can be swapped out

<header class="flex flex_none flex_row justify_center p-x_4 font_n5">
    <div class="aspect_21x9:md aspect_16x9 bg-blend_multiply bg_primary font-size_down bg_cover bg_no-repeat [modifier] br_2 br_radius br_solid br_white br_white-9 flex flex_shrink grid justify_center max-w_15 max-w_20:md relative shadow_bevel-bold text_center texture_ondemand thumb bg_center">
            <i class="absolute c_white-6 fa-play fas flex_auto self_center text_center w_100"></i>
        </div>
</header>

<header class="flex flex_none flex_row justify_center p-x_4 font_n5">
    <div class="aspect_21x9:md aspect_16x9 bg-blend_multiply bg_primary font-size_down bg_cover bg_no-repeat [modifier] br_2 br_radius br_solid br_white br_white-9 flex flex_shrink grid justify_center max-w_15 max-w_20:md relative shadow_bevel-bold text_center texture_ondemand thumb bg_center">
            <i class="absolute c_white-6 fa-play fas flex_auto self_center text_center w_100"></i>
        </div>
</header>

Code Sample

Copy Code

This Documentation is Moved!