rycus86/demo-site

<div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--8-col mdl-cell--top">

    <div class="mdl-card__title mdl-card--border">
        <h2 class="mdl-card__title-text">Welcome</h2>
    </div>

    <div class="mdl-card__supporting-text markdown">
        {{ markdown(read('home/intro.md'))|safe }}
    </div>

    <div class="mdl-card__actions mdl-card--border card-actions-dark">
        <div class="mdl-layout-spacer"></div>
        <a href="/page/specs" data-target-tab="specs"
           class="mdl-button mdl-js-button mdl-js-ripple-effect">
            How it works
            <i class="material-icons">launch</i>
        </a>
    </div>

</div>

<div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--8-col mdl-cell--top">

    <div class="mdl-card__title mdl-card--border">
        <h2 class="mdl-card__title-text">Components</h2>
    </div>

    <div class="mdl-card__supporting-text markdown">
        {{ markdown(read('home/components.md'))|safe }}
    </div>

</div>

<div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--8-col mdl-cell--top">

    <div class="mdl-card__title mdl-card--border">
        <h2 class="mdl-card__title-text">Acknowledgements</h2>
    </div>

    <div class="mdl-card__supporting-text markdown">
        {{ markdown(read('home/acknowledgements.md'))|safe }}
    </div>

</div>