pequeños cambios en projects + arreglado fit fondo en header banners

CyberAula · Apr 29, 2024 · 18aca07 · 18aca07
1 parent f79e68a
commit 18aca07
Show file tree

Hide file tree

Showing 5 changed files with 91 additions and 41 deletions.
diff --git a/app/research/page.js b/app/research/page.js
@@ -79,8 +79,8 @@ export default function Research() {
       <div className="research">
         <Header route={"/research"} />
         <div className="banner">
-        <h1>Publications</h1>
-      </div>
+          <h1>Publications</h1>
+        </div>
         <main>
           <section className="research">
             <Filters

diff --git a/app/sass/main.scss b/app/sass/main.scss
@@ -110,7 +110,7 @@ $extra-bold: 900;
       font-size: 1.7rem;
       font-weight: $bold;
       font-family: $montserrat-alternates;
-      // @apply text-primary;
+      color: $blue_primary;
 
       padding: 0 12rem 0 0.7rem;
 
@@ -165,14 +165,16 @@ $extra-bold: 900;
 
 .banner {
   margin-top: 60px;
-  height: 100%;
+  height: auto;
   background-image: url("/assets/img/headers/header-one.png");
-  background-color: #282828;
-  background-size: contain;
-  object-fit: cover;
+  background-size:cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  // object-fit: cover;
   display: flex;
   align-items: flex-end;
-  height:160px;
+  height:14rem;
+  width: 100%;
   h1 {
     padding: 0 0 $spacing_sm $spacing_xl;
     color:white;
@@ -612,7 +614,7 @@ main {
       }
 
       .logotype {
-        color: white;
+        color: $blue_primary;
         font-weight: $bold;
         text-decoration: none;
       }

diff --git a/app/sass/partials/_projects.sass b/app/sass/partials/_projects.sass
@@ -0,0 +1,26 @@
+// @import ('./lib/_variables.sass')
+// @import ('./lib/_type.sass')
+    
+.project_cards
+    .filter_options
+        display: flex
+
+        button
+            border-radius: 4px
+            border-color: none
+    .project_card
+        .year_and_cta
+            display: flex
+            .date
+                border: 1px solid black
+                border-radius: 50px
+                padding: .5rem 5 .2rem .5rem
+            .date
+        .project_info
+            .project_title
+                @apply text-black
+                font-size: 1.25rem
+
+
+
+            .project_subtitle
diff --git a/components/projectCard.js b/components/projectCard.js
@@ -21,8 +21,8 @@ export default function projectCards(props) {
     <div className="project_cards">
       <div className="filter_options">
         <button onClick={() => handleCategoryChange("all")}>All</button>
-        <button onClick={() => handleCategoryChange("ind")}>Ind</button>
-        <button onClick={() => handleCategoryChange("REG")}>REG</button>
+        <button onClick={() => handleCategoryChange("ind")}>Projects - individual</button>
+        <button onClick={() => handleCategoryChange("erg")}>Educational Research Group (GIE/ERG)</button>
         <button onClick={() => handleCategoryChange("other")}>Other</button>
       </div>
       {projectCards.map(
@@ -33,7 +33,7 @@ export default function projectCards(props) {
               <a href={route}>details</a>
             </div>
             <div className="project_info">
-              <div className="project_title">{title}</div>
+              <h4 className="project_title">{title}</h4>
               <div className="project_subtitle">{subtitle}</div>
             </div>
             <div className="project_tags">{tags}</div>

diff --git a/constants/projectsCards.js b/constants/projectsCards.js
@@ -1,30 +1,52 @@
 export const myProjectCards = [
-    {	"date": "2023",
-    "route": "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
-    "title": "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
-    "subtitle": "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
-    "tags": "tag",
-    "category": "REG",
-},
-{	"date": "2023",
-"route": "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
-"title": "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
-"subtitle": "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
-"tags": "tag",
-"category": "ind",
-},
-{	"date": "2023",
-"route": "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
-"title": "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
-"subtitle": "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
-"category": "other",
-},
-{	"date": "2023",
-"route": "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
-"title": "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
-"subtitle": "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
-"tags": "tag",
-"category": "ind",
-}
-
-]
+  {
+    date: "2023",
+    route:
+      "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
+    title:
+      "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
+    subtitle: "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
+    tags: "tag",
+    category: "erg",
+  },
+  {
+    date: "2023",
+    route:
+      "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
+    title:
+      "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
+    subtitle: "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
+    tags: "tag",
+    category: "ind",
+  },
+  {
+    date: "2023",
+    route:
+      "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
+    title:
+      "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
+    subtitle: "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
+    tags: "tag",
+    category: "other",
+  },
+  {
+    date: "2023",
+    route:
+      "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
+    title:
+      "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
+    subtitle: "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
+    tags: "tag",
+    category: "other",
+  },
+  {
+    date: "2023",
+    route:
+      "https://innovacioneducativa.upm.es/mooc/informacion-mooc?idmooc=356",
+    title:
+      "Utilización de escape rooms y videojuegos educativos en la Educación Universitaria",
+    subtitle: "E.T.S DE ING. DE SISTEMAS INFORMÁTICOS",
+    tags: "tag",
+    category: "ind",
+  },
+];