Fix website mobile layout

devongovett · devongovett · commit 32e3eafb0e76 · 2023-01-04T10:22:49.000-05:00
diff --git a/website/docs.css b/website/docs.css
@@ -244,8 +244,8 @@ a[aria-current] {
 
 @media (width < 600px) {
   body {
-    grid-template-areas: "header" "nav" "main" "footer";
-    grid-template-columns: 1fr;
+    display: block;
+    width: auto;
   }
 
   nav {
diff --git a/website/pages/docs.md b/website/pages/docs.md
@@ -6,7 +6,7 @@
 
 # Getting Started
 
-Lightning CSS can be used as a library from JavaScript or Rust, or from a standalone CLI. It can also be wrapped as a plugin in other build tools, and it is the built into [Parcel](https://parceljs.org) out of the box.
+Lightning CSS can be used as a library from JavaScript or Rust, or from a standalone CLI. It can also be wrapped as a plugin in other build tools, and it is built into [Parcel](https://parceljs.org) out of the box.
 
 ## From Node
 
diff --git a/website/synthwave.css b/website/synthwave.css
@@ -16,7 +16,7 @@ pre[class*="language-"] {
   white-space: pre-wrap;
   word-spacing: normal;
   word-break: normal;
-  word-wrap: normal;
+  word-wrap: break-word;
   line-height: 1.5;
 
   -moz-tab-size: 4;

Original file line number	Diff line number	Diff line change
`@@ -244,8 +244,8 @@ a[aria-current] {`
`244`	`244`
`245`	`245`	`@media (width < 600px) {`
`246`	`246`	`body {`
`247`		`- grid-template-areas: "header" "nav" "main" "footer";`
`248`		`- grid-template-columns: 1fr;`
	`247`	`+ display: block;`
	`248`	`+ width: auto;`
`249`	`249`	`}`
`250`	`250`
`251`	`251`	`nav {`