added styles card

Ignaherrero · Apr 8, 2022 · ddac5f6 · ddac5f6 · vercel · Apr 8, 2022
1 parent 1ef9c16
commit ddac5f6
Showing 1 changed file with 17 additions and 12 deletions.
diff --git a/pages/index.jsx b/pages/index.jsx
@@ -136,16 +136,19 @@ export default function Home() {
       </form>
       {articles.found === statusFetch.notFound && (
         <>
-          <h1 className="text-center">No se encontro el articulo</h1>
-          <h2 className="text-center">Ultimos articulos publicados</h2>
+          <h1 className="text-center">
+            No se encontro el articulo... pero estos son los ultimos articulos
+            publicados
+          </h1>
+          <h2 className="text-center"></h2>
         </>
       )}
       <div className="flex justify-center flex-wrap ">
         {articles?.data &&
           articles.data.map((article) => {
             return (
               <div
-                className="rounded-lg shadow-lg bg-white max-w-sm m-2"
+                className="rounded-lg shadow-lg bg-white max-w-sm m-2 relative"
                 key={article.id}
               >
                 <a href="#!">
@@ -157,28 +160,30 @@ export default function Home() {
                     height={200}
                   />
                 </a>
-                <div className="p-6">
+                <div className="pt-6 pl-6 pr-6 pb-10">
                   <h5 className="text-gray-900 text-xl font-medium mb-2">
                     {article.title}
                   </h5>
                   <p className="text-gray-700 text-base mb-4">
                     {article.categories[0].description}
                   </p>
-                  <Link
-                    href={`/posts/[id]`}
-                    as={`/posts/${article.id}`}
-                    key={article.id}
-                  >
-                    Visitar
-                  </Link>
+                  <div className="absolute bottom-0 left-40">
+                    <Link
+                      href={`/posts/[id]`}
+                      as={`/posts/${article.id}`}
+                      key={article.id}
+                     >
+                       Visitar
+                    </Link>
+                  </div>
                 </div>
               </div>
             );
           })}
       </div>
 
       {articles?.data.length > 0 && (
-        <div className="flex space-x-2 justify-center">
+        <div className="flex space-x-2 justify-center m-6">
           {page > 1 && (
             <button
               type="button"