No notes defined.

<div class='c-dashboard-block'>

    <header class='c-dashboard-block__header'>
        <h1 class='c-heading c-heading--minor c-dashboard-block__heading'>
            Dashboard block
        </h1>
        <div class='c-dashboard-block__header__actions'>
            <a class='c-button c-button--small c-dashboard-block__button' href="#">Take action</a>
        </div>
    </header>

    <div class='c-dashboard-block__content-wrapper'>
        <section class='c-figures c-dashboard-block__figures'>
            <ul class='c-figures__items d-flex u-list--unstyled'>

                <li class='c-figures__items__item'>
                    <figure class='c-stat c-stat--small c-stat--bubble '>
                        <span class='c-stat__text'>
                            <span class='c-stat__figure'><span class='c-stat__number'>201</span> </span>
                            <figcaption class='c-stat__caption'>
                                <strong class='c-stat__highlight'>Workshops & Events</strong>
                            </figcaption>
                        </span>
                    </figure>
                </li>
                <li class='c-figures__items__item'>
                    <figure class='c-stat c-stat--small c-stat--bubble c-stat--notice '>
                        <span class='c-stat__text'>
                            <span class='c-stat__figure'><span class='c-stat__number'>201</span> </span>
                            <figcaption class='c-stat__caption'>
                                <strong class='c-stat__highlight'>Workshops & Events</strong>
                            </figcaption>
                        </span>
                    </figure>
                </li>
                <li class='c-figures__items__item'>
                    <figure class='c-stat c-stat--small c-stat--bubble c-stat--error '>
                        <span class='c-stat__text'>
                            <span class='c-stat__figure'><span class='c-stat__number'>8347</span> </span>
                            <figcaption class='c-stat__caption'>
                                <strong class='c-stat__highlight'>Participants</strong>
                            </figcaption>
                        </span>
                    </figure>
                </li>
                <li class='c-figures__items__item'>
                    <figure class='c-stat c-stat--small c-stat--bubble c-stat--success '>
                        <span class='c-stat__text'>
                            <span class='c-stat__figure'><span class='c-stat__number'>71</span> </span>
                            <figcaption class='c-stat__caption'>
                                <strong class='c-stat__highlight'>Cities</strong>
                            </figcaption>
                        </span>
                    </figure>
                </li>
            </ul>
        </section>

        <div class='c-dashboard-block__entities c-dashboard-block__entities--list-item c-dashboard-block__entities--entities c-dashboard-block__entities--dashboard-block c-dashboard-block__entities__dashboard-block__entities'>
            <ul class='c-dashboard-block__entities__items  u-list--unstyled'>
                <li class='c-dashboard-block__entities__items__item '>

                    <article class='c-meeting meeting type-meeting c-meeting--scheduled c-dashboard-block__meeting c-dashboard-block__meeting--list-item c-meeting--list-item'>
                        <div class='c-meeting__date-wrapper'>

                            <time class='c-date c-date--graphic c-date--block  dt-start ' datetime='15.07.2020, 19:17 CEST' />
                            <span class='c-date__day'>15</span><span class='c-date__month'>07</span><span class='c-date__year'>2020</span> </time>

                        </div>
                        <div class='c-meeting__content-wrapper'>
                            <h1 class='c-heading c-heading--minor c-meeting__heading'>
                                <a class='c-link c-link--minor c-meeting__link ' href="#" itemprop="item" itemid="#"><span itemprop="name">Blue Monday Project & Georg Woschnagg</span></a>
                            </h1>
                            <p class='c-meeting__stage'><span class='c-tag c-tag--scheduled c-dashboard-block__tag'>Scheduled</span></p>
                            <p class='c-meta c-meeting__meta'>

                                <time class='c-date c-meeting__date  dt-start ' datetime='15.07.2020, 19:17 CEST' />
                                15.07.2020, 19:17 CEST
                                </time>

                                | 60 minutes
                            </p>
                            <div class='c-action-bar c-list-item__action-bar'>
                                <div class='c-action-bar__links '>
                                    <a class='c-link c-link--undefined c-link--with-icon c-link--minimal ' href="" itemprop="item" itemid=""><span itemprop="name">View more</span></a>
                                </div>
                            </div>
                        </div>
                    </article>
                </li>
                <li class='c-dashboard-block__entities__items__item '>

                    <article class='c-meeting meeting type-meeting c-meeting--finished c-dashboard-block__meeting c-dashboard-block__meeting--list-item c-meeting--list-item'>
                        <div class='c-meeting__date-wrapper'>

                            <time class='c-date c-date--graphic c-date--block  dt-start ' datetime='13.07.2020, 19:17 CEST' />
                            <span class='c-date__day'>15</span><span class='c-date__month'>07</span><span class='c-date__year'>2020</span> </time>

                        </div>
                        <div class='c-meeting__content-wrapper'>
                            <h1 class='c-heading c-heading--minor c-meeting__heading'>
                                <a class='c-link c-link--minor c-meeting__link ' href="#" itemprop="item" itemid="#"><span itemprop="name">Blue Monday Project & Georg Woschnagg</span></a>
                            </h1>
                            <p class='c-meeting__stage'><span class='c-tag c-tag--finished c-dashboard-block__tag'>Finished</span></p>
                            <p class='c-meta c-meeting__meta'>

                                <time class='c-date c-meeting__date  dt-start ' datetime='13.07.2020, 19:17 CEST' />
                                13.07.2020, 19:17 CEST
                                </time>

                                | 90 minutes
                            </p>
                            <div class='c-action-bar c-list-item__action-bar'>
                                <div class='c-action-bar__links '>
                                    <a class='c-link c-link--undefined c-link--with-icon c-link--minimal ' href="" itemprop="item" itemid=""><span itemprop="name">View more</span></a>
                                </div>
                            </div>
                        </div>
                    </article>
                </li>
            </ul>

        </div>
    </div>

    <footer class='c-dashboard-block__footer'>
        <div class='c-action-bar c-dashboard-block__action-bar'>
            <div class='c-action-bar__links '>
                <a class='c-link c-link--undefined c-link--with-icon c-link--minimal ' href="" itemprop="item" itemid=""><span itemprop="name">View more</span></a>
            </div>
        </div>
    </footer>
