responsive node site

This commit is contained in:
2025-10-14 15:10:07 +02:00
parent bcb6fbabbe
commit 4a81d84919
2 changed files with 151 additions and 2 deletions
@@ -11,6 +11,11 @@
display: grid;
grid-template-columns: repeat(8 1fr);
grid-template-rows: repeat(3 auto);
@media(max-width:810px){
width: 100vw;
display: flex;
flex-direction: column;
}
#block-reha-prevnextblock{
display: flex;
@@ -22,19 +27,35 @@
height: fit-content;
justify-content: space-between;
margin: auto;
@media(max-width:810px){
width: 95%;
}
span{
@media(max-width:810px){
font-size: 0.6rem !important;
}
}
.next-site{
border: none;
padding: 0.5rem 1rem;
margin-left: auto;
@media(max-width:810px){
padding-top: 0.1rem;
}
::after{
content: url('../../dist/images/noun-arrow-1569918-black.svg');
padding-left: 0.5rem;
padding-top: 0.1rem;
padding-top: 0.1rem;
}
}
.prev-site{
border: none;
padding: 0.5rem 1rem;
@media(max-width:810px){
padding-top: 0.1rem;
}
::before{
content: url('../../dist/images/noun-arrow-1569918-black.svg');
display: inline-block;
@@ -42,6 +63,7 @@
padding-left: 0.5rem;
}
}
}
#block-reha-titredepage{
@@ -63,16 +85,28 @@
display: flex;
flex-direction: row;
margin: auto;
@media (max-width:810px){
flex-direction: column;
height: auto;
// max-height: 300px;
}
.image-site{
height: 520px;
width: 771px;
order: 1;
@media (max-width:810px){
height: auto;
width: 100vw;
}
.field--name-field-image{
width: 100%;
margin: auto;
.slick-dots{
z-index: 999;
bottom: -40px;
@media (max-width:810px){
width: 100vw;
}
}
.slick-list{
padding: 0 !important;
@@ -84,12 +118,20 @@
height: 520px;
width: auto;
object-fit: contain;
@media (max-width:810px){
height: auto;
width: 100vw;
}
}
blockquote{
font-style: italic;
margin: 0;
padding-top: 0.5rem;
font-size: 0.8rem;
font-size: 0.8rem;
@media(max-width:810px){
font-size: 0.6rem;
padding-left: 0.5rem;
}
p{
margin: 0;
}
@@ -114,6 +156,7 @@
justify-content: center;
@media(max-width: 891px){
width: auto;
margin-left: 0rem;
}
h1{
order: 3;
@@ -225,16 +268,37 @@
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
@media(max-width:810px){
width: 100%;
display: flex;
flex-direction: column-reverse;
padding-top: 1rem;
font-size: 1.1rem;
}
.summary-content{
width: 75%;
@media(max-width:810px){
width: 90%;
padding: 1rem;
p{
margin: 0;
}
}
}
.links-content{
width: 15%;
margin-top: 1.5rem;
@media(max-width:810px){
width: 100%;
}
.field--type-file{
border: none;
margin-bottom: 1rem;
background-color: transparent;
@media(max-width:810px){
margin-bottom: 0;
}
}
.field__item{
padding: 0.5rem;