Skip to content

Commit

Permalink
maquetacion publicaciones
Browse files Browse the repository at this point in the history
  • Loading branch information
@sleepndraw
sleepndraw committed Jun 19, 2024
1 parent e6de19f commit a2c88ef
Show file tree
Hide file tree
Showing 8 changed files with 137 additions and 116 deletions.
49 changes: 24 additions & 25 deletions app/research/page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,20 +78,20 @@ export default function Research() {
return (
<div className={"research page_" + currentLang}>
<Header route={"/research"} />
<div
className="banner px-4 sm:px-8 md:px-14 md:py-2 lg:px-24 lg:py-4 xl:px-28 xl:py-4 2xl:px-32 2xl:py-6"
id="banner-publications"
>
<h1>{t("publications.title")}</h1>
<p>
Este apartado es una recopilación de las publicaciones del equipo de
la UPM y de la UC3M. Las publicaciones de la UPM están centrados en el
tema de computación bla bla bla etc y los de la UC3M se centran en
sistemas de redes de no se cuantitos.
</p>
</div>

<main>
<div
className="banner px-4 sm:px-8 md:px-14 md:py-2 lg:px-24 lg:py-4 xl:px-28 xl:py-4 2xl:px-32 2xl:py-6"
id="banner-publications"
>
<h1>{t("publications.title")}</h1>
<p>
Este apartado es una recopilación de las publicaciones del equipo de
la UPM y de la UC3M. Las publicaciones de la UPM están centrados en
el tema de computación bla bla bla etc y los de la UC3M se centran
en sistemas de redes de no se cuantitos.
</p>
</div>
<section className="research 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">
<Filters
search={search}
Expand Down Expand Up @@ -125,22 +125,21 @@ export default function Research() {
</p>
</div>
<div className="button_container">
{doi ? (
<button className="paper_link text-nowrap">
<Link
rel="noopener noreferrer"
target="_blank"
href={doi}
>
<span>{t("publications.button")}</span>
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</button>
) : null}
{doi ? (
<button className="paper_link text-nowrap">
<Link
rel="noopener noreferrer"
target="_blank"
href={doi}
>
<span>{t("publications.button")}</span>
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</button>
) : null}
</div>
</div>
</div>

</div>
);
})}
Expand Down
34 changes: 21 additions & 13 deletions app/sass/components/_buttons.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,18 +17,26 @@
svg
align-self: center
margin-right: 0.6rem


@mixin link-button
@include button
border: none
@apply text-gray-100
&:hover
color: white
transition: 200ms ease-in-out
@apply text-ffdGreen-300
text-decoration: underline
text-decoration-thickness: 1px
@mixin button-load-more
@include button
border-radius: 24px
font-size: $button
padding: 0.5rem 1.2rem 0.7rem 1.4rem
color: $ca-blue-600
background: $ca-blue-200
background: transparent
@apply text-gray-100
cursor: pointer
&:hover
background: $ca-blue-300
color: $ca-blue-700
@apply bg-gray-100 text-black
font-size: $xl-text
transition: 200ms ease-in-out

@mixin border-button-white
Expand Down Expand Up @@ -57,16 +65,16 @@
background-color: $ca-blue-600

@mixin button-load-more
border-radius: 24px
border: 1px solid $gray-100
padding: 0.5rem 1.2rem 0.7rem 1.4rem
color: $ca-blue-900
background: $ca-blue-200

@apply bg-transparent text-gray-100 border border-gray-100
cursor: pointer
&:hover
background: $ca-blue-300
color: #0e1131
background: $ca-blue-300
@apply bg-gray-100 text-black border border-gray-100

transition: 200ms ease-in-out


@mixin invisible-button
@include button
Expand Down
51 changes: 51 additions & 0 deletions app/sass/components/_inputs.sass
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
@mixin select
select,
input
padding: 0.5rem 1rem 0.5rem 0.5rem
margin-right: 0.3rem
width: 100%
height: 3.2rem
font-family: $main_font
@apply text-gray-200 bg-gray-800 border border-gray-400
&:focus
@apply text-gray-500
// border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
&:focus-within
@apply text-gray-500
// border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
outline: none
&:focus-visible
outline: none
&:active
outline: none
select
//width: 20.5rem
@apply text-gray-200
&:focus
// border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.2rem $ca-blue-300)
&:focus-within
// border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
outline: none
&:focus-visible
outline: none
&:active
outline: none
option
@apply text-gray-400
padding: 0 0.3rem 3rem 0.3rem
// border: 0px
// border-radius: 4px
#year
width: 8rem
#filter_year
width: auto





1 change: 1 addition & 0 deletions app/sass/main.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
// components
@import "components/_buttons.sass";
@import "components/_tags.sass";
@import "components/_inputs.sass";

