From a60cb34c225731ba4071e6c5b74f6240f14e3d51 Mon Sep 17 00:00:00 2001
From: Max Bo <mjbo@canva.com>
Date: Tue, 21 May 2024 00:25:35 +1000
Subject: [PATCH] Footer

---
 src/App.tsx   |  6 ++++--
 src/index.css | 10 +++++++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 23ae979..b6977f9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,7 +2,8 @@ import './App.css'
 import {
   useLoaderData,
   useRouteError,
-  Outlet
+  Outlet,
+  Link
 } from "react-router-dom";
 
 export function App() {
@@ -75,6 +76,7 @@ export function DollPage() {
 
   return (
     <article className='doll-page'>
+      <Link to="/">&larr; Back </Link>
       <h2 className='margin-bottom monospace'>{doll.name}</h2>
       <div className='flex-wrap-row'>
         <Model doll={doll} big />
@@ -100,7 +102,7 @@ function Model(props: { doll: Doll, big: boolean }) {
   return (
     // @ts-ignore
     <model-viewer 
-      style={ props.big ? { height: '30rem' } : {} }
+      style={ props.big ? { height: '30rem', margin: 'auto' } : {} }
       alt={props.doll.alt}
       src={props.doll.model} 
       environment-image="/environments/moon_1k.hdr" 
diff --git a/src/index.css b/src/index.css
index d30d541..21b58b1 100644
--- a/src/index.css
+++ b/src/index.css
@@ -7,7 +7,7 @@ body {
   /** set a nicer serif font */
   font-family: 'Lora', serif;
   /** set a reasonable max-width */
-  max-width: min(80vw, 80ch);
+  max-width: min(80vw, 100ch);
   margin: 5vw auto;
   /** set a nice light tan background color */
   background-color: #fffff8;
@@ -21,6 +21,10 @@ body {
   margin-bottom: 1rem;
 }
 
+.padding-bottom {
+  margin-bottom: 1rem;
+}
+
 .card dl {
   font-size: 0.7rem;
 }
@@ -41,10 +45,10 @@ dl > dt {
 }
 
 dl > dd {
-  max-width: 30ch;
+  max-width: 40ch;
   /** Description details should be monospace */
   font-family: 'Inconsolata', monospace;
-  font-size: 1.2em;
+  font-size: 1.15em;
 }
 
 .card-grid {