</div>
<div class='{{ get_component_class( 'dashboard-block', display ) }}'>
    
    {% if heading or button %}
        <header class='c-dashboard-block__header'>
            {% if heading %}
                {% include get_template( 'heading', 'unit' ) with heading|merge( { display: { component: 'dashboard-block', modifiers: [ 'minor' ] } } ) %}
            {% endif %}
            {% if button %}
                <div class='c-dashboard-block__header__actions'>
                    {% include get_template( 'button', 'base' ) with button|merge( { display: { component: 'dashboard-block', modifiers: [ 'small' ] } } ) %}
                </div>
            {% endif %}
        </header>
    {% endif %}
    
    <div class='c-dashboard-block__content-wrapper'>
        {% if stats %}
            {% include get_template( 'figures', 'group' ) with stats %}
        {% endif %}

        {% if issues %}
            {% include get_template( 'task-list', 'unit' ) with issues|merge( { display: { component: entityType } } ) %}
        {% endif %}

        {% if collection %}
            {% include get_template( 'collection', 'group' ) with collection %}
        {% elseif entities %}
            {% include get_template( 'entities', 'group' ) with entities|merge( { 
                display: { component: 'dashboard-block__entities' },
            } ) %}
        {% elseif entity %}
            {% if entity.rendered %}
                {{ entity.rendered }}
            {% else %}
                {% include get_entity_template( entityTemplate, entity.display ) with entity %}
            {% endif %}
        {% elseif taskList %}
            {% include get_template( 'task-list', 'unit' ) with taskList|merge( { 
                display: { component: 'dashboard-block' },
                heading: NULL,
            } ) %}
        {% elseif fields %}
            {% include get_template( 'fields', 'group' ) with fields %}
        {% elseif table %}
            {% include get_template( 'table', 'group' ) with table %}
        {% elseif indexCard %}
            {% include get_template( 'index-card', 'unit' ) with indexCard %}
        {% elseif timeline %}
            {% include get_template( 'timeline', 'unit' ) with timeline %}
        {% elseif blankSlate %}
            {% include get_template( 'blank-slate', 'unit' ) with blankSlate|merge( { 
                display: { component: 'dashboard-block' },
                button: NULL
            } ) %}
        {% endif %}
    </div>

    {% if links %}
        <footer class='c-dashboard-block__footer'>
            {% include get_template( 'action-bar', 'unit' ) with {
                display: {
                    component: 'dashboard-block'
                },
                links: links,
                button: NULL,
            } %}
        </footer>
    {% endif %}
