{{template "base" .}}

{{define "title"}}Home • PHC{{end}}

{{define "body"}}
<canvas id="wires-animation"></canvas>

<!-- Non avevo molta fantasia per il nome di questa classe -->
<section class="super">
    <div class="block image">
        <img src="/public/images/logo-circuit-board.svg" alt="phc-logo">
    </div>
    <div class="block text">
        <h1>
            Cos'è il PHC?
        </h1>
        <p>
            Il PHC è un progetto di sperimentazione tecnologica di alcuni studenti di Matematica di Pisa che va avanti fin dal 1994.
        </p>
        <p>
            Fisicamente, occupa la stanza 106 del Dipartimento, mentre questo sito ne è la sede virtuale. Qui si trovano vari servizi offerti agli studenti, e ne si documenta lo sviluppo nella pagina <a href="/news">Notizie</a>.
        </p>
        <p>
            Nella sezione <b>Progetti</b> si trovano alcune delle attività e dei servizi del PHC, mentre <a href="/utenti">Utenti</a> contiene l'indice delle pagine personali degli studenti, che sono storicamente uno dei progetti più importanti del PHC.
        </p>
        <p>
            Per più informazioni sul PHC, si consulti la sezione <a href="/storia">Storia</a>
        </p>
    </div>
</section>

<section>
    <h2>Notizie Importanti</h2>
    <div class="card-list">
        <div class="card">
            <div class="title">
                <a href="/news/notizia-super-wow-1">News 1</a>
            </div>
            <div class="date">yyyy-mm-dd</div>
            <div class="description">
                <p>
                    much doge, ipsum dolor sit amet consectetur adipisicing elit. Quis nemo aperiam, voluptas quam alias esse sed natus tempore suscipit fugiat sit delectus exercitationem numquam ipsum assumenda recusandae consequatur...
                </p>
            </div>
        </div>
        <div class="card">
            <div class="title">
                <a href="/news/notizia-super-wow-2">News 2</a>
            </div>
            <div class="date">yyyy-mm-dd</div>
            <div class="description">
                <p>
                    Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis nemo aperiam, voluptas quam alias esse sed natus tempore suscipit fugiat sit delectus exercitationem numquam ipsum assumenda recusandae consequatur...
                </p>
            </div>
        </div>
        <div class="card">
            <div class="title">
                <a href="/news/notizia-super-wow-3">News 3</a>
            </div>
            <div class="date">yyyy-mm-dd</div>
            <div class="description">
                <p>
                    Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis nemo aperiam, voluptas quam alias esse sed natus tempore suscipit fugiat sit delectus exercitationem numquam ipsum assumenda recusandae consequatur...
                </p>
            </div>
        </div>
    </div>
</section>

<section>
    <!-- TODO: Progetti/Servizi/Cose fornite -->
    <h2>Progetti</h2>
    <div class="card-list">
        <div class="card">
            <div class="title">Project title</div>
            <div class="description">
                <p>
                    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dolorem assumenda voluptatum harum quo nisi alias ab cupiditate corrupti est, illum culpa, excepturi, fugiat dolore doloribus minima placeat facilis enim quaerat!
                </p>
            </div>
        </div>
        <div class="card">
            <div class="title">Project title</div>
            <div class="description">
                <p>
                    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dolorem assumenda voluptatum harum quo nisi alias ab cupiditate corrupti est, illum culpa, excepturi, fugiat dolore doloribus minima placeat facilis enim quaerat!
                </p>
            </div>
        </div>
        <div class="card">
            <div class="title">Project title</div>
            <div class="description">
                <p>
                    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dolorem assumenda voluptatum harum quo nisi alias ab cupiditate corrupti est, illum culpa, excepturi, fugiat dolore doloribus minima placeat facilis enim quaerat!
                </p>
            </div>
        </div>
    </div>
</section>
<hr>
<section>
    <div class="card">
        <div class="title">
            Vuoi diventare un macchinista?
            <i class="fas fa-wrench"></i>
        </div>
        <div class="description">
            <p>
            Ti piace (o piacerebbe saper) smanettare al PC e (s)montare aggeggi tecnologici?
            Stai spesso in dipartimento? Allora fai pure un salto in PHC a parlare con noi, per diventare apprendista (e magari un giorno macchinista) o semplicemente per imparare.
            </p>
        </div>
    </div>
</section>

<script src="/public/homepage-art.min.js"></script>
{{end}}