University of Leeds Design System v1.0.13

News And Events Widget: 3 Cards With Summary Only

No notes defined.

{% extends '@uol-widget' %}

{% block widget_content %}
  {% render '@uol-cards', { 
    cards: cards
  } %}
{% endblock %}
 
<div class="uol-widget-container">
    <div class="uol-widget uol-widget--news-events">

        <div class="uol-widget__left-col">

            <div class="uol-widget__head">

                <h2 class="uol-widget__title">News and Events widget</h2>

                <div class="uol-widget__lead">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem sequi animi exercitationem sunt. Eos consequatur, eveniet nulla beatae nisi voluptatibus.</p>
                </div>

                <a class="uol-widget__link" href="/news">View all this news</a>

            </div>

        </div>

        <div class="uol-widget__content">

            <ul class="uol-cards  uol-cards--count-3  ">

                <li class="uol-cards__card uol-cards__card--without-image">
                    <div class="uol-cards__card__text-wrapper">
                        <h3 class="uol-cards__card__title">
                            <a class="uol-cards__card__link " href="#">

                                A short title 1

                            </a>
                        </h3>

                        <time class="uol-cards__card__date" datetime="2021-05-07">7 May 2021</time>

                        <p class="uol-cards__card__text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.</p>

                    </div>

                </li>

                <li class="uol-cards__card uol-cards__card--without-image">
                    <div class="uol-cards__card__text-wrapper">
                        <h3 class="uol-cards__card__title">
                            <a class="uol-cards__card__link " href="#">

                                Leeds signs up to tackle waste in fashion 2

                            </a>
                        </h3>

                        <time class="uol-cards__card__date" datetime="2021-05-07">7 May 2021</time>

                        <p class="uol-cards__card__text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.</p>

                    </div>

                </li>

                <li class="uol-cards__card uol-cards__card--without-image">
                    <div class="uol-cards__card__text-wrapper">
                        <h3 class="uol-cards__card__title">
                            <a class="uol-cards__card__link " href="#">

                                Northern universities launch new investment company 3

                            </a>
                        </h3>

                        <time class="uol-cards__card__date" datetime="2021-05-07">7 May 2021</time>

                        <p class="uol-cards__card__text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.</p>

                    </div>

                </li>

            </ul>

        </div>
    </div>
</div>
 
{
  "widget_type": "news-events",
  "widget_title": "News and Events widget",
  "widget_lead": "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem sequi animi exercitationem sunt. Eos consequatur, eveniet nulla beatae nisi voluptatibus.</p>",
  "widget_link": {
    "url": "/news",
    "text": "View all this news"
  },
  "cards": {
    "items": [
      {
        "url": "#",
        "title": "A short title 1",
        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.",
        "date": "2021-05-07"
      },
      {
        "url": "#",
        "title": "Leeds signs up to tackle waste in fashion 2",
        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.",
        "date": "2021-05-07"
      },
      {
        "url": "#",
        "title": "Northern universities launch new investment company 3",
        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada in lorem eu cursus. Duis id ipsum tortor. Suspendisse imperdiet purus id varius tempus. In ac pulvinar elit, at tempus metus.",
        "date": "2021-05-07"
      }
    ]
  }
}