MIUN - Design Library

BlockContainerBlock 

<div class="block-container-block">
    <div class="block-container-block-header">
        <h3 class="heading-level-3 block-container-block-title">Kunskapsbank</h3>
        <div class="pull-right">
            <a href="www.google.se">Visa mer</a>
        </div>
    </div>
    <div class="block-container-wrapper">
        <div class="link-block" data-link="https://google.com">
            <div class="link-block-item">
                <figure class="lazyload" data-bg="https://picsum.photos/600/400">
                    <img class="sr-only lazyload" data-src="https://picsum.photos/600/400" alt="Ons 12 dec">
                    <figcaption>Ons 12 dec</figcaption>
                </figure>
                <h2 class="heading-level-3"><a href="https://google.com">Full width</a></h2>
                <p>ETOUR bedriver forskning och utbildning i nära dialog och samverkan med aktörer inom turistnäringen med fokus på fyra forskningsområden.</p>

            </div>
        </div>

    </div>
</div>
 
<div class="block-container-block">
    <div class="block-container-block-header">
        {{#if title}}
        <h3 class="heading-level-3 block-container-block-title">{{title}}</h3>
        {{/if}}
        {{#if link.url}}
        <div class="pull-right">
            <a href="{{link.url}}">{{link.text}}</a>
        </div>
        {{/if}}
    </div>
    <div class="block-container-wrapper">
        {{#epiblockareahascontent 'BlockContainerContentArea'}}
        {{#epiblockarea 'BlockContainerContentArea'}}
        {{render '@linkedcontentbannerblock'}}
        {{/epiblockarea}}
        {{/epiblockareahascontent}}
    </div>
</div>
 
{
  "title": "Kunskapsbank",
  "link": {
    "text": "Visa mer",
    "url": "www.google.se"
  }
}
  • Content: 
    .block-container-block{
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    margin-bottom: $md-space;
    .block-container-block-header{
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        padding-top: 20px;
        margin-top: 80px;
        padding-bottom: 44px;
        border-top: 1px solid rgb(229, 229, 229);
    }
    .block-container-block-title{
        margin-bottom: 0px;
    }

}
  • URL: /components/raw/blockcontainerblock/BlockContainerBlock.scss
  • Filesystem Path: src\components\02-block_components\BlockContainerBlock\BlockContainerBlock.scss
  • Size: 588 Bytes

There are no notes for this item.