epfl-elements 4.3.0 → 4.4.1

package/dist/components/molecules/list-group/list-group-event.twig

@@ -1,74 +0,0 @@
-<div class="list-group-item list-group-teaser" itemscope itemtype="http://schema.org/Event">
-  <div class="list-group-teaser-container">
-    <div class="list-group-teaser-thumbnail">
-      {% include '@atoms/picture/picture.twig' with {'variant':'news-thumb'} %}
-    </div>
-    <div class="list-group-teaser-content">
-      <p class="h5 card-title" itemprop="name">
-        <a href="#">Startup Acceleration Workshops</a>
-      </p>
-      <div class="card-info mt-0">
-        {% block date %}
-        <p class="event-info-date">
-          {% include '@atoms/icon/icon.twig' with { icon:  'calendar', icon_classes:'feather' } %}
-          <span class="sr-only">Dates: du</span>
-          <span class="card-info-date event-date" itemprop="startDate" content="2018-01-10T12:00">10.01.2018</span>
-          <span class="sep" aria-hidden="true">›</span>
-          <span class="sr-only">au</span>
-          <span class="card-info-date event-date" itemprop="endDate" content="2018-01-12T12:00">12.01.2018</span>
-          {% include '@atoms/icon/icon.twig' with { icon:  'clock', icon_classes:'feather' } %}
-          <span class="sr-only">Heures: de</span>
-          <span class="event-time">13:00</span>
-          <span class="sep" aria-hidden="true">›</span>
-          <span class="sr-only">à</span>
-          <span class="event-time">17:30</span>
-        </p>
-        {% endblock %}
-        <div class="event-info mt-1">
-          {% block speaker %}
-          <p class="event-speaker" itemprop="performer" itemscope itemtype="http://schema.org/performer">
-            <b>Intervenant·e:</b> Prof. Dr. Aditya Mueller
-          </p>  
-          {% endblock %}
-          {% block location %}
-          <p class="event-location" itemprop="location" itemscope itemtype="http://schema.org/Place">
-            {% if eventLocation == 'online' %}
-            <b>Lieu:</b> {% include '@atoms/icon/icon.twig' with { icon: 'monitor', icon_classes:'feather' } %}
-            <span itemprop="name"><a href="#">En ligne</a></span>
-            {% elseif eventLocation == 'online_room' %}
-            <b>Lieu:</b> {% include '@atoms/icon/icon.twig' with { icon: 'map-pin', icon_classes:'feather' } %}
-            <span itemprop="name"><a href="#">ArtLab EPFL</a></span> &amp;
-            {% include '@atoms/icon/icon.twig' with { icon: 'monitor', icon_classes:'feather' } %}
-            <span itemprop="name"><a href="#">En ligne</a></span>
-            {% else %}
-            <b>Lieu:</b> {% include '@atoms/icon/icon.twig' with { icon: 'map-pin', icon_classes:'feather' } %}
-            <span itemprop="name"><a href="#">ArtLab EPFL</a></span>
-            {% endif %}
-          </p>
-          {% endblock %}
-          {% block category %}
-          <p class="event-category">
-            <b>Catégorie:</b> Événements culturel
-          </p>
-          {% endblock %}
-          {% block audience %}
-          <p class="event-audience" itemprop="audience" itemscope itemtype="https://schema.org/audience">
-            <b>Public cible:</b> Tout public
-          </p>
-          {% endblock %}
-        </div>
-        
-        <p class="pt-3 event-actions">
-          {% if live_now|default(false) %}
-            <a href="#" class="btn btn-primary btn-sm">{% include '@atoms/icon/icon.twig' with { icon: 'monitor', icon_classes:'feather' } %} Voir en direct</a>
-          {% endif %}
-          {% if live_future|default(false) %}
-            <a href="#" class="btn btn-secondary btn-sm">{% include '@atoms/icon/icon.twig' with { icon: 'monitor', icon_classes:'feather' } %} Diffusé en direct</a>
-        {% endif %}
-          <a href="#" class="btn btn-secondary btn-sm">{% include '@atoms/icon/icon.twig' with { icon: 'download', icon_classes:'feather' } %} Importer</a>
-        </p>
-        
-      </div>
-    </div>
-  </div>
-</div>

package/dist/components/molecules/list-group/list-group-infoscience.twig

