chore: minor refactor into some components and updated favicon
continuous-integration/drone/push Build is passing
continuous-integration/drone/push Build is passing
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,15 @@
|
|||||||
|
---
|
||||||
|
import type { AstroBuiltinProps } from 'astro'
|
||||||
|
import type { AstroComponentFactory } from 'astro/runtime/server/index.js'
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
large?: boolean
|
||||||
|
style?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const { large, ...props } = Astro.props
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class:list={['card', large && 'large']} {...props}>
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,26 @@
|
|||||||
|
---
|
||||||
|
type Props = {
|
||||||
|
color: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const { color } = Astro.props
|
||||||
|
|
||||||
|
const patternId = 'zig-zag-' + color.slice(1)
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="zig-zag">
|
||||||
|
<svg
|
||||||
|
width="100%"
|
||||||
|
height="2rem"
|
||||||
|
viewBox="0 0 1 1"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
preserveAspectRatio="xMinYMid meet"
|
||||||
|
>
|
||||||
|
<defs>
|
||||||
|
<pattern id={patternId} x="0" y="0" width="2" height="1" patternUnits="userSpaceOnUse">
|
||||||
|
<path fill={color} d="M 0,1 L 1,0 L 2,1 L 0,1"></path>
|
||||||
|
</pattern>
|
||||||
|
</defs>
|
||||||
|
<rect fill={`url(#${patternId})`} x="0" y="0" width="1000" height="1"></rect>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
---
|
||||||
|
// Card.astro
|
||||||
|
export interface Props {
|
||||||
|
title: string
|
||||||
|
href: string
|
||||||
|
|
||||||
|
imgSrc?: string
|
||||||
|
style?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const { href, imgSrc, style, title } = Astro.props
|
||||||
|
---
|
||||||
|
|
||||||
|
<a target="_blank" href={href} style={style}>
|
||||||
|
<div class="project">
|
||||||
|
<div class="image">
|
||||||
|
{imgSrc ? <img src={imgSrc} alt={'logo for ' + title.toLowerCase()} /> : <div class="box" />}
|
||||||
|
</div>
|
||||||
|
<div class="title">{title}</div>
|
||||||
|
<div class="description">
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
@@ -20,6 +20,8 @@ type Props = {
|
|||||||
pageTags?: string | string[]
|
pageTags?: string | string[]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
import phcIcon from '../assets/icon.png'
|
||||||
|
|
||||||
const { title, description, thumbnail, pageTags } = Astro.props
|
const { title, description, thumbnail, pageTags } = Astro.props
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -36,7 +38,7 @@ const { title, description, thumbnail, pageTags } = Astro.props
|
|||||||
<meta property="og:url" content="https://phc.dm.unipi.it/" />
|
<meta property="og:url" content="https://phc.dm.unipi.it/" />
|
||||||
{thumbnail && <meta property="og:image" content={thumbnail} />}
|
{thumbnail && <meta property="og:image" content={thumbnail} />}
|
||||||
|
|
||||||
<link rel="icon" type="image/png" sizes="512x512" href="/favicon.svg" />
|
<link rel="icon" type="image/png" sizes="512x512" href={phcIcon.src} />
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import renderMathInElement from 'katex/contrib/auto-render'
|
import renderMathInElement from 'katex/contrib/auto-render'
|
||||||
|
|||||||
+92
-157
@@ -1,8 +1,11 @@
|
|||||||
---
|
---
|
||||||
import { getCollection } from 'astro:content'
|
import { getCollection } from 'astro:content'
|
||||||
import PageLayout from '../layouts/PageLayout.astro'
|
import PageLayout from '@/layouts/PageLayout.astro'
|
||||||
import { Content as WhatPhcContent, frontmatter as whatsPhcFrontmatter } from '../content/meta/whats-phc.md'
|
import { Content as WhatPhcContent, frontmatter as whatsPhcFrontmatter } from '@/content/meta/whats-phc.md'
|
||||||
import { Image } from 'astro:assets'
|
import { Image } from 'astro:assets'
|
||||||
|
import ProjectCard from '@/components/ProjectCard.astro'
|
||||||
|
import HomepageZigZag from '@/components/HomepageZigZag.astro'
|
||||||
|
import Card from '@/components/Card.astro'
|
||||||
|
|
||||||
const news = await getCollection('news')
|
const news = await getCollection('news')
|
||||||
|
|
||||||
@@ -34,30 +37,16 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="news">
|
<section class="news">
|
||||||
<div class="zig-zag">
|
<HomepageZigZag color="#C2A8EB" />
|
||||||
<svg
|
|
||||||
width="100%"
|
|
||||||
height="2rem"
|
|
||||||
viewBox="0 0 1 1"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
preserveAspectRatio="xMinYMid meet"
|
|
||||||
>
|
|
||||||
<defs>
|
|
||||||
<pattern id="zig-zag-1" x="0" y="0" width="2" height="1" patternUnits="userSpaceOnUse">
|
|
||||||
<path fill="#C2A8EB" d="M 0,1 L 1,0 L 2,1 L 0,1"></path>
|
|
||||||
</pattern>
|
|
||||||
</defs>
|
|
||||||
<rect fill="url(#zig-zag-1)" x="0" y="0" width="1000" height="1"></rect>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">Ultime Notizie</div>
|
<div class="title">Ultime Notizie</div>
|
||||||
|
|
||||||
<div class="card-list">
|
<div class="card-list">
|
||||||
{
|
{
|
||||||
news.map(newsItem => (
|
news.map(newsItem => (
|
||||||
<div class="card">
|
<Card>
|
||||||
<a href={`/notizie/${newsItem.slug}`} class="title">
|
<a href={`/notizie/${newsItem.slug}`} class="title">
|
||||||
{newsItem.data.title}
|
{newsItem.data.title}
|
||||||
</a>
|
</a>
|
||||||
@@ -69,153 +58,98 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
|
|||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
<div class="text">{newsItem.data.description}</div>
|
<div class="text">{newsItem.data.description}</div>
|
||||||
</div>
|
</Card>
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a class="primary" href="/notizie" role="button">Vai all'Archivio</a>
|
<a class="primary" href="/notizie" role="button">Vai all'Archivio</a>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="projects" id="projects">
|
<section class="projects" id="projects">
|
||||||
<div class="zig-zag">
|
<HomepageZigZag color="#f5f2cc" />
|
||||||
<svg
|
|
||||||
width="100%"
|
|
||||||
height="2rem"
|
|
||||||
viewBox="0 0 1 1"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
preserveAspectRatio="xMinYMid meet"
|
|
||||||
>
|
|
||||||
<defs>
|
|
||||||
<pattern id="zig-zag-2" x="0" y="0" width="2" height="1" patternUnits="userSpaceOnUse">
|
|
||||||
<path fill="#f5f2cc" d="M 0,1 L 1,0 L 2,1 L 0,1"></path>
|
|
||||||
</pattern>
|
|
||||||
</defs>
|
|
||||||
<rect fill="url(#zig-zag-2)" x="0" y="0" width="1000" height="1"></rect>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">Progetti</div>
|
<div class="title">Progetti</div>
|
||||||
|
|
||||||
<div class="project-list">
|
<div class="project-list">
|
||||||
<a target="_blank" href="https://git.phc.dm.unipi.it/" style="--masonry-height: 2;">
|
<ProjectCard
|
||||||
<div class="project" style="--card-bg: rgb(150, 197, 150);">
|
title="Gitea"
|
||||||
<div class="image">
|
href="https://git.phc.dm.unipi.it/"
|
||||||
<img
|
imgSrc="https://upload.wikimedia.org/wikipedia/commons/b/bb/Gitea_Logo.svg"
|
||||||
src="https://upload.wikimedia.org/wikipedia/commons/b/bb/Gitea_Logo.svg"
|
style="--card-bg: rgb(150, 197, 150); --masonry-height: 2;"
|
||||||
alt="logo Gitea"
|
>
|
||||||
/>
|
<p>Gitea è un servizio di hosting per progetti software, come GitHub ma autogestito.</p>
|
||||||
</div>
|
<p>
|
||||||
<div class="title">Gitea</div>
|
Qui puoi trovare i progetti del PHC, e accedendo con un account di Ateneo potrai crearne
|
||||||
<div class="description">
|
di nuovi.
|
||||||
<p>
|
</p>
|
||||||
Gitea è un servizio di hosting per progetti software, come GitHub ma autogestito.
|
</ProjectCard>
|
||||||
</p>
|
<!-- <ProjectCard
|
||||||
<p>
|
title="PHC-Bot"
|
||||||
Qui puoi trovare i progetti del PHC, e accedendo con un account di Ateneo potrai
|
href="#"
|
||||||
crearne di nuovi.
|
style="--card-bg: #c55; --masonry-height: 1;"
|
||||||
</p>
|
>
|
||||||
</div>
|
<p>Un bot con cui chattare per chiedere informazioni o supporto tecnico.</p>
|
||||||
</div>
|
</ProjectCard> -->
|
||||||
</a>
|
<ProjectCard
|
||||||
<!-- <a href="#" style="--masonry-height: 2;">
|
title="Orario"
|
||||||
<div class="project">
|
href="https://lab.phc.dm.unipi.it/orario/"
|
||||||
<div class="image">
|
style="--card-bg: #75ca75; --masonry-height: 1;"
|
||||||
<div class="box"></div>
|
imgSrc="https://lab.phc.dm.unipi.it/orario/icon.png"
|
||||||
</div>
|
>
|
||||||
<div class="title">PHC-Bot</div>
|
<p>
|
||||||
<div class="description">
|
Questo sito permette di visualizzare il proprio orario delle lezioni, con informazioni sui
|
||||||
Un bot con cui chattare per chiedere informazioni o supporto tecnico.
|
docenti e le aule.
|
||||||
</div>
|
</p>
|
||||||
</div>
|
</ProjectCard>
|
||||||
</a> -->
|
<ProjectCard
|
||||||
<a target="_blank" href="https://lab.phc.dm.unipi.it/orario/" style="--masonry-height: 1;">
|
title="Problemi"
|
||||||
<div class="project" style="--card-bg: #75ca75;">
|
href="https://lab.phc.dm.unipi.it/problemi/"
|
||||||
<div class="image">
|
style="--card-bg: #aa88c0; --masonry-height: 2;"
|
||||||
<img src="https://lab.phc.dm.unipi.it/orario/icon.png" alt="Logo Orario" />
|
imgSrc="https://lab.phc.dm.unipi.it/problemi/favicon/android-chrome-512x512.png"
|
||||||
</div>
|
>
|
||||||
<div class="title">Orario</div>
|
<p>Bacheca di problemi di Matematica da risolvere, inviandone le soluzioni in LaTeX.</p>
|
||||||
<div class="description">
|
<p>Di sera, puoi leggere i problemi sullo schermo del Dipartimento in atrio.</p>
|
||||||
Questo sito permette di visualizzare il proprio orario delle lezioni, con informazioni
|
</ProjectCard>
|
||||||
sui docenti e le aule.
|
<ProjectCard
|
||||||
</div>
|
title='Cluster "Steffè"'
|
||||||
</div>
|
href="http://steffe.cs.dm.unipi.it/"
|
||||||
</a>
|
style="--masonry-height: 2;"
|
||||||
<a target="_blank" href="https://lab.phc.dm.unipi.it/problemi/" style="--masonry-height: 2;">
|
imgSrc="https://steffe.lb.cs.dm.unipi.it/assets/img/logo.png"
|
||||||
<div class="project" style="--card-bg: #aa88c0;">
|
>
|
||||||
<div class="image">
|
<p>
|
||||||
<img
|
Cluster progettato ed assemblato durante il progetto speciale per la didattica "Calcolo
|
||||||
src="https://lab.phc.dm.unipi.it/problemi/favicon/android-chrome-512x512.png"
|
Parallelo dall'Infrastruttura alla Matematica".
|
||||||
alt="logo Problemi"
|
</p>
|
||||||
/>
|
</ProjectCard>
|
||||||
</div>
|
<ProjectCard
|
||||||
<div class="title">Problemi</div>
|
title="Seminarietti"
|
||||||
<div class="description">
|
href="https://seminarietti.phc.dm.unipi.it/"
|
||||||
<p>
|
style="--card-bg: #bd9fec; --masonry-height: 2;"
|
||||||
Bacheca di problemi di Matematica da risolvere, inviandone le soluzioni in LaTeX.
|
imgSrc="https://seminarietti.phc.dm.unipi.it/favicon.png"
|
||||||
</p>
|
>
|
||||||
|
<p>Varie conferenze del PHC su argomenti di informatica, matematica e tecnologia.</p>
|
||||||
<p>Di sera, puoi leggere i problemi sullo schermo del Dipartimento in atrio.</p>
|
</ProjectCard>
|
||||||
</div>
|
<ProjectCard
|
||||||
</div>
|
title="Tutorato"
|
||||||
</a>
|
href="https://tutorato.phc.dm.unipi.it/"
|
||||||
<a href="http://steffe.cs.dm.unipi.it/" style="--masonry-height: 2;">
|
style="--card-bg: #c55; --masonry-height: 2;"
|
||||||
<div class="project">
|
imgSrc="https://tutorato.phc.dm.unipi.it/favicon.svg"
|
||||||
<div class="image cover">
|
>
|
||||||
<img src="https://steffe.lb.cs.dm.unipi.it/assets/img/logo.png" alt="Logo Cluster" />
|
<p>
|
||||||
</div>
|
Un sito con tutte le informazioni sui tutorati di Matematica, con tanto di archivio degli
|
||||||
<div class="title">Cluster "Steffè"</div>
|
anni passati.
|
||||||
<div class="description">
|
</p>
|
||||||
Cluster progettato ed assemblato durante il progetto speciale per la didattica
|
</ProjectCard>
|
||||||
"Calcolo Parallelo dall'Infrastruttura alla Matematica".
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a target="_blank" href="https://seminarietti.phc.dm.unipi.it/" style="--masonry-height: 2;">
|
|
||||||
<div class="project" style="--card-bg: #bd9fec;">
|
|
||||||
<div class="image">
|
|
||||||
<img src="https://seminarietti.phc.dm.unipi.it/favicon.png" alt="Logo Seminarietti" />
|
|
||||||
</div>
|
|
||||||
<div class="title">Seminarietti</div>
|
|
||||||
<div class="description">
|
|
||||||
Varie conferenze del PHC su argomenti di informatica, matematica e tecnologia.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a target="_blank" href="https://tutorato.phc.dm.unipi.it/" style="--masonry-height: 2;">
|
|
||||||
<div class="project" style="--card-bg: #c55;">
|
|
||||||
<div class="image">
|
|
||||||
<img src="https://tutorato.phc.dm.unipi.it/favicon.svg" alt="Logo Tutorato" />
|
|
||||||
</div>
|
|
||||||
<div class="title">Tutorato</div>
|
|
||||||
<div class="description">
|
|
||||||
Un sito con tutte le informazioni sui tutorati di Matematica, con tanto di archivio
|
|
||||||
degli anni passati.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="wanna-be-macchinista">
|
<section class="wanna-be-macchinista">
|
||||||
<div class="zig-zag">
|
<HomepageZigZag color="#888" />
|
||||||
<svg
|
|
||||||
width="100%"
|
<div class="title"></div>
|
||||||
height="2rem"
|
|
||||||
viewBox="0 0 1 1"
|
<Card large style="--card-base: #ddd;">
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
<div class="title" title="recentemente, anche il caffè">E cosa si fa in PHC?</div>
|
||||||
preserveAspectRatio="xMinYMid meet"
|
|
||||||
>
|
|
||||||
<defs>
|
|
||||||
<pattern id="zig-zag-3" x="0" y="0" width="2" height="1" patternUnits="userSpaceOnUse">
|
|
||||||
<path fill="#888" d="M 0,1 L 1,0 L 2,1 L 0,1"></path>
|
|
||||||
</pattern>
|
|
||||||
</defs>
|
|
||||||
<rect fill="url(#zig-zag-3)" x="0" y="0" width="1000" height="1"></rect>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<span></span>
|
|
||||||
<span></span>
|
|
||||||
<div class="card large" style="--card-base: #ddd;">
|
|
||||||
<div class="title">E cosa si fa in PHC?</div>
|
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<p>Nessuno lo sa di preciso, ma facciamo molte cose:</p>
|
<p>Nessuno lo sa di preciso, ma facciamo molte cose:</p>
|
||||||
<ul>
|
<ul>
|
||||||
@@ -232,7 +166,7 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
|
|||||||
e condividere la passione per la tecnologia.
|
e condividere la passione per la tecnologia.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</Card>
|
||||||
<div class="gallery-collage">
|
<div class="gallery-collage">
|
||||||
{
|
{
|
||||||
galleryCollage.map((module, i) => {
|
galleryCollage.map((module, i) => {
|
||||||
@@ -248,14 +182,15 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
|
|||||||
: [1, 1]
|
: [1, 1]
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div class="card" style={`--rows: ${rows}; --cols: ${cols};`}>
|
<Card style={`--rows: ${rows}; --cols: ${cols};`}>
|
||||||
<Image src={module.default} alt={`gallery image ${i}`} />
|
<Image src={module.default} alt={`gallery image ${i}`} />
|
||||||
</div>
|
</Card>
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<div class="card large" style="--card-base: #ddd;">
|
|
||||||
|
<Card large style="--card-base: #ddd;">
|
||||||
<div class="title">Vuoi diventare macchinista?</div>
|
<div class="title">Vuoi diventare macchinista?</div>
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<p>
|
<p>
|
||||||
@@ -268,6 +203,6 @@ const galleryCollage = await Astro.glob('@/assets/gallery/*.jpg')
|
|||||||
tutti gli effetti.
|
tutti gli effetti.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</Card>
|
||||||
</section>
|
</section>
|
||||||
</PageLayout>
|
</PageLayout>
|
||||||
|
|||||||
@@ -241,14 +241,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
|
object-fit: cover;
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
height: 4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.cover {
|
|
||||||
img {
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// &.auto {
|
// &.auto {
|
||||||
|
|||||||
Reference in New Issue
Block a user