Nuovo stile homepage

main-old
Antonio De Lucreziis 3 years ago
parent b9ac8a61f7
commit 97266879e0

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

@ -355,6 +355,56 @@ a:hover {
/* Pages */
.page-home {
/* TODO: Sarebbe meglio se si riuscisse a capire come farlo senza */
overflow-x: hidden;
}
.page-home .nav-logo {
display: none;
}
.page-home .super {
position: absolute;
left: 50vw;
top: 50vh;
width: 90vw;
transform: translate(-50%, -50%);
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 2rem;
}
.page-home .super .block.text {
max-width: 40ch;
font-size: 2.5vmin;
}
.page-home .super .block.text h1 {
font-weight: var(--font-weight-medium);
}
.page-home .super .block.text p {
font-weight: var(--font-weight-light);
}
.page-home .super .block.image {
max-width: 80ch;
}
.page-home .super .block.image img {
width: 100%;
filter: drop-shadow(0 0 64px rgba(0, 0, 0, 0.2)) drop-shadow(0 0 8px rgba(0, 0, 0, 0.35));
}
.page-home .main {
padding-top: calc(100vh - 6rem);
}

@ -3,6 +3,20 @@
{{define "title"}}PHC • phc.dm.xxxxx.xx{{end}}
{{define "body"}}
<!-- Non avevo molta fantasia per il nome di questa classe -->
<section class="super">
<div class="block image">
<img src="assets/images/logo-circuit-board.svg" alt="phc-logo">
</div>
<div class="block text">
<h1>
Cos'è il PHC?
</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum vel maiores dolorum dicta, repellat nulla repellendus amet fuga voluptas molestiae, magni</p>
<p>Voluptatibus sequi praesentium similique, quos ex illo autem quidem!</p>
</div>
</section>
<section>
<h2>Notizie Importanti</h2>
<div class="card-list">

Loading…
Cancel
Save