@@ -1,32 +0,0 @@
-<div class="list-group">
-  {% for i in 1..3 %}
-  <div class="list-group-item list-group-item-borderless list-group-item-infoscience">
-    <div class="record-content">
-      <p>Noms des auteurs: <strong>Titre de la publication lorem ipsum dolor sit amet consectetur adipscing elit</strong>; <i>Sous-titre lorem ipsum dolor sit amet consectetur adipscing elit</i>; Références, lieu de publication, etc.</p>
-    </div>
-    <div class="item-metadata">
-      <p class="item-date">18.11.2019</p>
-      <p class="item-links small">
-        <a href="#" target="_blank">Notice détaillée</a> – <a href="#" target="_blank">Texte intégral</a>
-      </p>
-    </div>
-  </div>
-  {% endfor %}
-  <!-- Publication with thumbnail image -->
-  <div class="list-group-item list-group-item-borderless list-group-item-infoscience has-thumbnail">
-    <div class="list-group-thumbnail">
-      {% include '@atoms/picture/picture-thumb-square.twig' %}
-    </div>
-    <div class="list-group-content">
-      <div class="record-content">
-        <p>Noms des auteurs: <strong>Titre de la publication lorem ipsum dolor sit amet consectetur adipscing elit</strong>; <i>Sous-titre lorem ipsum dolor sit amet consectetur adipscing elit</i>; Références, lieu de publication, etc.</p>
-      </div>
-      <div class="item-metadata">
-        <p class="item-date">18.11.2019</p>
-        <p class="item-links small">
-          <a href="#" target="_blank">Notice détaillée</a> – <a href="#" target="_blank">Texte intégral</a>
-        </p>
-      </div>
-    </div>
-  </div>
-</div>

package/dist/components/molecules/list-group/list-group-teasers.twig

