Cambios en home, estructura json team

ging · Jun 20, 2024 · 428745c · 428745c
1 parent e6de19f
commit 428745c
Show file tree

Hide file tree

Showing 13 changed files with 131 additions and 264 deletions.
diff --git a/app/globals.sass b/app/globals.sass
@@ -30,16 +30,6 @@
 
 
 
-body 
-  /* color: rgb(var(--foreground-rgb)) */
-  @apply text-primary
-  // background: linear-gradient(
-  //     to bottom,
-  //     transparent,
-  //     rgb(var(--background-end-rgb))
-  //   )
-  //   rgb(var(--background-start-rgb))
-  margin-bottom: 0rem
 
 @layer utilities 
   .text-balance 

diff --git a/app/page.js b/app/page.js
@@ -28,42 +28,32 @@ export default function Home() {
     <div className="App">
       <div className={"home_page page_" + currentLang}>
         <Header route={"/"} />
-        <div className="parallax__layer parallax__layer--base">
+        <div className="parallax__layer--base">
           <main>
             <section className="home">
-              <div className="head block sm:flex sm:flew-row items-center mt-4 sm:mt-6 md:mt-8 lg-mt-10 2xl:mt-14">
+              <div className="head block sm:flex sm:flew-row items-center py-8 sm:py-12 md:py-20 lg:py-24 2xl:py-32">
                 <div className="group_description flex flex-col gap-4 sm:justify-center md:gap-8 sm:items-center mx-8 sm:mx-8 md:ml-12 lg:ml-16 xl:ml-20 2xl:ml-24 sm:w-2/5">
                   <img
                     className="logo_home mt-4 sm:mt-0 self-start"
                     src="/assets/img/iso_logo.svg"
                   />
-                  <h2 className="text-white self-start">
-                    {t("front.title")}
-
-                  </h2>
+                  <h2 className="text-white self-start">{t("front.title")}</h2>
                   <button className="action_button self-start">
                     <Link rel="noopener noreferrer" target="_blank" href="#">
                       <span>{t("front.action-button")}</span>
                       <FontAwesomeIcon icon={faArrowRight} />
                     </Link>
                   </button>
                 </div>
-                  <div
-                    className="banner_f4d_img sm:mt-0 sm:w-3/5"
-                  />
+                <div className="banner_f4d_img sm:mt-0 sm:w-3/5" />
               </div>
 
-              <div className="body lg:mx-36 md:mx-14 sm:mx-8 mx-4 lg:my-12 md:my-8 sm:my-4 my-4 xl:mx-44 2xl:mx-60">
-                <section className="award_section">
-                  <FontAwesomeIcon className="award_icon" icon={faTrophy} />
-                  <div className="award_title">
-                    <div>
-                      <h3> {t("front.awardH2")} </h3>
-                      <h5>{t("front.awardTitle")}</h5>
-                    </div>
-                    <div className="award_card_text">
-                      <small>{t("front.awardBody")}</small>
-                    </div>
+              <div className="body">
+                <section className="project_description">
+                  <div className="xl_margin">
+                    <h2>{t("front.projectTitle")} </h2>
+                    <h5>{t("front.projectSubtitle")} </h5>
+                    <p>{t("front.projectDescription")} </p>
                   </div>
                 </section>
 

diff --git a/app/projects/page.js → app/project/page.js b/app/projects/page.js → app/project/page.js
diff --git a/app/sass/lib/_structure.sass b/app/sass/lib/_structure.sass
@@ -0,0 +1,4 @@
+.standard_margin
+    @apply my-4 mx-4 sm:my-4 sm:mx-8 md:my-8 md:mx-14 lg:my-12 lg:mx-36 xl:mx-44 2xl:mx-60
+.xl_margin
+    @apply my-8 mx-8 sm:my-12 sm:mx-16 md:my-16 md:mx-24 lg:my-20 lg:mx-44 xl:mx-60 2xl:mx-80
diff --git a/app/sass/main.scss b/app/sass/main.scss
@@ -7,6 +7,7 @@
 @import "lib/_type.sass";
 @import "lib/_variables.sass";
 @import "lib/_mixins.sass";
+@import "lib/_structure.sass";
 
 // components
 @import "components/_buttons.sass";
@@ -53,10 +54,6 @@ TYPOGRAPHY
 @import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700");
 @import url("https://fonts.googleapis.com/css?family=Lora:400,400i,700,700i");
 
-
-// import montserrat
-// import new sans serif;
-
 .App {
   background-color: $background
 }
@@ -173,7 +170,6 @@ button {
 
 .home {
   //margin: 8rem 4rem 0 4rem;
-
 
   .head {
     display: flex;
@@ -533,7 +529,6 @@ RESPONSIVE
 //MÓVIL MEDIA QUERY
 @media (max-width: 600px) {
 
-
   // .parallax__layer {
   //   position: absolute;
   //   top: 75px;
@@ -543,38 +538,7 @@ RESPONSIVE
   //   width:100%
   // }
 
-  .home {
-    //margin: 0.4rem;
-    padding: 1rem 0 0 0;
-
-
-    .head {
-      padding: 0rem 0rem 2rem 0rem;
-      display: flex;
-      flex-flow: column;
-      align-items: center;
-    }
-
-    .body {
-      .carousel {
-        h3 {
-          font-size: 1.5rem;
-        }
-
-        p {
-          font-size: 1rem;
-        }
-      }
 
-      .latest_publications {
-        padding: 0;
-
-        p {
-          padding: 0;
-        }
-      }
-    }
-  }
 
   .projects {
     main {

diff --git a/app/sass/partials/_home.sass b/app/sass/partials/_home.sass
@@ -3,15 +3,37 @@
 
 @media (min-width: 150px)
 
+
+
     .home
+        .head
+            display: flex
+            justify-content: space-between
+            height: 50vh
         h3
             @apply text-ca_blue-700
             margin-bottom: 2rem
 
         p
             margin-bottom: 2rem
             width:80%
-            @apply text-gray-800
+    .project_description
+        background-image: url("/assets/img/section_description_home.png")
+        background-size: cover
+        background-position: center
+        background-repeat: no-repeat
+        text-align: left
+        display: flex
+        justify-content: center
+        div
+            display: flex
+            flex-direction: column
+            gap: 2rem
+            align-items: center
+        h5
+            text-align: center
+            max-width: 70vw
+
     .group_description 
         z-index:100
         .logo_home
@@ -95,14 +117,11 @@
 
 
 @media (min-width: 640px)
-    .award_section
-        width:85%
-        padding: 1.5rem 2rem 1rem 2rem
-        flex-direction: column
-        .award_icon
-            min-width: 4rem
-            height: 4rem
-            padding:  1.5rem
+    .home
+        .head
+            display: flex
+            justify-content: space-between
+            height: 60vh
     .group_description 
         width: 100vw
         .logo_home
@@ -124,30 +143,11 @@
         //background-size: cover
         background-position: 100% 0
 @media (min-width: 900px)
-    .award_section
-        flex-direction: row
-        width:70%
-        text-align: left
-        // gap: 1.2rem
-        align-self: flex-start
-        .award_title
-            display: flex
-            flex-direction: column
-            align-self: flex-start
-            justify-content: flex-start
-            div
-                flex-direction: column
-                //margin-left: 0.8rem
-                align-items: flex-start
-                align-self: flex-start
-        .award_icon
+    .home
+        .head
             display: flex
-            border-radius: 70px
-            min-width: 6rem
-            height: 6rem
-            padding:  1.5rem
-            align-self: flex-start
-        small
+            justify-content: space-between
+            height: 100vh
 
     .group_description 
         .logo_home

diff --git a/constants/langs/en.js b/constants/langs/en.js
@@ -12,9 +12,9 @@ export const en = {
     "front": {
         "title": "Future Networks for Datacenters and Telcos",
         "action-button": "About the project",
-        "awardH2":"EIG AWARDED IN 2017",
-        "awardTitle": "Award to the educational innovation groups",
-        "awardBody": "Award granted to the CyberAula group, coordinated by professor Juan Quemada Vives (H.T.S. of Telecommunication engineering) ",
+        "projectTitle": "Short description of the project",
+        "projectSubtitle": "FuN4DaTe aims at designing a cost-effective energy-efficient network architecture",
+        "projectDescription": "FuN4DaTe aims at designing a cost-effective energy-efficient network architecture that approaches the envisioned by the ITU FG-NET2030 network and the Hyperscale cloud providers to upgrade telco networks by boosting bandwidth, latency, security, manynets while incorporating AI/ML into the network operations, on attempts to deal with forthcoming challenging services like holographic-type communications, tactile Internet for remote operations, intelligent operations networks, network and computing convergence, digital twins, space-terrestrial integrated network and industrial IoT with cloudification.",
         "latestPublicationsTitle": "Latest publications",
         "latestPublicationsButton": "See all publications",
         "linesOfActTitle": "Lines of action",
@@ -70,13 +70,12 @@ export const en = {
     "team": {
         "title": "Team",
             "professorCards":{
-                "roles":{
-                    "1":"Professor",
-                    "2":"Associate professor",
-                    "3":"Assistant professor",
-                    "4":"Researcher",
-                    "5":"Intern",
-                },
+               "roles":{
+                "1":"IP1",
+                "2":"IP2",
+                "3":"PhD candidate",
+                "4":"Full-Time Technician",
+            },
                 "positions":{
                     "1":"Coordinator",
                 },

diff --git a/constants/langs/es.js b/constants/langs/es.js
@@ -11,11 +11,10 @@ export const es = {
     },
     "front": {
         "title": "Redes Futuras para Centros de Datos y Empresas de Telecomunicaciones",
-
         "action-button": "Sobre el proyecto",
-        "awardH2":"GIE PREMIADO EN 2017",
-        "awardTitle": "Premio a los grupos de innovación educativa ",
-        "awardBody": "Premio otorgado al GIE CyberAula, coordinado por el profesor Juan Quemada Vives (E.T.S. DE INGENIEROS DETELECOMUNICACIÓN) ",
+        "projectTitle": "Short description of the project",
+        "projectSubtitle": "FuN4DaTe aims at designing a cost-effective energy-efficient network architecture",
+        "projectDescription": "FuN4DaTe aims at designing a cost-effective energy-efficient network architecture that approaches the envisioned by the ITU FG-NET2030 network and the Hyperscale cloud providers to upgrade telco networks by boosting bandwidth, latency, security, manynets while incorporating AI/ML into the network operations, on attempts to deal with forthcoming challenging services like holographic-type communications, tactile Internet for remote operations, intelligent operations networks, network and computing convergence, digital twins, space-terrestrial integrated network and industrial IoT with cloudification.",
         "latestPublicationsTitle": "Últimas publicaciones",
         "latestPublicationsButton": "Ver todas las publicaciones",
         "linesOfActTitle": "Líneas de actuación",
@@ -72,11 +71,10 @@ export const es = {
         "title": "Equipo",
         "professorCards":{
             "roles":{
-                "1":"Profesor",
-                "2":"Profesor asociado",
-                "3":"Profesor auxiliar",
-                "4":"Investigador/a",
-                "5":"Becario/a",
+                "1":"IP1",
+                "2":"IP2",
+                "3":"Candidato de doctorado",
+                "4":"Técnico a tiempo completo",
             },
             "positions":{
                 "1":"Coordinador",