College of Business Style Guide

Events Section 

<section class="events-section" role="region" aria-label="events section">
    <h2>Upcoming Events</h2>
    <div class="events-listings">
        <div class="event">
            <div class="event-image">
                <img src="/images/Rowing.png" alt="Go Campaign" />
            </div>
            <div class="event-details">
                <p class="event-date">Friday, May 10</p>
                <p class="event-title">Lehigh University Women's Rowing at Dad Vail Regatta</p>
                <a href="#" class="event-url">Learn More</a>
                <a href="#" class="event-url">Register for Event</a>
            </div>
        </div><!-- end events -->
        <div class="event">
            <div class="event-image">
                <img src="/images/Rowing.png" alt="Go Campaign 2" />
            </div>
            <div class="event-details">
                <p class="event-date">Saturday, May 11</p>
                <p class="event-title">Lehigh University Women's Rowing at Dad Vail Regatta</p>
                <a href="#" class="event-url">Learn More</a>
                <a href="#" class="event-url">Register for Event</a>
            </div>
        </div><!-- end events -->
        <div class="event">
            <div class="event-image">
                <img src="/images/Rowing.png" alt="Go Campaign 2" />
            </div>
            <div class="event-details">
                <p class="event-date">Sunday, May 12</p>
                <p class="event-title">Lehigh University Women's Rowing at Dad Vail Regatta</p>
                <a href="#" class="event-url">Learn More</a>
                <a href="#" class="event-url">Register for Event</a>
            </div>
        </div><!-- end events -->
    </div><!-- news-items -->
    <a href="">View More Events</a>
</section>
 
<section class="events-section" role="region" aria-label="events section">
    <h2>{{ events_section_title }}</h2>
    <div class="events-listings">
      {% block cms_override %}
        {% for events_item in events_items %}
            {% include "@event_circle" with {
                img_src: events_item.img_src,
                img_alt: events_item.img_alt,
                date: events_item.date,
                title: events_item.title,
                url: events_item.url,
                registration_url: events_item.registration_url
            } %}
        {% endfor %}
      {%  endblock cms_override %}
    </div><!-- news-items -->
    {% block cms_override_link %}
      <a href="{{ url }}">View More Events</a>
    {% endblock cms_override_link %}
</section>
 
{
  "events_section_title": "Upcoming Events",
  "events_items": {
    "1": {
      "img_src": "/images/Rowing.png",
      "img_alt": "Go Campaign",
      "date": "Friday, May 10",
      "title": "Lehigh University Women's Rowing at Dad Vail Regatta",
      "url": "#",
      "registration_url": "#"
    },
    "2": {
      "img_src": "/images/Rowing.png",
      "img_alt": "Go Campaign 2",
      "date": "Saturday, May 11",
      "title": "Lehigh University Women's Rowing at Dad Vail Regatta",
      "url": "#",
      "registration_url": "#"
    },
    "3": {
      "img_src": "/images/Rowing.png",
      "img_alt": "Go Campaign 2",
      "date": "Sunday, May 12",
      "title": "Lehigh University Women's Rowing at Dad Vail Regatta",
      "url": "#",
      "registration_url": "#"
    }
  }
}

No notes defined.