Lunds universitet - Style Guide

Event Card Row 

<div class=" swipe  swipe-sm-none" id="event-card-row">
    <div class="row swipe-inner" style="width: calc(300% - 30px);">
        <div class="col swipe-target col-sm-6 col-md-4 col-xl-3 mb-sm-5" id="event-card-row-target-0">
            <a href="../preview/event-detail-page.html" class="card nav-block nav-block-plaster-25 nav-block-hover-plaster-25 h-100" aria-label="Lorem ipsum dolor sit amet">
                <div class="card-img p-2">
                    <div class="card-img-container">
                        <img src="../../images/_content/science-3x2@1x.jpg" srcset="../../images/_content/science-3x2@1x.jpg 1x, ../../images/_content/science-3x2@2x.jpg 2x" alt="image description">

                    </div>
                </div>
                <div class="card-body">
                    <div class="meta ">
                        <span class="meta-date">8 juni, kl 11:00</span>
                        <span class="meta-category">SEMINARIUM</span>
                        <div class="meta-location">Plats: Skissernas museeum</div>
                    </div>

                    <h3 class=" card-title nav-block-link mt-2">Detection and Localisation of Gunshots Using Sound Data</h3>

                </div>
            </a>

        </div>
        <div class="col swipe-target col-sm-6 col-md-4 col-xl-3 mb-sm-5" id="event-card-row-target-1">
            <a href="../preview/event-detail-page.html" class="card nav-block nav-block-plaster-25 nav-block-hover-plaster-25 h-100" aria-label="Lorem ipsum dolor sit amet">
                <div class="card-img p-2">
                    <div class="card-img-container">
                        <img src="../../images/_content/placeholder_1@1x.jpg" srcset="../../images/_content/placeholder_1@1x.jpg 1x, ../../images/_content/placeholder_1@2x.jpg 2x" alt="image description">

                    </div>
                </div>
                <div class="card-body">
                    <div class="meta ">
                        <span class="meta-date">8 juni, kl 11:00</span>
                        <span class="meta-category">SEMINARIUM</span>
                        <div class="meta-location">Plats: Skissernas museeum</div>
                    </div>

                    <h3 class=" card-title nav-block-link mt-2">"Asset and Liability Management: Optimization using Least-Squares Monte Carlo"</h3>

                </div>
            </a>

        </div>
        <div class="col swipe-target col-sm-6 col-md-4 col-xl-3 mb-sm-5" id="event-card-row-target-2">
            <a href="../preview/event-detail-page.html" class="card nav-block nav-block-plaster-25 nav-block-hover-plaster-25 h-100" aria-label="Lorem ipsum dolor sit amet">
                <div class="card-img p-2">
                    <div class="card-img-container">
                        <img src="../../images/default/seal-300x200@1x.jpg" srcset="../../images/default/seal-300x200@1x.jpg 1x, ../../images/default/seal-300x200@2x.jpg 2x" alt="image description">

                    </div>
                </div>
                <div class="card-body">
                    <div class="meta ">
                        <span class="meta-date">8 juni, kl 11:00</span>
                        <span class="meta-category">SEMINARIUM</span>
                        <div class="meta-location">Plats: Skissernas museeum</div>
                    </div>

                    <h3 class=" card-title nav-block-link mt-2">Application of Convolutional Neural Networks for Fingerprint Recognition</h3>

                </div>
            </a>

        </div>
        <div class="col  col-sm-6 col-md d-none d-sm-flex mb-sm-5">
            <a href="../preview/events-ongoing-page.html" class="nav-block p-3 h-100 w-100 flex-column justify-content-between  nav-block-flower-50 nav-block-hover-flower-50">
                <div class="mb-5">
                    <h3 class=" h2 m-0 nav-block-link">Kommande disputationer vid Lunds universitet</h3>

                </div>
                <div class="nav-block-link  align-self-end nav-block-link">Kommande disputationer&nbsp;<i class="fal fa-chevron-circle-right  fa-lg"></i>
                </div>

            </a>

        </div>
    </div>
</div>
<div class="swipe-steps d-sm-none" data-spy="scroll-x" data-source="#event-card-row"></div>
<div class="container-fluid d-sm-none">
    <a href="/components/preview/events-ongoing-page" class="nav-block w-100 p-3 mt-5 justify-content-center nav-block-flower-50 nav-block-hover-flower-50">
        <div class="nav-block-link  align-self-end nav-block-link">Kommande disputationer&nbsp;<i class="fal fa-chevron-circle-right  fa-lg"></i>
        </div>

    </a>
</div>
 
{{render "@swipe" swipe}}
 
{
  "swipe": {
    "id": "event-card-row",
    "container": [],
    "modifiers": [
      "swipe-sm-none"
    ],
    "item-modifiers": [
      "col-sm-6",
      "col-md-4",
      "col-xl-3",
      "mb-sm-5"
    ],
    "steps-modifiers": [
      "d-sm-none"
    ],
    "items": [
      {
        "heading": {
          "content": "Detection and Localisation of Gunshots Using Sound Data",
          "modifiers": [
            "card-title",
            "nav-block-link",
            "mt-2"
          ]
        },
        "meta": {
          "date": "8 juni, kl 11:00",
          "category": "SEMINARIUM",
          "location": "Skissernas museeum"
        },
        "image": {
          "src": "/images/_content/science-3x2@1x.jpg",
          "src-2x": "/images/_content/science-3x2@2x.jpg",
          "alt": "image description"
        },
        "link": "/components/preview/event-detail-page"
      },
      {
        "heading": {
          "content": "\"Asset and Liability Management: Optimization using Least-Squares Monte Carlo\"",
          "modifiers": [
            "card-title",
            "nav-block-link",
            "mt-2"
          ]
        },
        "meta": {
          "date": "8 juni, kl 11:00",
          "category": "SEMINARIUM",
          "location": "Skissernas museeum"
        },
        "image": {
          "src": "/images/_content/placeholder_1@1x.jpg",
          "src-2x": "/images/_content/placeholder_1@2x.jpg",
          "alt": "image description"
        },
        "link": "/components/preview/event-detail-page"
      },
      {
        "heading": {
          "content": "Application of Convolutional Neural Networks for Fingerprint Recognition",
          "modifiers": [
            "card-title",
            "nav-block-link",
            "mt-2"
          ]
        },
        "meta": {
          "date": "8 juni, kl 11:00",
          "category": "SEMINARIUM",
          "location": "Skissernas museeum"
        },
        "image": {
          "src": "/images/default/seal-300x200@1x.jpg",
          "src-2x": "/images/default/seal-300x200@2x.jpg",
          "alt": "image description"
        },
        "link": "/components/preview/event-detail-page"
      }
    ],
    "cta": {
      "item-modifiers": [
        "col-sm-6",
        "col-md",
        "d-none",
        "d-sm-flex",
        "mb-sm-5"
      ],
      "cta-modifiers": [
        "d-sm-none"
      ],
      "link": "/components/preview/events-ongoing-page",
      "heading": {
        "content": "Kommande disputationer vid Lunds universitet",
        "modifiers": [
          "h2",
          "m-0",
          "nav-block-link"
        ]
      },
      "read-more-link": {
        "text": "Kommande disputationer",
        "modifiers": [
          "align-self-end",
          "nav-block-link"
        ]
      },
      "modifiers": [
        "nav-block-flower-50",
        "nav-block-hover-flower-50"
      ]
    }
  }
}

There are no notes for this item.