Emmaboshi 2019 Styleguide

Contact Box: Outlined Senza Zigzag 

<section class="c-contactBox">
    <h2 class="c-contactBox__title superHeadline">Bollettino?</h2>

    <p class="c-contactBox__abstract">Direttamente dalla tastiera di Emmaboshi alla tua casella di posta il Bollettino Boshi è un comodo riepilogo di ciò che ho fatto, scritto, visto, letto, scoperto o immaginato. Niente spam, niente scocciature, ti disiscrivi in un click.<br><br>Attenzione:
        contiene tracce di ironia.</p>

    <div class="c-contactBox__cta">
        <a href="#" class="c-button o-arrowLink c-button--outlined o-arrowLink">Iscriviti</a>
    </div>
</section>
 
<section class="c-contactBox">
  <h2 class="c-contactBox__title superHeadline">{{ title }}</h2>

  {% if hasZigZag %}
    {% render '@zigzag' %}
  {% endif %}
  <p class="c-contactBox__abstract">{{ abstract|raw }}</p>

  <div class="c-contactBox__cta">
    <a href="#" class="c-button o-arrowLink {{ btn.modifier }}">{{ btn.label }}</a>
  </div>
</section>
 
{
  "items": [
    {
      "imgSrc": "http://emmaboshi.net/pics/extra/Bollettino-Boshi.png",
      "img": {
        "src": "http://emmaboshi.net/pics/extra/Bollettino-Boshi.png",
        "alt": "progetto 01"
      },
      "link": {
        "url": "http://emmaboshi.net/extra/bollettino-boshi",
        "label": "Vai al progetto"
      },
      "title": "Bollettino Boshi",
      "abstract": "Il Bollettino è la mia newsletter informale, spedita a cadenza imprevedibile. "
    },
    {
      "imgSrc": "http://emmaboshi.net/pics/extra/bottiato.jpg",
      "img": {
        "src": "http://emmaboshi.net/pics/extra/bottiato.jpg",
        "alt": "progetto 01"
      },
      "link": {
        "url": "http://emmaboshi.net/extra/bollettino-boshi",
        "label": "Vai al progetto"
      },
      "title": "Franco Bottiato",
      "abstract": "Un bot per Facebook Messenger, con la personalità di Franco Bottiato."
    },
    {
      "imgSrc": "http://emmaboshi.net/pics/extra/Radio-Boshi2.jpg",
      "img": {
        "src": "http://emmaboshi.net/pics/extra/Radio-Boshi2.jpg",
        "alt": "progetto 01"
      },
      "link": {
        "url": "http://emmaboshi.net/extra/bollettino-boshi",
        "label": "Vai al progetto"
      },
      "title": "Radio Boshi",
      "abstract": "Un canale Telegram di messaggi vocali inaspettati."
    }
  ],
  "_keys": [
    "type",
    "items"
  ],
  "type": "post-preview",
  "title": "Bollettino?",
  "abstract": "Direttamente dalla tastiera di Emmaboshi alla tua casella di posta il Bollettino Boshi è un comodo riepilogo di ciò che ho fatto, scritto, visto, letto, scoperto o immaginato. Niente spam, niente scocciature, ti disiscrivi in un click.<br><br>Attenzione: contiene tracce di ironia.",
  "btn": {
    "label": "Iscriviti",
    "modifier": "c-button--outlined o-arrowLink"
  },
  "hasZigZag": null
}

Variante senza zigzag e con button outlined