<body class="homeBodyHtml">
  <div class="wrapper">
    <div class="container-fluid d-flex flex-column h-100">
      <div class="row row-border-red">
        <div class="col-12 col-md-4 border-right-red py-3 px-4">
          <div class="d-flex align-item-center h-100">
            <img src="<%= Routes.static_path(@conn, "/images/logo.svg") %>" width="100%" height="auto" alt="OpenPod" />
          </div>
        </div>
      </div>
      <div class="row row-border-red row-central">
        <div class="col-12 col-md-4 border-right-red d-flex align-items-center justify-content-center">
          <span class="emoji">🤓</span>
        </div>
        <div class="col-12 col-md-8 h-100 overflow-auto">
          <div id="desc" class="pt-md-3 pt-0">
            <p class="m-0 pb-3 pb-md-0" lang="it">
              <span class="text-danger">OpenPod</span> è il tentativo di
              restituire al podcasting la dimensione libera e conviviale che
              lo caratterizza sin dai suoi esordi. Siamo un gruppo di persone
              che registrano, ascoltano, producono contenuti audio. Ci
              piacerebbe condividere soluzioni per farlo con hosting gratuito,
              banda illimitata e software libero, senza far ricorso ad
              account, profilazione, abbonamenti, pubblicità e
              monetizzazione.<br />
              <span class="text-danger">Com'è possibile?</span> Combinando
              l'hosting di archive.org, alcune buone pratiche per la
              produzione dei vostri contenuti e un pizzico di codice.<br />
              <span class="text-danger">Perché?</span> Per liberarci dalla
              logica prestazione e commerciale che caratterizza il business
              model dominante, anche nelle nuove forme di fruizione sonora ma
              specialmente per generare comunità. Un progetto aperto e
              abilitante, che punta a mettere a fattor comune saperi
              comunitari.
            </p>
          </div>
        </div>
      </div>
      <div class="row row-border-red">
        <div
          class="col-12 col-md-4 border-right-red d-flex align-items-center justify-content-center"
        >
          <span class="emoji">🤔</span>
        </div>
        <div class="col-12 col-md-8 d-flex align-items-center">
          <h3 class="my-md-3 my-0 pb-3 pb-md-0 text-center">
            <%= link "Come caricare correttamente il tuo podcast su archive.org?", to: Routes.page_path(@conn, :howto) %>
          </h3>
        </div>
      </div>
      <div class="row row-border-red">
        <div
          class="col-md-4 col-12 border-right-red d-flex align-items-center justify-content-center"
        >
          <span class="emoji">🥳</span>
        </div>
        <div class="col-md-8 col-12 py-3">
          <form>
            <div class="form-group m-0">
              <label for="exampleInputEmail1">
                <span class="text-danger"
                  >Genera il feed RSS del tuo podcast</span
                >
                pronto per la distribuzione su tutti i servizi e app di
                podcasting! Incolla qui sotto il link al tuo <i>item</i> su
                <a href="https://archive.org" target="_blank">archive.org</a>
              </label>
              <input
                class="form-control mb-3"
                id="exampleInputEmail1"
                placeholder="es: https://archive.org/details/il-mio-podcast"
              />

              <div class="input-group">
                <div class="input-group-prepend">
                  <button
                    class="btn btn-danger btn-rss text-uppercase"
                    type="button"
                  >
                    copia rss
                  </button>
                </div>
                <input
                  type="text"
                  class="form-control"
                  disabled
                  value="https://openpod.abbiamoundominio.org/podcast/il-mio-podcast"
                />
              </div>
            </div>
          </form>
        </div>
      </div>
      <div class="row">
        <div class="col-12 d-flex align-items-center">
          <p class="my-2">
            Una produzione dalla galassia
            <a href="https://offtopiclab.org">Off Topica</a> / ospitati dal
            <a href="https://unit.abbiamoundominio.org/">Collettivo Unit</a> /
            codice sorgente su
            <a href="https://git.lattuga.net/offtopic/open-pod">git.lattuga.net/offtopic/open-pod</a>
          </p>
        </div>
      </div>
    </div>
  </div>
</body>