// partials
@import "partials/_courses.sass";
Expand Down
86 changes: 24 additions & 62 deletions app/sass/partials/_publications.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@
@media (min-width: 150px)
.research
display: flex
flex-direction: column
flex: 1

.filters
justify-content: space-between
.filter
Expand All @@ -23,6 +27,7 @@
min-height: 3rem
align-content: center
margin-right: 1rem
@apply mb-8

//width: 13rem
justify-content: flex-end
Expand All @@ -32,7 +37,8 @@

section
gap: $spacing_md

display: flex
flex-direction: column
.load_more
padding-top: $spacing_sm
padding-bottom: 0
Expand All @@ -50,6 +56,7 @@
display: flex
flex-wrap: wrap
padding-bottom: $spacing_lg
margin-top: $spacing_lg
border-bottom: solid 1px $ca-blue-200
justify-content: left
.filter
Expand All @@ -66,57 +73,11 @@
@apply text-gray-400
font-weight: $light
border-radius: 0
select,
input
padding: 0.5rem 1rem 0.5rem 0.5rem
margin-right: 0.3rem
width: 100%
height: 3.2rem




font-family: $main_font
@apply text-gray-200 bg-gray-800 border border-gray-400
&:focus
@apply text-gray-500
border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
&:focus-within
@apply text-gray-500
border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
outline: none
&:focus-visible
outline: none
select
//width: 20.5rem
@apply text-gray-200 bg-gray-800 border border-gray-400



&:focus
border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.2rem $ca-blue-300)
&:focus-within
border: $ffd-blue-500 solid 1px
// filter: drop-shadow(0 0 0.5rem $ca-blue-300)
outline: none
&:focus-visible
outline: none
option
@apply text-gray-400
padding: 0 0.3rem 3rem 0.3rem
// border: 0px
// border-radius: 4px
#year
width: 8rem
@include select

#filter_year
width: auto

.papers
// display: flex
display: flex

padding-left: 0px
.paper
Expand Down Expand Up @@ -164,18 +125,19 @@
font-weight: 400

.paper_link
@include icon-button-left
@include button
display: flex
flex-direction: row
//gap: $spacing_xsm
align-content: center
justify-content: left
margin-top: 0.6rem
a
@include big-border-button-blue
display: flex
align-content: center
@include icon-button-right
@include link-button
// @include button
// display: flex
// flex-direction: row
// //gap: $spacing_xsm
// align-content: center
// justify-content: left
// margin-top: 0.6rem
// a
// display: flex
// align-content: center
//margin-top: $spacing_sm

Expand Down
26 changes: 13 additions & 13 deletions app/sass/partials/_recentPublications.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,16 +77,16 @@
// este código está duplicado en publications.
//habría que ver si se puede convertir en otro mixin
.paper_link
@include icon-button-left
@include button
display: flex
flex-direction: row
//gap: $spacing_xsm
align-content: center
justify-content: left
margin-top: 0.6rem
a
@include big-border-button-blue
display: flex
align-content: center
//margin-top: $spacing_sm
// @include icon-button-left
// @include button
// display: flex
// flex-direction: row
// //gap: $spacing_xsm
// align-content: center
// justify-content: left
// margin-top: 0.6rem
// a
// @include big-border-button-blue
// display: flex
// align-content: center
// //margin-top: $spacing_sm
4 changes: 2 additions & 2 deletions components/RecentPublications.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { mypublications } from "../constants/publications";
import Masonry, { ResponsiveMasonry } from "react-responsive-masonry";
import { useTranslation } from "react-i18next";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faArrowRight } from "@fortawesome/free-solid-svg-icons";
import { faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";

export default function RecentPublications(props) {
const [papers, setPapers] = useState(mypublications);
Expand Down Expand Up @@ -50,7 +50,7 @@ export default function RecentPublications(props) {
href={doi}
>
<span>{t("publications.button")}</span>
<FontAwesomeIcon icon={faArrowRight} />
<FontAwesomeIcon icon={faArrowUpRightFromSquare} />
</Link>
</button>
) : null}
Expand Down
2 changes: 1 addition & 1 deletion components/ResearchFilter.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ export default function Filters (props) {
{years.map(y=><option key={y} value={y}>{y}</option>)}
</select>
</div>
{props.results === undefined ? null:<div className='research_results'><div> <p> {t('publications.filter.text')}<b> {props.results} </b> </p></div></div>}
{props.results === undefined ? null:<div className='research_results'><div> <p className='text-gray-400'> {t('publications.filter.text')}<b> {props.results} </b> </p></div></div>}
</div>)

}

0 comments on commit a2c88ef

Please sign in to comment.