up Footer & News + TailwindCSS (v0.11.0)

CHANGELOG.md

@@ -7,6 +7,18 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.11.0] - 2024-01-23
+
+### Fix
+
+-   Footer responsive mode
+-   News template Previous / Next
+
+### Changed
+
+-   TailwindCSS 3.4
+-   tailwind-merge 2.2
+
 ## [0.10.1] - 2024-01-09
 
 ### Fix

gatsby-node.js

@@ -89,8 +89,8 @@ exports.createPages = async function ({ actions, graphql }) {
             component: require.resolve(`./src/templates/news.tsx`),
             context: {
                 id: news.id,
-                prev: data.directus.news.at(i - 1),
-                next: data.directus.news.at(i + 1),
+                prev: data.directus.news.at(i + 1),
+                next: i > 0 ? data.directus.news.at(i - 1) : null,
             },
         })
     })

package.json

 {
     "name": "@onegeo-suite/gatsby-theme-onegeo",
-    "version": "0.10.1",
+    "version": "0.11.0",
     "main": "index.js",
     "types": "index.d.ts",
     "author": "NEOGEO",
@@ -12,7 +12,7 @@
     },
     "peerDependencies": {
         "gatsby": "^4.0.0",
-        "tailwindcss": "^3.0.0",
+        "tailwindcss": "^3.4.0",
         "typescript": "^4.0.0"
     },
     "dependencies": {
@@ -25,7 +25,7 @@
         "react-cookie-consent": "^8.0.1",
         "react-leaflet": "^3.2.5",
         "swiper": "^8.4.5",
-        "tailwind-merge": "^1.10.0"
+        "tailwind-merge": "^2.2.0"
     },
     "devDependencies": {
         "dotenv": "^10.0.0"

src/components/Footer.tsx

@@ -43,14 +43,17 @@ const Footer = (props: Props) => {
     return (
         <footer
             className={twMerge(
-                "footer bg-base-300 absolute bottom-0 h-24 w-full items-center px-4",
+                "footer bg-base-300 absolute bottom-0 min-h-24 w-full items-center gap-y-0 px-4 ",
                 className,
                 oClass.main
             )}
             data-theme={theme}
         >
             <div
-                className={twMerge("grid-flow-col items-center", oClass.start)}
+                className={twMerge(
+                    "grid-flow-col justify-self-center lg:justify-self-start",
+                    oClass.start
+                )}
             >
                 <Logo title="" image={logo} url="/" />
             </div>
@@ -63,7 +66,7 @@ const Footer = (props: Props) => {
             </div>
             <div
                 className={twMerge(
-                    "grid-flow-col gap-4 md:place-self-center md:justify-self-end",
+                    "grid-flow-col gap-4 justify-self-center lg:justify-self-end",
                     oClass.end
                 )}
             >

src/templates/news.tsx

@@ -113,19 +113,21 @@ const News = ({ pageContext, data, location }: PageProps<Idata>) => {
                 </div>
                 <div className="mb-24 flex justify-center">
                     <div className="flex w-5/6 space-x-4">
-                        <Card
-                            url={"/news/" + pageContext.prev?.slug}
-                            name="Précédent"
-                            description={pageContext.prev?.title}
-                            layout="left"
-                            size="xs"
-                            image={
-                                pageContext.prev?.image != null
-                                    ? pageContext.prev?.image?.imageFile
-                                          ?.publicURL
-                                    : "mock"
-                            }
-                        />
+                        {pageContext.prev ? (
+                            <Card
+                                url={"/news/" + pageContext.prev?.slug}
+                                name="Précédent"
+                                description={pageContext.prev?.title}
+                                layout="left"
+                                size="xs"
+                                image={
+                                    pageContext.prev?.image != null
+                                        ? pageContext.prev?.image?.imageFile
+                                              ?.publicURL
+                                        : "mock"
+                                }
+                            />
+                        ) : null}
                         {pageContext.next ? (
                             <Card
                                 url={"/news/" + pageContext.next?.slug}