maquetacion recent publications

app/page.js

@@ -71,7 +71,7 @@ export default function Home() {
 							</div> */}
                 <div className="latest_publications">
                   <h3>Latest publications</h3>
-                  <RecentPublications />
+                  <div className='recent_pubs_container'><RecentPublications /></div>
                   <a href="/#/research" rel="noopener noreferrer">
                     <div className="more">more...</div>
                   </a>

app/sass/main.scss

@@ -482,10 +482,11 @@ main {
     }
 
     .latest_publications {
-      width: 30%;
+      // width: 30%;
       object-fit: cover;
       padding: 10px;
       margin-bottom: $spacing_lg;
+      display: flex;
 
       h3 {
         padding-top: 4%;

app/sass/partials/_publications.sass

@@ -86,8 +86,8 @@
         .paper_main 
             display: flex
             flex-direction: column
-            justify-content: space-between
-            gap: 48px
+            //justify-content: space-between
+            // gap: 48px
             .paper_date
                 display: flex
                 h5

app/sass/partials/_recentPublications.sass

@@ -1,11 +1,31 @@
 @import '../lib/_variables.sass'
-    
+
 .article
     display: flex
-    .article_border
+    margin: $spacing_md
+    @apply bg-gray-50
+
+    .article_stroke.color-orange
+        border: 4px solid $ca-or-300
+
+    .article_stroke.color-yellow
+        border: 4px solid $ca-or-100
+
+    .article_stroke.color-purple
+        border: 4px solid $ca-blue-400
+
     .article_content
         display: flex
         flex-direction: column
+        padding-left: $spacing_sm
+        padding-bottom: $spacing_sm
+        padding-right: $spacing_md
+        padding-top: $spacing_sm
+
         .article_title
             font-weight: $bold
-
+            @apply text-black
+
+        .article_author
+            font-weight: $regular
+            font-size: 12px

components/RecentPublications.js

@@ -10,17 +10,17 @@ export default function RecentPublications(props) {
   }, []);
 
   return (
-    <div className="_pubications _recent_publications">
+    <div className="_publications _recent_publications">
       {papers
         .filter((paper) => {
           return paper.type === "article-journal";
         })
         .filter((i, index) => index < 3)
-        .map(({ doi,title,author,date, content }) => {
+        .map(({ doi,title,author,date,stroke, content }) => {
           return (
             <a key={doi} href={doi} target="_blank" rel="noopener noreferrer">
               <div className="article">
-                <div className="article_border"></div>
+                <div className={`article_stroke ${stroke}`} ></div>
                 <div className="article_content">
                 <div className="article_top"><span>{date}</span></div>
                 <h5 className="article_title">{title}</h5>