</div>
{
  "heading": {
    "text": "Dashboard block"
  },
  "button": {
    "text": "Take action",
    "url": "#"
  },
  "icon": {
    "display": {
      "component": "dashboard-block",
      "modifiers": [
        "x-large"
      ]
    },
    "basename": "noun_Quality badge_1353889.svg"
  },
  "blankSlate": {
    "icon": {
      "display": {
        "component": "blank-slate",
        "modifiers": [
          "x-large"
        ]
      },
      "basename": "noun_Quality badge_1353889.svg"
    },
    "header": {
      "heading": {
        "display": {
          "component": "blank-slate"
        },
        "text": "Meetings"
      }
    },
    "lead": {
      "content": "<p>A blank slate is presented when a screen or a screen section is empty.</p>"
    }
  },
  "theme": "education",
  "links": [
    {
      "url": "#",
      "text": "View more"
    }
  ],
  "stats": {
    "display": {
      "component": "dashboard-block"
    },
    "statModifiers": [
      "small",
      "bubble"
    ],
    "heading": null,
    "items": [
      {
        "figure": 201,
        "caption": "Workshops & Events",
        "icon": null
      },
      {
        "display": {
          "modifiers": [
            "notice"
          ]
        },
        "figure": 201,
        "caption": "Workshops & Events",
        "icon": null
      },
      {
        "display": {
          "modifiers": [
            "error"
          ]
        },
        "figure": 8347,
        "caption": "Participants",
        "icon": null
      },
      {
        "display": {
          "modifiers": [
            "success"
          ]
        },
        "figure": 71,
        "caption": "Cities",
        "icon": null
      }
    ]
  },
  "entities": {
    "collection": {
      "entityType": "meeting",
      "display": {
        "component": "dashboard-block",
        "view_mode": "list-item"
      },
      "items": [
        {
          "heading": {
            "display": {
              "component": "boarding-pass",
              "modifiers": [
                "minor"
              ]
            },
            "text": "Blue Monday Project & Georg Woschnagg",
            "url": "#"
          },
          "stage_literal": "Scheduled",
          "display": {
            "modifiers": [
              "scheduled"
            ]
          },
          "duration": "60 minutes",
          "date": {
            "display": {
              "modifiers": [
                "graphic",
                "block"
              ]
            },
            "formatted": "15.07.2020, 19:17 CEST",
            "weekday": "Monday",
            "day": 15,
            "month": "07",
            "year": 2020,
            "time": null,
            "timezone": null
          },
          "button": null
        },
        {
          "heading": {
            "display": {
              "component": "boarding-pass",
              "modifiers": [
                "minor"
              ]
            },
            "text": "Blue Monday Project & Georg Woschnagg",
            "url": "#"
          },
          "stage_literal": "Finished",
          "display": {
            "modifiers": [
              "finished"
            ]
          },
          "duration": "90 minutes",
          "date": {
            "display": {
              "modifiers": [
                "graphic",
                "block"
              ]
            },
            "formatted": "13.07.2020, 19:17 CEST",
            "weekday": "Monday",
            "day": 15,
            "month": "07",
            "year": 2020,
            "time": null,
            "timezone": null
          },
          "button": null
        }
      ]
    }
  }
}