pages: Sync changes

pages/index.js

@@ -37,13 +37,8 @@ export default function Home({ data, placeholders }) {
         <link rel="icon" href="/favicon.ico" />
         <Box overflow="hidden" bg="gray.100" minH="100vh">
           <Container>
-            <Image
-              src="/img/signal-2021-06-09-200337_001.jpeg"
-              alt="me"
-              width="32"
-              height="32"
-            />
             <Text
+              as="h1"
               color="gray.700"
               fontWeight="semibold"
               mb="1rem"
@@ -54,11 +49,11 @@ export default function Home({ data, placeholders }) {
               Philippe Bureau - Galerie Photo
             </Text>
           </Container>
-          <Wrap px="1rem" spacing={"4px"} justify="center">
+          <Wrap px="1rem" spacing={"10px"} justify="center">
             {photos.map((photo) => (
               <WrapItem
                 key={"wrap-" + photo.id}
-                boxShadow="dark-lg"
+                boxShadow="lg"
                 rounded="10px"
                 overflow="hidden"
                 m={3}
@@ -67,13 +62,6 @@ export default function Home({ data, placeholders }) {
                 _hover={{ boxShadow: "dark-lg", rounded: "20px" }}
               >
                 <Link href={`/photos/${photo.id}`}>
-                  {/*<img
-                  key={"img-" + path}
-                  src={path}
-                  height="200px"
-                  width="80px"
-                  color="gray.700"
-                />*/}
                   <Image
                     key={photo.path}
                     src={photo.path}
@@ -81,21 +69,10 @@ export default function Home({ data, placeholders }) {
                     height={240}
                     objectFit="cover"
                     quality={20}
-                    placeholder="blur"
+                    // placeholder="blur"
                     priority
-                    blurDataURL={`${placeholders[photo.id]}`}
+                    // blurDataURL={`${placeholders[photo.id]}`}
                   />
-
-                  {/*<Image
-                      key={"img-" + photo.path}
-                      src={photo.path}
-                      height="240px"
-                      width="240px"
-                      objectFit="cover"
-                      placeholder="img/Diaporama/f5b1d804-3860-4073-b280-69e54985c66f.jpg"
-                      color="gray.700"
-                      quality={50}
-                    />*/}
                 </Link>
               </WrapItem>
             ))}

pages/photos/[id].js

@@ -49,25 +49,9 @@ export async function getStaticProps({ params }) {
   if (photo.dimensions.width > 1000 || photo.dimensions.heigth > 1000) {
     photo.dimensions.width /= 2;
     photo.dimensions.height /= 2;
-    console.log("Resized: ", photo.dimensions.width, photo.dimensions.height);
-
-    // 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) {
-      photo.dimensions.width /= 2;
-      photo.dimensions.height = 2;
-      console.log("Resized:", photo.dimensions.width, photo.dimensions.height);
-    }
-    if (photo.dimensions.width > 1000 || photo.dimensions.heigth > 1000) {
-      photo.dimensions.width /= 2;
-      photo.dimensions.height /= 2;
-      console.log(
-        "Resized 2:",
-        photo.dimensions.width,
-        photo.dimensions.height
-      );
-    }
+    console.log("Resized 2:", photo.dimensions.width, photo.dimensions.height);
   }
+  // console.log("P/N:", photo.prev, photo.next);
   return {
     props: {
       photo,
@@ -111,21 +95,21 @@ export default function Photos({ photo, placeholder }) {
               as="a"
               borderRadius="full"
               colorScheme="gray"
-              fontSize="xl"
-              size="lg"
+              fontSize={["sm", "md", "lg", "lg"]}
+              size={["sm", "md", "lg", "lg"]}
               cursor="pointer"
               m="15px"
             >
               ⟸ Précédente
             </Button>
           </Link>
-          <Link href={"/photos/" + photo.next} m="15px">
+          <Link href={"/photos/" + photo.prev}>
             <Button
               as="a"
               borderRadius="full"
               colorScheme="gray"
-              fontSize="xl"
-              size="lg"
+              fontSize={["sm", "md", "lg", "lg"]}
+              size={["sm", "md", "lg", "lg"]}
               cursor="pointer"
               m="15px"
             >