{%
  set classes = [
  'paragraph',
  'paragraph--type--' ~ paragraph.bundle|clean_class,
  view_mode ? 'paragraph--view-mode--' ~ view_mode|clean_class,
  not paragraph.isPublished() ? 'paragraph--unpublished',
  'widget',
  'widget-events-content',
]
%}
{% block paragraph %}

<div{{ attributes.addClass(classes) }}>

  {% block content %}
  {{ content.controls }}
  {{ content.insert_before }}

  <div class="container">
    <div class='widget_events_content_title_all'>
      <h2><strong>{{ paragraph.field_wg_title.0.value }}</strong><small>{{ paragraph.field_wg_subtitle.0.value }}</small></h2>
    </div>
    <div class='widget_events_content_container is_all_event_widget' data-tab-design='{{ paragraph.field_wg_events_tab_design.0.value }}' data-show-subtags='{{ paragraph.field_wg_events_show_sub_tags.0.value }}' data-subtitle='{{ paragraph.field_wg_subtitle.0.value }}' data-title='{{ paragraph.field_wg_title.0.value }}' data-default-tag='{{ paragraph.field_wg_events_tag.0.target_id  }}' data-default-view='{{ paragraph.field_wg_events_default_view.0.value }}' >
      <div id='app'></div>
      {% if not paragraph.field_wg_events_hide_caption.0.value %}
      <div class='widget_events_content_container_legend'>
        <ul>
          <li class='blue'>Event</li>
          <li class='red'>Study trip</li>
          <li class='grey'>Cultural Excursion</li>
        </ul>
      </div>
      {% endif %}
    </div>
  </div>

  {{ content.insert_after }}
  {% endblock %}

</div>

{% endblock paragraph %}

<script
  src="https://code.jquery.com/jquery-3.1.1.min.js"
  integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
  crossorigin="anonymous"></script>