fix: dimension math, credits link, [id] overflow

pages/_app.js

@@ -32,12 +32,8 @@ function MyApp({ Component, pageProps }) {
           >
             Paul-Louis
           </Link>{" "}
-          grace aux contenus partagés par les proches de Philippe.
-        </Text>
-        <Text fontSize="sm" >
-          <Link href="/credits" >
-            Crédits
-          </Link>
+          grace aux contenus partagés par les proches de Philippe - {" "}
+          <Link href="/credits">Crédits</Link>
         </Text>
       </Container>
     </ChakraProvider>

pages/credits.js

@@ -21,12 +21,12 @@ export async function getStaticProps() {
     {
       title: "Vercel",
       text: "Pour l'hébergement de ces pages",
-      link: "vercel.com",
+      link: "https://vercel.com",
     },
     {
       title: "Next.JS",
       text: "Utilisé pour construire le site",
-      link: "nextjs.org",
+      link: "https://nextjs.org",
     },
   ];
   return {
@@ -67,6 +67,7 @@ export default function Credits({ credits }) {
             borderWidth="1px"
             borderRadius={"10px"}
           >
+          <Link href={credit.link ? credit.link : "#"}>
             <Text
               color="gray.700"
               fontWeight="semibold"
@@ -75,6 +76,7 @@ export default function Credits({ credits }) {
             >
               {credit.title}
             </Text>
+            </Link>
             <br />
             <Text color="gray.500" fontWeight="semibold" fontSize="sm" m="1rem">
               {credit.text}

pages/photos/[id].js

@@ -42,9 +42,9 @@ export async function getStaticProps({ params }) {
 
   // Fix dimensions if really big picture
   console.log("Pic dims: ", photo.dimensions.width, photo.dimensions.height);
-  if (photo.dimensions.widths > 1000 || photo.dimensions.heigth > 1000) {
+  if (photo.dimensions.width > 1000 || photo.dimensions.heigth > 1000) {
     photo.dimensions.width /= 2;
-    photo.dimensions.height = 2;
+    photo.dimensions.height /= 2;
     console.log("Resized: ", photo.dimensions.width, photo.dimensions.height);
   }
   if (photo.dimensions.width > 1000 || photo.dimensions.heigth > 1000) {
@@ -74,19 +74,17 @@ export default function Photos({ photo, placeholder }) {
 
       <Center>
         <Link href={photo.path}>
-          <Box boxSize={["xs", "sm", "md", "lg"]}>
-            <Image
-              src={photo.path}
-              width={photo.dimensions.width || 480}
-              height={photo.dimensions.height || 480}
-              // objectFit="cover"
-              quality={80}
-              priority
-              placeholder="blur"
-              blurDataURL={placeholder}
-              loading="eager"
-            />
-          </Box>
+          <Image
+            src={photo.path}
+            width={photo.dimensions.width || 480}
+            height={photo.dimensions.height || 480}
+            // objectFit="cover"
+            quality={80}
+            priority
+            placeholder="blur"
+            blurDataURL={placeholder}
+            loading="eager"
+          />
         </Link>
       </Center>
       <NavLinks prev={photo.prev} next={photo.next} />