Skip to content

Commit

Permalink
Fix layout and css.
Browse files Browse the repository at this point in the history
  • Loading branch information
@lehaas
lehaas committed Nov 27, 2024
1 parent 1915a49 commit ab255ee
Show file tree
Hide file tree
Showing 3 changed files with 80 additions and 60 deletions.
17 changes: 15 additions & 2 deletions assets/uno.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,10 +79,11 @@
.my-2{margin-top:0.5rem;margin-bottom:0.5rem;}
.my-4{margin-top:1rem;margin-bottom:1rem;}
.my-8{margin-top:2rem;margin-bottom:2rem;}
.mt-4{margin-top:1rem;}
.h-full{height:100%;}
.h-screen{height:100vh;}
.w-full{width:100%;}
.flex{display:flex;}
.basis-1\/3{flex-basis:33.3333333333%;}
.basis-2\/3{flex-basis:66.6666666667%;}
.flex-row{flex-direction:row;}
.flex-row-reverse{flex-direction:row-reverse;}
.flex-col{flex-direction:column;}
Expand All @@ -92,14 +93,21 @@
.gap-16{gap:4rem;}
.gap-2{gap:0.5rem;}
.gap-4{gap:1rem;}
.gap-8{gap:2rem;}
.gap-x-2{column-gap:0.5rem;}
.scroll-smooth{scroll-behavior:smooth;}
.whitespace-nowrap{white-space:nowrap;}
.rounded{border-radius:0.25rem;}
.rounded-xl{border-radius:0.75rem;}
.bg-sunglow{--un-bg-opacity:1;background-color:rgb(255 200 87 / var(--un-bg-opacity)) /* #FFC857 */;}
.object-cover{object-fit:cover;}
.p-6{padding:1.5rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.text-center{text-align:center;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.text-4xl{font-size:2.25rem;line-height:2.5rem;}
.text-5xl{font-size:3rem;line-height:1;}
.text-7xl{font-size:4.5rem;line-height:1;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-sm{font-size:0.875rem;line-height:1.25rem;}
.text-english{--un-text-opacity:1;color:rgb(75 63 114 / var(--un-text-opacity)) /* #4B3F72 */;}
Expand All @@ -114,7 +122,12 @@
.sm\:p-8{padding:2rem;}
}
@media (min-width: 768px){
.md\:basis-1\/3{flex-basis:33.3333333333%;}
.md\:basis-2\/3{flex-basis:66.6666666667%;}
.md\:p-12{padding:3rem;}
.md\:pl-16{padding-left:4rem;}
.md\:pr-16{padding-right:4rem;}
.md\:text-5xl{font-size:3rem;line-height:1;}
.md\:text-6xl{font-size:3.75rem;line-height:1;}
.md\:text-8xl{font-size:6rem;line-height:1;}
}
114 changes: 60 additions & 54 deletions index.html.pm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@
◊h1[#:class "text-5xl md:text-6xl font-bold text-center"]{
Lust auf:
}
◊div[#:class "mx-8 flex flex-col gap-4"]{
◊div[#:class "mx-8 flex flex-col gap-8"]{
◊braced[#:href "#Projekte"]{
gemeinsam an Projekten arbeiten
Projekte
}
◊braced[#:href "#Lernen"]{
Lernen
Expand All @@ -17,70 +17,76 @@
}
}

◊sec[#:title "Projekte"]{
◊div[#:class "flex flex-row flex-wrap my-4"]{
◊div[#:class "basis-1/3"]{
◊img[#:src "assets/"]{
◊div[#:class "px-4"]{
◊sec[#:title "Projekte"]{
◊div[#:class "flex flex-row flex-wrap my-8"]{
◊div[#:class "md:basis-1/3"]{
◊img[#:src "/assets/stock_image.jpg" #:class "object-cover h-full w-full rounded-xl"]{

}
}
}
◊div[#:class "basis-2/3"]{
◊par{
Das ist ....
}
◊par{
}
◊par{
}
◊par{
◊div[#:class "md:basis-2/3 md:pl-16 my-4"]{
◊par{
Das sind einige von uns beim coden (ja, wir haben Spaß).
}
◊par{
Wir sind Menschen, die ziemlich gerne
}
◊par{
Gleichzeitig sind am Mittwoch-19 viele Menschen in der Westspitze, die absolut mal wieder Lust darauf haben, ihre LinA-1 Kenntnisse zu benutzen.
}
◊par{
Deswegen geht tk am Mittwoch-19 in die Westspitze, um gemeinsam mit anderen an ihren Zetteln zu rechnen. Das macht ihr mehr Spaß; und sie lernt auch schneller.
}
}
}

}
}
◊sec[#:title "Lernen"]{
◊div[#:class "flex flex-row-reverse flex-wrap my-4"]{
◊div[#:class "basis-1/3"]{
◊img[#:src "assets/"]{
◊sec[#:title "Lernen"]{
◊div[#:class "flex flex-row-reverse flex-wrap my-8"]{
◊div[#:class "rounded md:basis-1/3"]{
◊img[#:src "/assets/stock_image.jpg" #:class "object-cover h-full w-full rounded-xl"]{

}
}
}
◊div[#:class "basis-2/3"]{
◊par{
Das ist tk.
}
◊par{
tk möchte nicht alleine an ihren LinA-Zetteln rechnen.
}
◊par{
Gleichzeitig sind am Mittwoch-19 viele Menschen in der Westspitze, die absolut mal wieder Lust darauf haben, ihre LinA-1 Kenntnisse zu benutzen.
}
◊par{
Deswegen geht tk am Mittwoch-19 in die Westspitze, um gemeinsam mit anderen an ihren Zetteln zu rechnen. Das macht ihr mehr Spaß; und sie lernt auch schneller.
◊div[#:class "md:basis-2/3 md:pr-16 my-4"]{
◊par{
Das ist tk.
}
◊par{
tk möchte nicht alleine an ihren LinA-Zetteln rechnen.
}
◊par{
Gleichzeitig sind am Mittwoch-19 viele Menschen in der Westspitze, die absolut mal wieder Lust darauf haben, ihre LinA-1 Kenntnisse zu benutzen.
}
◊par{
Deswegen geht tk am Mittwoch-19 in die Westspitze, um gemeinsam mit anderen an ihren Zetteln zu rechnen. Das macht ihr mehr Spaß; und sie lernt auch schneller.
}
}
}
}
}
◊sec[#:title "Spaß"]{
◊div[#:class "flex flex-row flex-wrap my-4"]{
◊div[#:class "basis-1/3"]{
◊img[#:src "assets/"]{
◊sec[#:title "Spaß"]{
◊div[#:class "flex flex-row flex-wrap my-8"]{
◊div[#:class "md:basis-1/3"]{
◊img[#:src "/assets/stock_image.jpg" #:class "object-cover h-full w-full rounded-xl"]{
}
}
}
◊div[#:class "basis-2/3"]{
◊par{
Das sind einige von uns beim coden (ja, wir haben Spaß).
}
◊par{
Wir sind Menschen, die ziemlich gerne
}
◊par{
Gleichzeitig sind am Mittwoch-19 viele Menschen in der Westspitze, die absolut mal wieder Lust darauf haben, ihre LinA-1 Kenntnisse zu benutzen.
}
◊par{
Deswegen geht tk am Mittwoch-19 in die Westspitze, um gemeinsam mit anderen an ihren Zetteln zu rechnen. Das macht ihr mehr Spaß; und sie lernt auch schneller.
◊div[#:class "md:basis-2/3 md:pl-16 mt-4"]{
◊par{
Das sind einige von uns beim coden (ja, wir haben Spaß).
}
◊par{
Wir sind Menschen, die ziemlich gerne
}
◊par{
Gleichzeitig sind am Mittwoch-19 viele Menschen in der Westspitze, die absolut mal wieder Lust darauf haben, ihre LinA-1 Kenntnisse zu benutzen.
}
◊par{
Deswegen geht tk am Mittwoch-19 in die Westspitze, um gemeinsam mit anderen an ihren Zetteln zu rechnen. Das macht ihr mehr Spaß; und sie lernt auch schneller.
}
}
}
}
}
}
}
9 changes: 5 additions & 4 deletions pollen.rkt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@
(provide (all-defined-out))

(define (braced #:href href . elems)
`(a ([class "flex justify-center gap-2 text-4xl md:text-5xl font-bold"] [href ,href])
(span "{")
(span ,@elems)
(span "}")))
`(a ([class "flex justify-center gap-4 text-3xl md:text-5xl items-center "] [href ,href])
(span ([class "text-7xl md:text-8xl"]) "{")
(span ([class "font-bold text-center"]) ,@elems)
(span ([class "text-7xl md:text-8xl"]) "}")))

(define (sec #:title title . elems)
`(div ([id ,title] [class "my-8 mx-6"])
Expand All @@ -19,3 +19,4 @@
(define (par . elems)
`(p ([class "text-lg my-2"])
,@elems))

0 comments on commit ab255ee

Please sign in to comment.