separation scss

This commit is contained in:
Julie Blanc 2026-01-12 21:19:10 +01:00
parent c5d2926ded
commit c3248a21f9
7 changed files with 278 additions and 275 deletions

View file

@ -20,7 +20,7 @@ body {
main{
min-height: calc(100vh - var(--header-h));
margin-top: var(--header-h);
// margin-top: var(--header-h);
/* padding: var(--padding-body); */
}

View file

@ -0,0 +1,74 @@
.highlight-block{
background-color: var(--color);
border: 1px solid var(--color-txt-light);
border-radius: var(--radius-small);
padding: calc(var(--padding-inner)*1.5) var(--padding-inner);
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
gap: var(--unit);
figure{
width: 100%;
max-width: 160px;
aspect-ratio: 4/5;
border: 1px solid var(--color-medium);
border-radius: var(--radius-small);
overflow: hidden;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
.label{
font-weight: 600;
margin-bottom: calc(var(--unit)*0.5);
/* text-decoration: 1px underline;
text-underline-offset: 3px; */
color: var(--color);
display: inline-flex;
align-items: center;
background-color: var(--color-light);
height: var(--unit);
padding: 0px 1ch;
border-radius: var(--radius-btn);
}
.title{
font-family: var(--font-title);
font-size: 1.4rem;
font-weight: normal;
margin-top: 0.5em;
margin-bottom: 0.25em;
color: var(--color-light);
}
.details{
margin-bottom: calc(var(--unit)*0.75);
// font-size: 0.8rem;
color: var(--color-light);
font-weight: 500;
}
.content{
position: relative;
}
.see-more{
position: absolute;
bottom: 0;
font-size: var(--fs-small);
--hover-bg: var(--color);
}
}

View file

@ -64,80 +64,6 @@
}
}
.highlight-block{
background-color: var(--color);
border: 1px solid var(--color-txt-light);
border-radius: var(--radius-small);
padding: calc(var(--padding-inner)*1.5) var(--padding-inner);
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
gap: var(--unit);
figure{
width: 100%;
max-width: 160px;
aspect-ratio: 4/5;
border: 1px solid var(--color-medium);
border-radius: var(--radius-small);
overflow: hidden;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
.label{
font-weight: 600;
margin-bottom: calc(var(--unit)*0.5);
/* text-decoration: 1px underline;
text-underline-offset: 3px; */
color: var(--color);
display: inline-flex;
align-items: center;
background-color: var(--color-light);
height: var(--unit);
padding: 0px 1ch;
border-radius: var(--radius-btn);
}
.title{
font-family: var(--font-title);
font-size: 1.4rem;
font-weight: normal;
margin-top: 0.5em;
margin-bottom: 0.25em;
color: var(--color-light);
}
.details{
margin-bottom: calc(var(--unit)*0.75);
// font-size: 0.8rem;
color: var(--color-light);
font-weight: 500;
}
.content{
position: relative;
}
.see-more{
position: absolute;
bottom: 0;
font-size: var(--fs-small);
--hover-bg: var(--color);
}
}
.home--section-tool .section--inner{
@ -166,7 +92,7 @@
#home__hero{
margin-bottom: 0;
padding-bottom: calc(var(--unit)*1.5)!important;
.section--inner{
display: block;
text-align: center;
@ -299,73 +225,3 @@
}
}
.container-logos{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 40px 60px;
}
.container-logos .logo{
width: 200px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.container-logos .logo > * {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
.container-logos .logo img,
.container-logos .logo svg {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
#logo-inria{
width: 150px;
}
#logo-cnrs{
width: 90px;
height: 80px;
}
#logo-sorbonne{
height: 65px;
width: 160px;
}
#logo-saclay{
width: 160px;
transform: translateY(-10px);
}
#logo-rennes{
width: 81px;
height: 90px;
}
#logo-plantagroeco{
width: 220px;
}
#logo-SBF{
width: 146px;
height: 120px;
}
#logo-upec{
width: 161px;
height: 70px;
}
#logo-paris{
width: 80px;
height: 70px;
}

View file

@ -0,0 +1,70 @@
.container-logos{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 40px 60px;
}
.container-logos .logo{
width: 200px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.container-logos .logo > * {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
.container-logos .logo img,
.container-logos .logo svg {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
#logo-inria{
width: 150px;
}
#logo-cnrs{
width: 90px;
height: 80px;
}
#logo-sorbonne{
height: 65px;
width: 160px;
}
#logo-saclay{
width: 160px;
transform: translateY(-10px);
}
#logo-rennes{
width: 81px;
height: 90px;
}
#logo-plantagroeco{
width: 220px;
}
#logo-SBF{
width: 146px;
height: 120px;
}
#logo-upec{
width: 161px;
height: 70px;
}
#logo-paris{
width: 80px;
height: 70px;
}