mirror of
https://github.com/Steffo99/unisteffo.git
synced 2024-11-21 15:34:21 +00:00
git fire
This commit is contained in:
parent
6e7f6e93a0
commit
2e790950c7
4 changed files with 59 additions and 17 deletions
|
@ -4,6 +4,7 @@ import "@steffo/bluelib/dist/glass.root.css"
|
|||
import "@steffo/bluelib/dist/fun.root.css"
|
||||
import "@steffo/bluelib/dist/colors-royalblue.root.css"
|
||||
import "@steffo/bluelib/dist/fonts-fira-ghpages.root.css"
|
||||
import "../styles/global.css"
|
||||
import React from "react"
|
||||
|
||||
|
||||
|
|
31
app/page.tsx
31
app/page.tsx
|
@ -6,20 +6,39 @@ export default function Page() {
|
|||
return (
|
||||
<Layout
|
||||
heading="Unisteffo"
|
||||
main={
|
||||
main={<>
|
||||
<Chapter heading="Dove sono?" columns={1}>
|
||||
<Topic heading="Su Unisteffo!">
|
||||
<p>
|
||||
Il mio sito di appunti.
|
||||
Il mio sito di appunti aggiornato sperimentale.
|
||||
</p>
|
||||
</Topic>
|
||||
</Chapter>
|
||||
}
|
||||
<Chapter heading="Perchè ci sono?" columns={1}>
|
||||
<Topic heading="Si vede?">
|
||||
<p>
|
||||
idk magari hai una qualche configurazione strana del browser e si vede tutto rotto
|
||||
</p>
|
||||
</Topic>
|
||||
<Topic heading="Come si vede?">
|
||||
<p>
|
||||
idk magari fa schifissimo
|
||||
</p>
|
||||
</Topic>
|
||||
<Topic heading="Sfondo">
|
||||
<p>
|
||||
lo sfondo è wip perchè è overused
|
||||
</p>
|
||||
</Topic>
|
||||
</Chapter>
|
||||
</>}
|
||||
sidebar={
|
||||
<Chapter heading="Indice" columns={1}>
|
||||
<div className="panel box" style={{height: "200vh"}}>
|
||||
sus
|
||||
</div>
|
||||
<Topic heading="Glossario molto lungo">
|
||||
<ol>
|
||||
{[...Array(1000).keys()].map((n) => <li key={n}>ඞ</li>)}
|
||||
</ol>
|
||||
</Topic>
|
||||
</Chapter>
|
||||
}
|
||||
/>
|
||||
|
|
|
@ -1,17 +1,30 @@
|
|||
.layout {
|
||||
padding: 8px;
|
||||
height: calc(100vh - 16px);
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"heading empty"
|
||||
"heading side"
|
||||
"main side"
|
||||
;
|
||||
grid-template-rows: auto 1fr;
|
||||
grid-template-rows: 68px 1fr;
|
||||
grid-template-columns: 1fr 320px;
|
||||
align-content: stretch;
|
||||
column-gap: 8px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1328px) {
|
||||
|
||||
.layout {
|
||||
grid-template-areas:
|
||||
"heading"
|
||||
"main"
|
||||
;
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.layout > .sidebar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.layout > .heading {
|
||||
|
@ -21,14 +34,25 @@
|
|||
.layout > .main {
|
||||
grid-area: main;
|
||||
overflow-y: scroll;
|
||||
|
||||
padding: 8px;
|
||||
padding-right: 7px;
|
||||
}
|
||||
|
||||
.layout > .sidebar {
|
||||
grid-area: side;
|
||||
overflow-y: scroll;
|
||||
|
||||
padding: 8px;
|
||||
padding-top: 68px;
|
||||
padding-left: 1px;
|
||||
}
|
||||
|
||||
.layout :where(:global(.chapter-0), :global(.chapter-1), :global(.chapter-2), :global(.chapter-3), :global(.chapter-4), :global(.chapter-5), :global(.chapter-6), :global(.chapter-7), :global(.chapter-8), :global(.chapter-9)):first-child {
|
||||
.layout > .main > :where(:global(.chapter-0), :global(.chapter-1), :global(.chapter-2), :global(.chapter-3), :global(.chapter-4), :global(.chapter-5), :global(.chapter-6), :global(.chapter-7), :global(.chapter-8), :global(.chapter-9)) > :global(.panel) {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.layout :where(:global(.chapter-0), :global(.chapter-1), :global(.chapter-2), :global(.chapter-3), :global(.chapter-4), :global(.chapter-5), :global(.chapter-6), :global(.chapter-7), :global(.chapter-8), :global(.chapter-9)):first-child, .layout :where(:global(.chapter-0), :global(.chapter-1), :global(.chapter-2), :global(.chapter-3), :global(.chapter-4), :global(.chapter-5), :global(.chapter-6), :global(.chapter-7), :global(.chapter-8), :global(.chapter-9)):first-child :where(h1, h2, h3, h4, h5, h6) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,7 +1,5 @@
|
|||
body {
|
||||
margin: 0;
|
||||
background-image: url("https://www.steffo.eu/space_default.jpg");
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
#root {
|
||||
min-height: 100vh;
|
||||
}
|
Loading…
Reference in a new issue