Sweet trip grid

MaxwellBo · Jul 2, 2024 · 9d8d6ed · 9d8d6ed
1 parent b0a5a23
commit 9d8d6ed
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 18 deletions.
diff --git a/public/clouds.webp b/public/clouds.webp
diff --git a/src/App.tsx b/src/App.tsx
@@ -26,6 +26,24 @@ export function App() {
     </div>
   )
 }
+function GridLines() {
+  return (
+    <div className="grid-container">
+      <svg className="grid" width="400" height="400" xmlns="http://www.w3.org/2000/svg">
+        <defs>
+          <pattern id="smallGrid" width="10" height="10" patternUnits="userSpaceOnUse">
+            <path d="M 0 0 L 0 0 0 10" fill="none" stroke="gray" strokeWidth="0.5" />
+          </pattern>
+          <pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse">
+            <rect width="100" height="100" fill="url(#smallGrid)" />
+            <path d="M 100 0 L 0 0 0 100" fill="none" stroke="SkyBlue" strokeWidth="3" />
+          </pattern>
+        </defs>
+        <rect width="100%" height="100%" fill="url(#grid)" />
+      </svg>
+    </div>
+  )
+}
 
 export function ErrorPage() {
   const error: any = useRouteError();
@@ -349,24 +367,7 @@ export function ItemPage() {
   );
 }
 
-function GridLines() {
-  return (
-    <div className="grid-container">
-      <svg className="grid" width="400" height="400" xmlns="http://www.w3.org/2000/svg">
-        <defs>
-          <pattern id="smallGrid" width="10" height="10" patternUnits="userSpaceOnUse">
-            <path d="M 10 0 L 0 0 0 10" fill="none" stroke="gray" stroke-width="0.5" />
-          </pattern>
-          <pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse">
-            <rect width="100" height="100" fill="url(#smallGrid)" />
-            <path d="M 100 0 L 0 0 0 100" fill="none" stroke="gray" stroke-width="1" />
-          </pattern>
-        </defs>
-        <rect width="100%" height="100%" fill="url(#grid)" />
-      </svg>
-    </div>
-  )
-}
+
 
 export function WallLabelPage() {
   const { item, user, collection } = useLoaderData() as Awaited<ReturnType<typeof loadItem>>;