style: Fixed mobile, enhanced homepage
This commit is contained in:
+57
-30
@@ -5,6 +5,9 @@ import { Content as WhatPhcContent, frontmatter as whatsPhcFrontmatter } from '.
|
||||
|
||||
const news = await getCollection('news')
|
||||
|
||||
const galleryCollage = (await Astro.glob('@/assets/gallery/*')).map(({ default: { src } }) => src)
|
||||
|
||||
console.log(galleryCollage)
|
||||
---
|
||||
|
||||
<PageLayout pageTags="homepage">
|
||||
@@ -17,10 +20,19 @@ const news = await getCollection('news')
|
||||
<img src="/images/logo-circuit-board.svg" alt="phc logo" />
|
||||
</div>
|
||||
<div class="whats-phc card large">
|
||||
<input type="checkbox" class="hide" id="mobile-whats-phc-read-more" checked />
|
||||
<div class="title">{whatsPhcFrontmatter.title}</div>
|
||||
<div class="text">
|
||||
<WhatPhcContent />
|
||||
</div>
|
||||
<div class="mobile-only">
|
||||
<label for="mobile-whats-phc-read-more">
|
||||
<div class="button">
|
||||
<span>Mostra di più</span>
|
||||
<span>Mostra meno</span>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="news">
|
||||
@@ -100,27 +112,27 @@ const news = await getCollection('news')
|
||||
Gitea è un servizio di hosting per progetti software, come GitHub ma autogestito.
|
||||
</p>
|
||||
<p>
|
||||
Qui troverai i progetti del PHC, ma non solo: può accedervi chiunque con un
|
||||
account di Ateneo.
|
||||
Qui puoi trovare i progetti del PHC, e accedendo con un account di Ateneo potrai
|
||||
crearne di nuovi.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<!-- <a href="#" style="--masonry-height: 2;">
|
||||
<div class="project">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
<div class="title">PHC-Bot</div>
|
||||
<div class="description">
|
||||
Un bot con cui chattare per chiedere informazioni o supporto tecnico.
|
||||
</div>
|
||||
<div class="project">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
</div>
|
||||
</a> -->
|
||||
<div class="title">PHC-Bot</div>
|
||||
<div class="description">
|
||||
Un bot con cui chattare per chiedere informazioni o supporto tecnico.
|
||||
</div>
|
||||
</div>
|
||||
</a> -->
|
||||
<a target="_blank" href="https://lab.phc.dm.unipi.it/orario/" style="--masonry-height: 1;">
|
||||
<div class="project" style="--card-bg: #75ca75;">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
<div class="image auto">
|
||||
<img src="https://lab.phc.dm.unipi.it/orario/icon.png" alt="Logo Orario" />
|
||||
</div>
|
||||
<div class="title">Orario</div>
|
||||
<div class="description">
|
||||
@@ -139,16 +151,18 @@ const news = await getCollection('news')
|
||||
</div>
|
||||
<div class="title">Problemi</div>
|
||||
<div class="description">
|
||||
<p>Bacheca con problemi di Matematica da risolvere inviando soluzioni in LaTeX.</p>
|
||||
<p>
|
||||
Bacheca di problemi di Matematica da risolvere, inviandone le soluzioni in LaTeX.
|
||||
</p>
|
||||
|
||||
<p>La sera i problemi compaiono sullo schermo in atrio.</p>
|
||||
<p>La sera i problemi compaiono sullo schermo nell'atrio del Dipartimento.</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<a href="http://steffe.cs.dm.unipi.it/" style="--masonry-height: 2;">
|
||||
<div class="project">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
<div class="image cover">
|
||||
<img src="https://steffe.lb.cs.dm.unipi.it/assets/img/logo.png" alt="Logo Cluster" />
|
||||
</div>
|
||||
<div class="title">Cluster "Steffè"</div>
|
||||
<div class="description">
|
||||
@@ -160,7 +174,7 @@ const news = await getCollection('news')
|
||||
<a target="_blank" href="https://seminarietti.phc.dm.unipi.it/" style="--masonry-height: 2;">
|
||||
<div class="project" style="--card-bg: #bd9fec;">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
<img src="https://seminarietti.phc.dm.unipi.it/favicon.png" alt="Logo Seminarietti" />
|
||||
</div>
|
||||
<div class="title">Seminarietti</div>
|
||||
<div class="description">
|
||||
@@ -171,7 +185,7 @@ const news = await getCollection('news')
|
||||
<a target="_blank" href="https://tutorato.phc.dm.unipi.it/" style="--masonry-height: 2;">
|
||||
<div class="project" style="--card-bg: #c55;">
|
||||
<div class="image">
|
||||
<div class="box"></div>
|
||||
<img src="https://tutorato.phc.dm.unipi.it/favicon.svg" alt="Logo Tutorato" />
|
||||
</div>
|
||||
<div class="title">Tutorato</div>
|
||||
<div class="description">
|
||||
@@ -199,15 +213,28 @@ const news = await getCollection('news')
|
||||
<rect fill="url(#zig-zag-3)" x="0" y="0" width="1000" height="1"></rect>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div class="title">Vuoi diventare macchinista?</div>
|
||||
|
||||
<div class="content">
|
||||
<p>
|
||||
Se sei uno studente del Dipartimento di Matematica e vuoi diventare un macchinista del PHC,
|
||||
vieni a trovarci in Dipartimento o scrivici a <a href="mailto:macchinisti@lists.dm.unipi.it">
|
||||
</a>
|
||||
</p>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<div class="card large" style="--card-base: #ddd;">
|
||||
<div class="title">Vuoi diventare macchinista?</div>
|
||||
<div class="text">
|
||||
<p>
|
||||
Se sei uno studente del Dipartimento di Matematica e vuoi diventare un macchinista del
|
||||
PHC, vieni a trovarci in Dipartimento o scrivici a <a
|
||||
href="mailto:macchinisti@lists.dm.unipi.it"
|
||||
>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section></PageLayout
|
||||
>
|
||||
<div class="gallery-collage">
|
||||
{
|
||||
galleryCollage.map((src, i) => (
|
||||
<div class="card">
|
||||
<img src={src} alt={`gallery image ${i}`} />
|
||||
</div>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
</PageLayout>
|
||||
|
||||
Reference in New Issue
Block a user