@@ -1,55 +0,0 @@
-<div class="list-group">
-  {% for i in 1..4 %}
-
-      <div class="list-group-teaser list-group-item list-group-teaser-container">
-        <div class="list-group-teaser-thumbnail">
-          <a href="#" class="link-trapeze-horizontal">
-            {% include '@atoms/picture/picture-news-thumb.twig' %}
-          </a>
-        </div>
-        <div class="list-group-teaser-content">
-          <h3 class="h5"><a href="#">Physics: new e-books for the AIAA Education Series</a></h3>
-          <p>
-            <time datetime="2018-03-26"><span class="sr-only">Published:</span>26.03.2018</time>
-            <span class="text-muted">— Lorem ipsum dolor sit amet, consectetur adipiscing elit. Si enim ad populum me vocas, eum. Quid enim me prohiberet
-              Epicureum esse, si probarem, quae ille diceret?</span>
-          </p>
-        </div>
-      </div>
-  {% endfor %}
-
-  <div class="list-group-teaser list-group-item list-group-teaser-container teaser-img-right">
-    <div class="list-group-teaser-thumbnail">
-      <a href="#" class="link-trapeze-horizontal">
-        {% include '@atoms/picture/picture-news-thumb.twig' %}
-      </a>
-    </div>
-    <div class="list-group-teaser-content">
-      <h3 class="h5"><a href="#">Physics: new e-books for the AIAA Education Series</a></h3>
-      <p class="teaser-url text-small text-muted mb-2">https://www.epfl.ch/research/facilities/biological-electron-microscopy/</p>
-      <p>
-        <time datetime="2018-03-26"><span class="sr-only">Published:</span>26.03.2018</time>
-        <span class="text-muted">— Lorem ipsum dolor sit amet, consectetur adipiscing elit. Si enim ad populum me vocas, eum. Quid enim me prohiberet
-          Epicureum esse, si probarem, quae ille diceret?</span>
-      </p>
-    </div>
-  </div>
-
-  <div class="list-group-teaser list-group-item list-group-teaser-container">
-    <div class="list-group-teaser-content">
-      <h3 class="h5"><a href="#">Physics: new e-books for the AIAA Education Series</a></h3>
-      <p class="teaser-url text-small text-muted mb-2">https://www.epfl.ch/research/facilities/biological-electron-microscopy/</p>
-      <p>
-        <time datetime="2018-03-26"><span class="sr-only">Published:</span>26.03.2018</time>
-        <span class="text-muted">— Lorem ipsum dolor sit amet, consectetur adipiscing elit. Si enim ad populum me vocas, eum. Quid enim me prohiberet
-          Epicureum esse, si probarem, quae ille diceret?</span>
-      </p>
-    </div>
-  </div>
-
-  {# {% if bottomlink %} #}
-    <a href="#" class="list-group-teaser-more">
-      Afficher plus d'actualités
-    </a>
-  {# {% endif %} #}
-</div>

package/dist/components/molecules/list-group/list-group.twig

@@ -1,4 +0,0 @@
-<ul class="list-group list-group-flush">
-  <li class="list-group-item">Computer science</li>
-  <li class="list-group-item">Communication systems</li>
-</ul>

package/dist/components/molecules/list-group/list-group.yml

@@ -1,21 +0,0 @@
-name: list-group
-title: List group
-notes: |
-  Describe the list-group component here.
-wrapper: ''
-background: ''
-variants:
-  - name: borderless
-    title: Borderless
-    notes: |
-      The Borderless variant.
-    background: ''
-    wrapper: ''
-  - name: infoscience
-    title: Infoscience
-    notes: |
-      List of Infoscience publications.
-  - name: teasers
-    title: Teasers
-    notes: |
-      List group variant that can be used to display a teasers listing

package/dist/components/molecules/map/map.twig

@@ -1,7 +0,0 @@
-<h4 class="sr-only">Access map</h4>
-<figure class="media-map">
-  {% include '@atoms/picture/picture.twig' %}
-  <figcaption class="media-map-over">
-    <a href="#" class="btn btn-primary btn-block">Itinéraire vers le bureau BP (1er étage)</a>
-  </figcaption>
-</figure>

package/dist/components/molecules/map/map.yml

@@ -1,2 +0,0 @@
-title: Map
-name: map

package/dist/components/molecules/metabox/metabox.twig

@@ -1,56 +0,0 @@
-<div class="d-flex flex-column h-100 py-3">
-  <h4>Détails de l'événement</h4>
-  <table class="table">
-    <tbody>
-      <tr>
-        <td>Date</td>
-        <td>
-          <span itemprop="startDate" content="2018-01-13T12:00">
-            13.01.2018 - 12:00 → 13:30
-          </span>
-        </td>
-      </tr>
-      <tr>
-        <td>Catégorie</td>
-        <td>Technologie</td>
-      </tr>
-      <tr>
-        <td>Avec</td>
-        <td>Prof Mohamed Bentires-Alj</td>
-      </tr>
-      <tr>
-        <td>Lieu</td>
-        <td>
-          <div itemprop="location" itemscope itemtype="http://schema.org/Place">
-            <span itemprop="name"><a href="http://plan.epfl.ch/?room=SV2811">SV 2811</a></span>
-            <div class="d-none" itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
-              <span itemprop="streetAddress">EPFL</span><br>
-              <span itemprop="addressLocality">Lausanne</span>,
-              <span itemprop="postalCode">1015</span>
-            </div>
-          </div>
-        </td>
-      </tr>
-      <tr>
-        <td>Prix</td>
-        <td>
-          <span itemprop="offers" itemscope itemtype="http://schema.org/Offer">
-            <div itemprop="price" content="0">Accès libre</div>
-            <span itemprop="priceCurrency" content="CHF" />
-          </span>
-        </td>
-      </tr>
-      <tr>
-        <td>Contact</td>
-        <td><a href="#">John Doe</a></td>
-      </tr>
-    </tbody>
-  </table>
-  <div class="mt-3">
-    <p class="mb-2">Organisé par</p>
-    {% include '@molecules/avatar-teaser/avatar-teaser.twig' %}
-  </div>
-  <div class="mt-auto align-self-end">
-    {% include '@atoms/button/button.twig' %}
-  </div>
-</div>

package/dist/components/molecules/metabox/metabox.yml

@@ -1,6 +0,0 @@
-title: Metabox
-name: metabox
-wrapper: col-md-5 bg-gray-100
-notes: |
-  A box allowing the display of meta-information concerning the content of the page, whether it is an event, a laboratory, etc.
-  You can also add a call to action at the bottom if an action is available for the users

package/dist/components/molecules/pagination/pagination-center.twig

@@ -1,39 +0,0 @@
-<nav aria-label="Page navigation">
-  <ul class="pagination justify-content-center">
-    <li class="page-item">
-      <a class="page-link" href="#" aria-label="Go to first page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-last-left' } %}
-      </a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#" aria-label="Go to previous page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-left' } %}
-        <span class="sr-only">Previous</span>
-      </a>
-    </li>
-    <li class="page-item active">
-      <a class="page-link" href="#" aria-current="page">
-        1
-        <span class="sr-only">(Current page)</span>
-      </a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#">2</a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#">3</a>
-    </li>
-    <li class="page-item disabled">
-      <a class="page-link" href="#" aria-label="Next">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-right' } %}
-        <span class="sr-only">Next</span>
-      </a>
-    </li>
-    <li class="page-item disabled">
-      <a class="page-link" href="#" aria-label="Last page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-last-right' } %}
-        <span class="sr-only">Last page</span>
-      </a>
-    </li>
-  </ul>
-</nav>

package/dist/components/molecules/pagination/pagination-load-more.twig

@@ -1 +0,0 @@
-<a href="#" class="btn btn-light btn-block">Load more content...</a>

package/dist/components/molecules/pagination/pagination.twig

@@ -1,39 +0,0 @@
-<nav aria-label="Page navigation">
-  <ul class="pagination">
-    <li class="page-item">
-      <a class="page-link" href="#" aria-label="Go to first page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-last-left' } %}
-      </a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#" aria-label="Go to previous page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-left' } %}
-        <span class="sr-only">Previous</span>
-      </a>
-    </li>
-    <li class="page-item active">
-      <a class="page-link" href="#" aria-current="page">
-        1
-        <span class="sr-only">(Current page)</span>
-      </a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#">2</a>
-    </li>
-    <li class="page-item">
-      <a class="page-link" href="#">3</a>
-    </li>
-    <li class="page-item disabled">
-      <a class="page-link" href="#" aria-label="Next">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-right' } %}
-        <span class="sr-only">Next</span>
-      </a>
-    </li>
-    <li class="page-item disabled">
-      <a class="page-link" href="#" aria-label="Last page">
-        {% include "@atoms/icon/icon.twig" with { icon: 'icon-chevron-last-right' } %}
-        <span class="sr-only">Last page</span>
-      </a>
-    </li>
-  </ul>
-</nav>

package/dist/components/molecules/pagination/pagination.yml

@@ -1,13 +0,0 @@
-title: Pagination
-name: pagination
-variants:
-  - name: center
-    title: Centered pagination
-    notes: |
-      Same as the default pagination, but with a `justify-content-center` class to center it.
-  - name: load-more
-    title: Load more
-    notes: |
-      The Load more variant.
-    background: ''
-    wrapper: ''

package/dist/components/molecules/question/question.twig

@@ -1,26 +0,0 @@
-<form class="question" action="">
-
-  <div class="question-img">
-    {% include '@atoms/picture/picture-question.twig' %}
-  </div>
-
-  <div class="question-content">
-    <h2 class="question-title">{{ type ?: 'Type de question' }}</h2>
-    <h3 class="question-subtitle mt-3">{{ title ?: 'Titre de la question' }}</h3>
-
-    <div class="question-answers mt-4">
-      {% set options = options|default(['Option 1', 'Option 2', 'Option 3']) %}
-      {% for option in options %}
-        <input type="radio" id="custom-radio{{loop.index}}" name="customRadio" class="custom-control-input">
-        <label class="custom-control-label" for="custom-radio{{loop.index}}">
-          <span class="custom-control-label-content">
-          {{ option }}</span>
-          <span class="trapeze-horizontal d-none d-lg-block"></span>
-          <span class="trapeze-vertical d-lg-none"></span>
-        </label>
-      {% endfor %}
-    </div>
-
-    <input type="submit" class="btn btn-primary mt-4" value="Voter">
-  </div>
-</form>

package/dist/components/molecules/question/question.yml

@@ -1,2 +0,0 @@
-title: Question
-name: question

package/dist/components/molecules/quote/quote.twig

@@ -1,10 +0,0 @@
-<div class="row">
-  <div class="col-6 offset-3 col-sm-4 offset-sm-4 col-md-2 offset-md-0 text-center text-md-right">
-    {% include "@atoms/picture/picture-avatar.twig" %}
-  </div>
-
-  <blockquote class="blockquote mt-3 col-md-10 border-0">
-    <p class="mb-0">EPFL greatly helps alumni remembering their high value on the job market. Boosting self confidence helps to find and successfully apply for interesting positions. Very systematic, good psychology.</p>
-    <footer class="blockquote-footer"><cite title="Fabien">Fabien</cite>, Diploma in Electrical and Electronic Engineering, 2002 <br> Engineering STI</footer>
-  </blockquote>
-</div>

package/dist/components/molecules/quote/quote.yml

@@ -1,6 +0,0 @@
-title: Quote
-name: quote
-wrapper: container
-notes: |
-  The goal of that component is to display a blockquote with its author avatar next to it.
-  For information, `.blockquote` elements are already styled ([See typography documentation](/#/doc/design--typography.html))

package/dist/components/molecules/search/search-mobile.twig

@@ -1,39 +0,0 @@
-{% if language is not defined %}{% set language = 'fr' %}{% endif %}
-
-<form action="#" class="d-xl-none">
-  <a id="search-mobile-toggle" class="search-mobile-toggle searchform-controller" href="#">
-    {% include '@atoms/icon/icon.twig' with { icon: 'icon-search' } %}
-    {% if language == 'fr' %}
-    <span class="toggle-label sr-only">Afficher / masquer le formulaire de recherche</span>
-    {% endif %}
-    {% if language == 'en' %}
-    <span class="toggle-label sr-only">Show / hide the search form</span>
-    {% endif %}
-  </a>
-  <div class="input-group search-mobile" role="search">
-    <div class="input-group-prepend">
-      <span class="input-group-text">
-        {% include '@atoms/icon/icon.twig' with { icon: 'icon-search' } %}
-      </span>
-    </div>
-    {% if language == 'fr' %}
-    <label for="search" class="sr-only">Rechercher sur le site</label>
-    <input type="text" class="form-control" name="search" placeholder="Rechercher">
-    {% endif %}
-    {% if language == 'en' %}
-    <label for="search" class="sr-only">Search on the site</label>
-    <input type="text" class="form-control" name="search" placeholder="Search">
-    {% endif %}
-    <div class="input-group-append">
-      <a id="search-mobile-close" class="search-mobile-close searchform-controller" href="#">
-        {% include '@atoms/icon/icon.twig' with { icon: 'icon-close' } %}
-        {% if language == 'fr' %}
-        <span class="toggle-label sr-only">Masquer le formulaire de recherche</span>
-        {% endif %}
-        {% if language == 'en' %}
-        <span class="toggle-label sr-only">Hide the search form</span>
-        {% endif %}
-      </a>
-    </div>
-  </div>
-</form>

package/dist/components/molecules/search/search.twig

@@ -1,25 +0,0 @@
-{% if language is not defined %}{% set language = 'fr' %}{% endif %}
-
-<div class="dropdown dropright search d-none d-xl-block">
-  <a class="dropdown-toggle" href="#" data-toggle="dropdown">
-    {% include "@atoms/icon/icon.twig" with { icon: 'icon-search' } %}
-  </a>
-  <form action="#" class="dropdown-menu border-0 p-0">
-    <div class="search-form mt-1 input-group">
-      {% if language == 'fr' %}
-      <label for="search" class="sr-only">Rechercher sur le site</label>
-      <input type="text" class="form-control" name="search" placeholder="Rechercher" >
-      <button type="submit" class="d-none d-xl-block btn btn-primary input-group-append">Valider</button></div>
-      {% endif %}
-      {% if language == 'en' %}
-      <label for="search" class="sr-only">Search on the site</label>
-      <input type="text" class="form-control" name="search" placeholder="Search" >
-      <button type="submit" class="d-none d-xl-block btn btn-primary input-group-append">Validate</button></div>
-      {% endif %}
-      {% if language == 'de' %}
-      <label for="search" class="sr-only">Forschen</label>
-      <input type="text" class="form-control" name="search" placeholder="Suchen" >
-      <button type="submit" class="d-none d-xl-block btn btn-primary input-group-append">Bestätigen</button></div>
-      {% endif %}
-  </form>
-</div>

package/dist/components/molecules/search/search.yml

@@ -1,9 +0,0 @@
-title: Search
-name: search
-variants:
-  - name: mobile
-    title: Search Mobile
-    notes: |
-      Used on mobile breakpoints only, inside of the [header](#/organisms/header) component, displayed when the menu is opened.
-notes: |
-  Used on desktop only. When the icon is clicked, a search form is displayed in a dropdown

package/dist/components/molecules/sidenotes/sidenotes.twig

@@ -1,20 +0,0 @@
-<article>
-  <div class="row">
-    <div class="col-sm-6">
-      <p>Maintaining <a href="#sidenotes" aria-describedby="sidenote-label" id="sidenotes-ref">sidenotes</a> manually can be a pain. By using <a href="#css" aria-describedby="sidenote-label" id="css-ref">CSS</a> <a href="#css-counters" aria-describedby="sidenote-label" id="css-counters-ref">counters</a> to add the numbered references in the text and an ordered list to display the actual sidenotes in the aside, it becomes extremely easy.</p>
-    </div>
-
-    <div class="col-sm-5 ml-auto">
-      <aside>
-        <h2 class="sr-only" id="sidenote-label">Sidenotes</h2>
-        <ol>
-          <li id="sidenotes">Sidenotes are notes placed at the right of a page. They cite references or comment on a designated part of the text above it.</li>
-
-          <li id="css">Cascading Style Sheets</li>
-
-          <li id="css-counters">CSS counters are, in essence, variables maintained by CSS whose values may be incremented by CSS rules to track how many times they're used.</li>
-        </ol>
-      </aside>
-    </div>
-  </div>
-</article>

package/dist/components/molecules/sidenotes/sidenotes.yml

@@ -1,6 +0,0 @@
-title: Sidenotes
-name: sidenotes
-notes: |
-  Inherits directly of [Footnotes](/#/molecules/footnotes) styles and main concepts.
-
-  ⚠️ *The aside layout approach may change*

package/dist/components/molecules/social/social-follow.twig

@@ -1,14 +0,0 @@
-<div class="bg-gray-100 py-5">
-  <div class="container">
-    <div class="social-share-container social-share-light">
-
-      <div class="social-share ">
-        <p class="social-share-text">
-          Suivez nous sur <span class="sr-only">les réseaux sociaux</span>
-        </p>
-        {% include '@atoms/social-icon/social-icon-link-group.twig' with { discrete: true } %}
-      </div>
-
-    </div>
-  </div>
-</div>

package/dist/components/molecules/social/social.twig

@@ -1,58 +0,0 @@
-<div class="bg-gray-100 py-5">
-  <div class="container">
-    <div class="social-share-container">
-
-      <div class="social-share ">
-        <p class="social-share-text">
-          Partager cette page
-        </p>
-        <ul class="social-icon-list list-inline">
-          <li>
-            {% include '@atoms/social-icon/social-icon-single-link.twig' with {
-              pretty_name: 'Share on Facebook',
-              icon: 'icon-facebook',
-              round: round,
-              discrete: true,
-              url: '#'
-            } %}
-          </li>
-          <li>
-            {% include '@atoms/social-icon/social-icon-single-link.twig' with {
-              pretty_name: 'Share on Twitter',
-              icon: 'icon-twitter',
-              round: round,
-              discrete: true,
-              url: '#'
-            } %}
-          </li>
-          <li>
-            {% include '@atoms/social-icon/social-icon-single-link.twig' with {
-              pretty_name: 'Share on LinkedIn',
-              icon: 'icon-linkedin',
-              round: round,
-              discrete: true,
-              url: '#'
-            } %}
-          </li>
-          <li>
-            {% include '@atoms/social-icon/social-icon-single-link.twig' with {
-              pretty_name: 'Share by e-mail',
-              icon: 'icon-mail-plane',
-              round: round,
-              discrete: true,
-              url: '#'
-            } %}
-          </li>
-        </ul>
-      </div>
-
-      <div class="social-share-copylink">
-        <div class="input-group">
-          <input type="text" class="form-control sr-only" value="www.epfl.ch/xyz" aria-label="Lien de partage">
-          <button class="btn btn-primary btn-sm social-share-copy" title="Copier l'URL de la page" type="button" data-success="URL copiée !">Copier l'URL</button>
-        </div>
-      </div>
-
-    </div>
-  </div>
-</div>

package/dist/components/molecules/social/social.yml

@@ -1,7 +0,0 @@
-title: Social
-name: social
-wrapper: bg-gray-100
-variants:
-  - name: follow
-    title: Follow
-    wrapper: col-12

package/dist/components/molecules/social-feed/social-feed-facebook.twig

@@ -1,17 +0,0 @@
-<div class="social-feed">
-  {% include '@atoms/social-icon/social-icon.twig' with { icon: 'icon-facebook', round: true } %}
-
-  <div class="social-feed-content">
-    <div>
-      <p class="social-feed-header"><strong>@epflENAC</strong> <span class="text-small">il y a 8 heures</span></p>
-      <p>A Berlin, les étudiantes et étudiants de Dominique Perrault exposent leurs travaux à la galerie Aedes Architecture Forum du 27 janvier au 8 mars. @dpa_official http://www.aedes..</p>
-
-      {% include '@atoms/picture/picture-one-third.twig' %}
-
-      <p>What's your fave spot for sunset on campus? 😎</p>
-    </div>
-    <div>
-      <a class="btn btn-secondary mt-4">Likez notre page Facebook</a>
-    </div>
-  </div>
-</div>