feat: dummy pages

internal/components/page/controller.go

@@ -1,13 +1,20 @@
 package page
 
-type Page struct {
+import "context"
+
+type PageHeader struct {
 	UID           string
 	Title         string
 	CoverImageUID string
 }
 
-func (s *Service) GetPages() (pages []Page, err error) {
+type Page struct {
-	pages = []Page{
+	PageHeader
+	Content string
+}
+
+func (s *Service) GetPages() (pages []PageHeader, err error) {
+	pages = []PageHeader{
 		{
 			UID:           "asdf",
 			Title:         "asdfAasdf!",
@@ -17,3 +24,33 @@ func (s *Service) GetPages() (pages []Page, err error) {
 
 	return
 }
+
+func (s *Service) GetPage(ctx context.Context, uid string) (page Page, err error) {
+	content := `
+<h1>LOL</h1>
+	<p> 
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed mollis ligula vel nisl pellentesque aliquet. Maecenas eu congue tortor. Nunc mattis ligula vel augue viverra cursus. Suspendisse potenti. Vivamus in risus vitae mi molestie feugiat. Cras sapien tortor, elementum ut tempus vel, commodo at dui. In hac habitasse platea dictumst. Integer nec ullamcorper purus, tincidunt elementum felis. Duis hendrerit tempor vestibulum. Nunc ut finibus tellus. Donec eu lacus sit amet sem suscipit imperdiet. Quisque cursus vulputate sodales. In sit amet nisl a est lacinia sagittis. 	</p> 
+	<img src="https://picsum.photos/500/1000">
+<h2>LOL</h2>
+<p> 
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed mollis ligula vel nisl pellentesque aliquet. Maecenas eu congue tortor. Nunc mattis ligula vel augue viverra cursus. Suspendisse potenti. Vivamus in risus vitae mi molestie feugiat. Cras sapien tortor, elementum ut tempus vel, commodo at dui. In hac habitasse platea dictumst. Integer nec ullamcorper purus, tincidunt elementum felis. Duis hendrerit tempor vestibulum. Nunc ut finibus tellus. Donec eu lacus sit amet sem suscipit imperdiet. Quisque cursus vulputate sodales. In sit amet nisl a est lacinia sagittis. 	</p> 
+
+	<img src="https://picsum.photos/600/500">
+
+<p> 
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed mollis ligula vel nisl pellentesque aliquet. Maecenas eu congue tortor. Nunc mattis ligula vel augue viverra cursus. Suspendisse potenti. Vivamus in risus vitae mi molestie feugiat. Cras sapien tortor, elementum ut tempus vel, commodo at dui. In hac habitasse platea dictumst. Integer nec ullamcorper purus, tincidunt elementum felis. Duis hendrerit tempor vestibulum. Nunc ut finibus tellus. Donec eu lacus sit amet sem suscipit imperdiet. Quisque cursus vulputate sodales. In sit amet nisl a est lacinia sagittis. 	</p> 
+
+<h3>LOL</h3>
+<p> 
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed mollis ligula vel nisl pellentesque aliquet. Maecenas eu congue tortor. Nunc mattis ligula vel augue viverra cursus. Suspendisse potenti. Vivamus in risus vitae mi molestie feugiat. Cras sapien tortor, elementum ut tempus vel, commodo at dui. In hac habitasse platea dictumst. Integer nec ullamcorper purus, tincidunt elementum felis. Duis hendrerit tempor vestibulum. Nunc ut finibus tellus. Donec eu lacus sit amet sem suscipit imperdiet. Quisque cursus vulputate sodales. In sit amet nisl a est lacinia sagittis. 	</p> 
+`
+	page = Page{
+		PageHeader: PageHeader{
+			UID:           uid,
+			Title:         "This is my page Title",
+			CoverImageUID: "uid",
+		},
+		Content: content,
+	}
+	return
+}

internal/handlers/handlehome/controller.go

@@ -3,7 +3,6 @@ package handlehome
 import (
 	"net/http"
 
-	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/internal/components/page"
 	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/layouts"
 	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/pages"
 )
@@ -20,5 +19,12 @@ func (h *Handler) home(w http.ResponseWriter, r *http.Request) {
 
 func (h *Handler) page(w http.ResponseWriter, r *http.Request) {
 	uid := r.PathValue("uid")
-	layouts.Render(r.Context(), w, r, pages.ContentPage(page.Page{Title: uid}))
+
+	page, err := h.src.GetPage(r.Context(), uid)
+	if err != nil {
+		w.WriteHeader(http.StatusInternalServerError)
+		return
+	}
+
+	layouts.Render(r.Context(), w, r, pages.ContentPage(page))
 }

internal/handlers/handlehome/resource.go

@@ -1,6 +1,7 @@
 package handlehome
 
 import (
+	"context"
 	"net/http"
 
 	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/internal/components/page"
@@ -21,5 +22,6 @@ func New(mux *http.ServeMux, srv pageService) *Handler {
 }
 
 type pageService interface {
-	GetPages() ([]page.Page, error)
+	GetPages() ([]page.PageHeader, error)
+	GetPage(ctx context.Context, uid string) (page.Page, error)
 }

package.json

@@ -45,11 +45,13 @@
     "watch:css": "tailwindcss -i ./web/static/css/input.css -o ./web/static/css/output.css --watch",
     "build:js": "cp node_modules/htmx.org/dist/htmx.min.js web/static/js/htmx.min.js"
   },
-    "keywords": [],  "author": "",
+  "keywords": [],
+  "author": "",
   "license": "ISC",
   "packageManager": "pnpm@10.28.2",
   "devDependencies": {
     "@tailwindcss/cli": "^4.1.18",
+    "@tailwindcss/typography": "^0.5.19",
     "autoprefixer": "^10.4.24",
     "postcss": "^8.5.6",
     "tailwindcss": "^4.1.18"

pnpm-lock.yaml

@@ -335,6 +335,9 @@ packages:
       '@tailwindcss/cli':
         specifier: ^4.1.18
         version: 4.1.18
+      '@tailwindcss/typography':
+        specifier: ^0.5.19
+        version: 0.5.19(tailwindcss@4.1.18)
       autoprefixer:
         specifier: ^10.4.24
         version: 10.4.24(postcss@8.5.6)
@@ -1003,6 +1006,11 @@ packages:
     resolution: {integrity: sha512-EgCR5tTS5bUSKQgzeMClT6iCY3ToqE1y+ZB0AKldj809QXk1Y+3jB0upOYZrn9aGIzPtUsP7sX4QQ4XtjBB95A==}
     engines: {node: '>= 10'}
 
+  '@tailwindcss/typography@0.5.19':
+    resolution: {integrity: sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1'
+
   autoprefixer@10.4.24:
     resolution: {integrity: sha512-uHZg7N9ULTVbutaIsDRoUkoS8/h3bdsmVJYZ5l3wv8Cp/6UIIoRDm90hZ+BwxUj/hGBEzLxdHNSKuFpn8WOyZw==}
 >>>>>>> cbc2a1a (feat: translation middleware)
@@ -1400,6 +1408,11 @@ packages:
   caniuse-lite@1.0.30001769:
     resolution: {integrity: sha512-BCfFL1sHijQlBGWBMuJyhZUhzo7wer5sVj9hqekB/7xn0Ypy+pER/edCYQm4exbXj4WiySGp40P8UuTh6w1srg==}
 
+  cssesc@3.0.0:
+    resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
+    engines: {node: '>=4'}
+    hasBin: true
+
   detect-libc@2.1.2:
     resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
     engines: {node: '>=8'}
@@ -1776,6 +1789,7 @@ packages:
     resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
     engines: {node: '>=12'}
 
+<<<<<<< HEAD
 <<<<<<< HEAD
   pify@2.3.0:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
@@ -1821,6 +1835,10 @@ packages:
 
   postcss-selector-parser@6.0.16:
     resolution: {integrity: sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==}
+=======
+  postcss-selector-parser@6.0.10:
+    resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
+>>>>>>> 6c4b219 (feat: dummy pages)
     engines: {node: '>=4'}
 
   postcss-value-parser@4.2.0:
@@ -2086,6 +2104,7 @@ packages:
     peerDependencies:
       browserslist: '>= 4.21.0'
 
+<<<<<<< HEAD
 <<<<<<< HEAD
   url-join@5.0.0:
     resolution: {integrity: sha512-n2huDr9h9yzd6exQVnH/jU5mr+Pfx08LRXXZhkLLetAMESRj+anQsTAh940iMrIetKAmry9coFuZQ2jY8/p3WA==}
@@ -3288,6 +3307,11 @@ snapshots:
   is-fullwidth-code-point@3.0.0: {}
 
 =======
+=======
+  util-deprecate@1.0.2:
+    resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
+
+>>>>>>> 6c4b219 (feat: dummy pages)
 snapshots:
 
   '@jridgewell/gen-mapping@0.3.13':
@@ -3440,6 +3464,11 @@ snapshots:
       '@tailwindcss/oxide-win32-arm64-msvc': 4.1.18
       '@tailwindcss/oxide-win32-x64-msvc': 4.1.18
 
+  '@tailwindcss/typography@0.5.19(tailwindcss@4.1.18)':
+    dependencies:
+      postcss-selector-parser: 6.0.10
+      tailwindcss: 4.1.18
+
   autoprefixer@10.4.24(postcss@8.5.6):
     dependencies:
       browserslist: 4.28.1
@@ -3461,6 +3490,8 @@ snapshots:
 
   caniuse-lite@1.0.30001769: {}
 
+  cssesc@3.0.0: {}
+
   detect-libc@2.1.2: {}
 
   electron-to-chromium@1.5.286: {}
@@ -3798,6 +3829,11 @@ snapshots:
 
   picomatch@4.0.3: {}
 
+  postcss-selector-parser@6.0.10:
+    dependencies:
+      cssesc: 3.0.0
+      util-deprecate: 1.0.2
+
   postcss-value-parser@4.2.0: {}
 
 >>>>>>> cbc2a1a (feat: translation middleware)
@@ -4140,4 +4176,9 @@ snapshots:
       browserslist: 4.28.1
       escalade: 3.2.0
       picocolors: 1.1.1
+<<<<<<< HEAD
 >>>>>>> cbc2a1a (feat: translation middleware)
+=======
+
+  util-deprecate@1.0.2: {}
+>>>>>>> 6c4b219 (feat: dummy pages)

web/layouts/base.templ

@@ -15,7 +15,7 @@ templ Base(title string) {
 			<link href="/css/output.css" rel="stylesheet"/>
 			<script src="/js/htmx.min.js"></script>
 		</head>
-		<body class="bg-black" hx-boost="true" hx-target="main">
+		<body class="bg-black dark" hx-boost="true" hx-target="main">
 			<header
 				class="fixed z-50 mix-blend-difference p-1 w-full flex justify-between items-start"
 			>
@@ -33,7 +33,7 @@ templ Base(title string) {
 					}
 				</nav>
 			</header>
-			<main>
+			<main class="text-white">
 				{ children... }
 			</main>
 		</body>

web/layouts/base_templ.go

@@ -59,7 +59,7 @@ func Base(title string) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</title><link rel=\"icon\" type=\"image/png\" href=\"/favicon.png\"><link href=\"/css/output.css\" rel=\"stylesheet\"><script src=\"/js/htmx.min.js\"></script></head><body class=\"bg-black\" hx-boost=\"true\" hx-target=\"main\"><header class=\"fixed z-50 mix-blend-difference p-1 w-full flex justify-between items-start\"><a class=\"text-white text-2xl\" href=\"/\">schreifuchs.ch</a><nav class=\"flex gap-2 p-2\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</title><link rel=\"icon\" type=\"image/png\" href=\"/favicon.png\"><link href=\"/css/output.css\" rel=\"stylesheet\"><script src=\"/js/htmx.min.js\"></script></head><body class=\"bg-black dark\" hx-boost=\"true\" hx-target=\"main\"><header class=\"fixed z-50 mix-blend-difference p-1 w-full flex justify-between items-start\"><a class=\"text-white text-2xl\" href=\"/\">schreifuchs.ch</a><nav class=\"flex gap-2 p-2\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -108,7 +108,7 @@ func Base(title string) templ.Component {
 				return templ_7745c5c3_Err
 			}
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</nav></header><main>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</nav></header><main class=\"text-white\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}

web/pages/index.templ

@@ -5,10 +5,10 @@ import (
 	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/components"
 )
 
-templ Home(pages []page.Page) {
+templ Home(pages []page.PageHeader) {
 	for _, page := range pages {
-		@components.ImageTile("https://picsum.photos/500/1000") {
+		@components.ImageTile("https://picsum.photos/1000/500") {
-			<a class="flex items-center justify-center h-full text-white" href={ "/" + page.UID }>
+			<a class="flex items-center justify-center h-full " href={ "/" + page.UID }>
 				<h2
 					class="text-3xl font-bold text-white hover:underline text-shadow-lg"
 				>

web/pages/index_templ.go

@@ -13,7 +13,7 @@ import (
 	"git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/components"
 )
 
-func Home(pages []page.Page) templ.Component {
+func Home(pages []page.PageHeader) templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
@@ -47,14 +47,14 @@ func Home(pages []page.Page) templ.Component {
 					}()
 				}
 				ctx = templ.InitializeContext(ctx)
-				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<a class=\"flex items-center justify-center h-full text-white\" href=\"")
+				templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<a class=\"flex items-center justify-center h-full \" href=\"")
 				if templ_7745c5c3_Err != nil {
 					return templ_7745c5c3_Err
 				}
 				var templ_7745c5c3_Var3 templ.SafeURL
 				templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinURLErrs("/" + page.UID)
 				if templ_7745c5c3_Err != nil {
-					return templ.Error{Err: templ_7745c5c3_Err, FileName: `pages/index.templ`, Line: 11, Col: 86}
+					return templ.Error{Err: templ_7745c5c3_Err, FileName: `pages/index.templ`, Line: 11, Col: 76}
 				}
 				_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 				if templ_7745c5c3_Err != nil {
@@ -79,7 +79,7 @@ func Home(pages []page.Page) templ.Component {
 				}
 				return nil
 			})
-			templ_7745c5c3_Err = components.ImageTile("https://picsum.photos/500/1000").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = components.ImageTile("https://picsum.photos/1000/500").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}

web/pages/page.templ

@@ -1,7 +1,17 @@
 package pages
 
 import "git.schreifuchs.ch/schreifuchs/schreifuchs.ch/internal/components/page"
+import "git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/components"
 
 templ ContentPage(content page.Page) {
-	<h2>{ content.Title }</h2>
+	@components.ImageTile("https://picsum.photos/1000/500") {
+		<h2 class="flex items-center justify-center h-full text-3xl font-bold  text-shadow-lg">
+			{ content.Title }
+		</h2>
+	}
+	<div class="flex items-start justify-center pt-8 bg-black min-h-screen px-12">
+		<section class="max-w-6xl w-full prose prose-invert text-justify">
+			@templ.Raw(content.Content)
+		</section>
+	</div>
 }

web/pages/page_templ.go

@@ -9,6 +9,7 @@ import "github.com/a-h/templ"
 import templruntime "github.com/a-h/templ/runtime"
 
 import "git.schreifuchs.ch/schreifuchs/schreifuchs.ch/internal/components/page"
+import "git.schreifuchs.ch/schreifuchs/schreifuchs.ch/web/components"
 
 func ContentPage(content page.Page) templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
@@ -31,16 +32,28 @@ func ContentPage(content page.Page) templ.Component {
 			templ_7745c5c3_Var1 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<h2>")
+		templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<h2 class=\"flex items-center justify-center h-full text-3xl font-bold  text-shadow-lg\">")
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-		var templ_7745c5c3_Var2 string
+			var templ_7745c5c3_Var3 string
-		templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(content.Title)
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(content.Title)
 			if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pages/page.templ`, Line: 6, Col: 20}
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pages/page.templ`, Line: 9, Col: 18}
 			}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -50,6 +63,24 @@ func ContentPage(content page.Page) templ.Component {
 			}
 			return nil
 		})
+		templ_7745c5c3_Err = components.ImageTile("https://picsum.photos/1000/500").Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "<div class=\"flex items-start justify-center pt-8 bg-black min-h-screen px-12\"><section class=\"max-w-6xl w-full prose prose-invert text-justify\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.Raw(content.Content).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "</section></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
 }
 
 var _ = templruntime.GeneratedTemplate

web/static/css/input.css

@@ -1,22 +1,31 @@
 @import "tailwindcss";
+@plugin "@tailwindcss/typography";
 @source "../../**/*.templ";
 
+@custom-variant dark (&:where(.dark, .dark *));
+
 @font-face {
-  font-family: 'Outfit';
+  font-family: "Outfit";
   font-style: normal;
   font-weight: 100 900;
   font-display: swap;
-  src: url('../fonts/Outfit-LatinExt-Variable.woff2') format('woff2');
+  src: url("../fonts/Outfit-LatinExt-Variable.woff2") format("woff2");
-  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
+    U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
+    U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
 }
 
 @font-face {
-  font-family: 'Outfit';
+  font-family: "Outfit";
   font-style: normal;
   font-weight: 100 900;
   font-display: swap;
-  src: url('../fonts/Outfit-Latin-Variable.woff2') format('woff2');
+  src: url("../fonts/Outfit-Latin-Variable.woff2") format("woff2");
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
+    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
+    U+2215, U+FEFF, U+FFFD;
 }
 
 @theme {
@@ -37,3 +46,13 @@
 @utility text-shadow-* {
   text-shadow: --value(--text-shadow-*, [color], [*]);
 }
+
+@layer components {
+  .prose img {
+    margin-left: auto;
+    margin-right: auto;
+    display: block;
+
+    max-height: 90vh;
+  }
+}