improve styling

ry · ry · commit 76cfcf5d475f · 2025-07-30T07:59:26.000-07:00
diff --git a/_includes/layout.tsx b/_includes/layout.tsx
@@ -43,12 +43,13 @@ export default function Layout(
             }
 
             body {
-              font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
+              font-family: "Times New Roman", Times, serif;
               line-height: 1.6;
               margin: 0;
               padding: 0;
               background: ${background || "#fff"};
               color: #333;
+              font-size: 18px;
             }
 
             body.dark {
@@ -57,9 +58,9 @@ export default function Layout(
             }
 
             .container {
-              max-width: 640px;
+              max-width: 680px;
               margin: 0 auto;
-              padding: 2rem 1rem;
+              padding: 3rem 2rem;
             }
 
             .header {
@@ -69,7 +70,6 @@ export default function Layout(
               position: relative;
             }
 
-
             .avatar {
               width: 80px;
               height: 80px;
@@ -118,7 +118,7 @@ export default function Layout(
             }
             
             .theme-toggle:hover, .back-button:hover {
-              background: #f5f;
+              background: #f8f8f8;
               color: #333;
               text-decoration: none;
             }
@@ -152,13 +152,10 @@ export default function Layout(
 
             @media (max-width: 640px) {
               .header {
-                flex-direction: column;
-                text-align: center;
                 gap: 1rem;
               }
               
               .avatar {
-                margin-right: 0;
                 width: 64px;
                 height: 64px;
               }
@@ -191,7 +188,6 @@ export default function Layout(
               font-size: 2.25rem;
             }
             
-            
             h2 { font-size: 1.875rem; }
             h3 { font-size: 1.5rem; }
 
@@ -218,7 +214,6 @@ export default function Layout(
               max-height: 350px;
             }
 
-
             .post-list {
               list-style: none;
               padding: 0;
@@ -235,9 +230,8 @@ export default function Layout(
               font-weight: 600;
             }
 
-
             .content p {
-              margin-bottom: 1rem;
+              margin-bottom: 1.5rem;
             }
 
             .content blockquote {
@@ -252,7 +246,7 @@ export default function Layout(
             }
 
             .content pre {
-              background-color: #f5f;
+              background-color: #f8f8f8;
               padding: 1.5rem;
               border-radius: 0.375rem;
               overflow-x: auto;
@@ -261,24 +255,27 @@ export default function Layout(
             }
 
             body.dark .content pre {
-              background-color: #222;
+              background-color: #1a1a1a;
             }
 
             .content code {
-              background-color: #f5f;
+              background-color: #f8f8f8;
               padding: 0.125rem 0.25rem;
               border-radius: 0.25rem;
               font-size: 0.875em;
             }
 
             body.dark .content code {
-              background-color: #222;
+              background-color: #1a1a1a;
             }
 
-
             @media (max-width: 640px) {
               .container {
-                padding: 1rem 0.75rem;
+                padding: 2rem 1.5rem;
+              }
+              
+              body {
+                font-size: 16px;
               }
               
               h1, .post-title { font-size: 1.875rem; }
diff --git a/feed.xml.page.ts b/feed.xml.page.ts
@@ -1,6 +1,6 @@
 export const url = "/feed.xml";
 
-export default function() {
+export default function () {
   return `<!DOCTYPE html>
 <html>
 <head>
@@ -10,4 +10,4 @@ export default function() {
   <p>Redirecting to <a href="/feed">/feed</a>...</p>
 </body>
 </html>`;
-}
+}
diff --git a/optimistic_nihilism.page.ts b/optimistic_nihilism.page.ts
@@ -1,6 +1,6 @@
 export const url = "/optimistic_nihilism";
 
-export default function() {
+export default function () {
   return `<!DOCTYPE html>
 <html>
 <head>

Original file line number	Diff line number	Diff line change
`@@ -43,12 +43,13 @@ export default function Layout(`
`43`	`43`	`}`
`44`	`44`
`45`	`45`	`body {`
`46`		`- font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;`
	`46`	`+ font-family: "Times New Roman", Times, serif;`
`47`	`47`	`line-height: 1.6;`
`48`	`48`	`margin: 0;`
`49`	`49`	`padding: 0;`
`50`	`50`	`background: ${background \|\| "#fff"};`
`51`	`51`	`color: #333;`
	`52`	`+ font-size: 18px;`
`52`	`53`	`}`
`53`	`54`
`54`	`55`	`body.dark {`
`@@ -57,9 +58,9 @@ export default function Layout(`
`57`	`58`	`}`
`58`	`59`
`59`	`60`	`.container {`
`60`		`- max-width: 640px;`
	`61`	`+ max-width: 680px;`
`61`	`62`	`margin: 0 auto;`
`62`		`- padding: 2rem 1rem;`
	`63`	`+ padding: 3rem 2rem;`
`63`	`64`	`}`
`64`	`65`
`65`	`66`	`.header {`
`@@ -69,7 +70,6 @@ export default function Layout(`
`69`	`70`	`position: relative;`
`70`	`71`	`}`
`71`	`72`
`72`		`-`
`73`	`73`	`.avatar {`
`74`	`74`	`width: 80px;`
`75`	`75`	`height: 80px;`
`@@ -118,7 +118,7 @@ export default function Layout(`
`118`	`118`	`}`
`119`	`119`
`120`	`120`	`.theme-toggle:hover, .back-button:hover {`
`121`		`- background: #f5f;`
	`121`	`+ background: #f8f8f8;`
`122`	`122`	`color: #333;`
`123`	`123`	`text-decoration: none;`
`124`	`124`	`}`
`@@ -152,13 +152,10 @@ export default function Layout(`
`152`	`152`
`153`	`153`	`@media (max-width: 640px) {`
`154`	`154`	`.header {`
`155`		`- flex-direction: column;`
`156`		`- text-align: center;`
`157`	`155`	`gap: 1rem;`
`158`	`156`	`}`
`159`	`157`
`160`	`158`	`.avatar {`
`161`		`- margin-right: 0;`
`162`	`159`	`width: 64px;`
`163`	`160`	`height: 64px;`
`164`	`161`	`}`
`@@ -191,7 +188,6 @@ export default function Layout(`
`191`	`188`	`font-size: 2.25rem;`
`192`	`189`	`}`
`193`	`190`
`194`		`-`
`195`	`191`	`h2 { font-size: 1.875rem; }`
`196`	`192`	`h3 { font-size: 1.5rem; }`
`197`	`193`
`@@ -218,7 +214,6 @@ export default function Layout(`
`218`	`214`	`max-height: 350px;`
`219`	`215`	`}`
`220`	`216`
`221`		`-`
`222`	`217`	`.post-list {`
`223`	`218`	`list-style: none;`
`224`	`219`	`padding: 0;`
`@@ -235,9 +230,8 @@ export default function Layout(`
`235`	`230`	`font-weight: 600;`
`236`	`231`	`}`
`237`	`232`
`238`		`-`
`239`	`233`	`.content p {`
`240`		`- margin-bottom: 1rem;`
	`234`	`+ margin-bottom: 1.5rem;`
`241`	`235`	`}`
`242`	`236`
`243`	`237`	`.content blockquote {`
`@@ -252,7 +246,7 @@ export default function Layout(`
`252`	`246`	`}`
`253`	`247`
`254`	`248`	`.content pre {`
`255`		`- background-color: #f5f;`
	`249`	`+ background-color: #f8f8f8;`
`256`	`250`	`padding: 1.5rem;`
`257`	`251`	`border-radius: 0.375rem;`
`258`	`252`	`overflow-x: auto;`
`@@ -261,24 +255,27 @@ export default function Layout(`
`261`	`255`	`}`
`262`	`256`
`263`	`257`	`body.dark .content pre {`
`264`		`- background-color: #222;`
	`258`	`+ background-color: #1a1a1a;`
`265`	`259`	`}`
`266`	`260`
`267`	`261`	`.content code {`
`268`		`- background-color: #f5f;`
	`262`	`+ background-color: #f8f8f8;`
`269`	`263`	`padding: 0.125rem 0.25rem;`
`270`	`264`	`border-radius: 0.25rem;`
`271`	`265`	`font-size: 0.875em;`
`272`	`266`	`}`
`273`	`267`
`274`	`268`	`body.dark .content code {`
`275`		`- background-color: #222;`
	`269`	`+ background-color: #1a1a1a;`
`276`	`270`	`}`
`277`	`271`
`278`		`-`
`279`	`272`	`@media (max-width: 640px) {`
`280`	`273`	`.container {`
`281`		`- padding: 1rem 0.75rem;`
	`274`	`+ padding: 2rem 1.5rem;`
	`275`	`+ }`
	`276`	`+`
	`277`	`+ body {`
	`278`	`+ font-size: 16px;`
`282`	`279`	`}`
`283`	`280`
`284`	`281`	`h1, .post-title { font-size: 1.875rem; }`