kevin/Popsu-coloque
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

header

Browse Source
This commit is contained in:
ouidade
2024-04-30 14:47:03 +02:00
parent 9904a178e3
commit 083642718b
5 changed files with 238 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/colloque2024/css-compiled/components/footer/footer.css
+67
View File
@@ -0,0 +1,67 @@
footer {
background: white;
border-top: 1px solid black;
width: 100%;
height: auto;
margin-top: 2rem; }
footer .container {
max-width: 90vw; }
footer > .d-flex > div {
margin-bottom: 1.5rem;
padding-top: 2rem;
padding-left: 2rem !important;
padding-right: 2rem !important; }
footer > .d-flex > div:not(:last-of-type) {
border-right: 1px solid black; }
@media (min-width: 992px) {
footer .d-lg-block {
display: block !important; } }
footer #block-renderedsitesettingsblock-5 {
max-width: 30%; }
footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid {
display: grid;
grid-template-columns: 1fr 1fr; }
footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(1) {
grid-column: 1;
grid-row: 1 / span 3; }
footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(2) {
grid-column: 2;
grid-row: 1; }
footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(3) {
grid-column: 2;
grid-row: 2; }
footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(4) {
grid-column: 2;
grid-row: 3; }
@media (min-width: 992px) {
footer #block-renderedsitesettingsblock-4 .d-lg-block {
display: block !important; } }
footer #block-renderedsitesettingsblock-4 .site_setting_entity > div {
margin: 1rem 0; }
footer #block-renderedsitesettingsblock-4 .site_setting_entity > div:first-child::after, footer #block-renderedsitesettingsblock-4 .site_setting_entity > div:first-child:before {
margin: 0.5rem 0;
display: block;
content: " ";
width: 1rem;
height: 1px;
background: black; }
footer #block-renderedsitesettingsblock-4 .site_setting_entity .sub-title {
font-size: 1rem; }
footer #block-renderedsitesettingsblock-4 .site_setting_entity .d-flex {
margin-top: 1rem; }
footer #block-renderedsitesettingsblock-4 .site_setting_entity .d-flex > div {
width: 30px;
margin-right: 1rem; }
footer .site_setting_entity img {
height: auto; }
footer > div {
display: flex;
flex-wrap: nowrap; }
footer > div .__slide .flickity-slider > div {
width: max-content;
margin: 0 1rem; }
footer > div .__slide .flickity-slider > div img {
width: auto !important;
height: 100px;
max-width: 70px;
object-fit: contain; }
web/themes/custom/colloque2024/css-compiled/index.css
+70 -58
View File
@@ -992,47 +992,53 @@ header {
width: auto; } } width: auto; } }
header .row #block-colloque2024-logorepublique.is-active, header .row #block-colloque2024-logoepau.is-active { header .row #block-colloque2024-logorepublique.is-active, header .row #block-colloque2024-logoepau.is-active {
z-index: 10000; } z-index: 10000; }
header .row #block-colloque2024-renderedsitesettingsblock-2 { header .row #block-colloque2024-logoepau {
width: 35%; margin-right: 2rem; }
border-left: 1px solid #b9a47eff; header .row #block-renderedsitesettingsblock-2 {
width: 25%;
border-left: 1px solid black;
padding: 0; padding: 0;
display: none; } justify-content: end; }
header .row #block-colloque2024-renderedsitesettingsblock-2 a { header .row #block-renderedsitesettingsblock-2 a {
display: flex; }
@media screen and (min-width: 1200px) {
header .row #block-colloque2024-renderedsitesettingsblock-2 {
display: flex; } }
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity {
display: flex; display: flex;
align-items: center; margin: auto;
justify-content: flex-start; margin-left: 20%; }
padding: 0 1rem 0 0rem; } @media screen and (min-width: 1200px) {
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity h1 { header .row #block-renderedsitesettingsblock-2 {
width: 100%; display: flex; } }
color: #1d378eff; header .row #block-renderedsitesettingsblock-2 .site_setting_entity {
display: flex;
flex-direction: column; }
header .row #block-renderedsitesettingsblock-2 .site_setting_entity h1 {
order: 2;
width: 60%;
color: black;
padding-right: 1rem; padding-right: 1rem;
text-transform: uppercase; font-size: 2.2rem;
text-align: right; text-align: left;
align-self: stretch; margin: auto 0;
margin: auto 0; } line-height: 0.95; }
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque {
width: 50%; width: fit-content;
order: 1;
height: auto; height: auto;
display: flex; display: flex;
flex-direction: column; } flex-direction: row; }
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div {
height: auto; } height: auto; }
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:first-child { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:first-child {
color: #b9a47eff; order: 2;
color: black;
white-space: nowrap; white-space: nowrap;
border-bottom: 2px solid #b9a47eff; font-family: "Mariannebold";
padding-bottom: 0.4rem; text-transform: uppercase;
margin-bottom: 0.6rem; } padding-left: 0.5rem; }
header .row #block-colloque2024-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:last-child { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:last-child {
color: #1d378eff; order: 1;
padding-right: 10px; color: black;
width: min-content; width: min-content;
margin-bottom: 0; } margin-bottom: 0;
text-transform: uppercase; }
header .row #block-colloque2024-mainnavigation { header .row #block-colloque2024-mainnavigation {
width: max-content; } width: max-content; }
header .row #block-colloque2024-mainnavigation .burger { header .row #block-colloque2024-mainnavigation .burger {
@@ -1047,7 +1053,8 @@ header {
margin-bottom: 0; margin-bottom: 0;
flex-wrap: wrap; } flex-wrap: wrap; }
header .row #block-colloque2024-mainnavigation .nav-main ul li { header .row #block-colloque2024-mainnavigation .nav-main ul li {
margin: 0 0.5rem; } margin: 0 0.5rem;
font-size: 1.3rem !important; }
header .row #block-colloque2024-mainnavigation .nav-main ul li:not(:last-child):after { header .row #block-colloque2024-mainnavigation .nav-main ul li:not(:last-child):after {
display: inline-block; display: inline-block;
content: "|"; content: "|";
@@ -1095,7 +1102,6 @@ header {
transition: all 1s ease; } } transition: all 1s ease; } }
#block-colloque2024-mainnavigation { #block-colloque2024-mainnavigation {
border-left: 1px solid black;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; } justify-content: flex-end; }
@@ -2019,47 +2025,53 @@ footer {
border-top: 1px solid black; border-top: 1px solid black;
width: 100%; width: 100%;
height: auto; height: auto;
padding: 2rem 0 0 0;
margin-top: 2rem; } margin-top: 2rem; }
footer .container { footer .container {
max-width: 90vw; } max-width: 90vw; }
footer > .d-flex > div { footer > .d-flex > div {
margin-bottom: 1.5rem; } margin-bottom: 1.5rem;
padding-top: 2rem;
padding-left: 2rem !important;
padding-right: 2rem !important; }
footer > .d-flex > div:not(:last-of-type) {
border-right: 1px solid black; }
@media (min-width: 992px) { @media (min-width: 992px) {
footer .d-lg-block { footer .d-lg-block {
display: block !important; } } display: block !important; } }
footer #block-colloque2024-renderedsitesettingsblock-5 .site_setting_entity > div { footer #block-renderedsitesettingsblock-5 {
display: flex; max-width: 30%; }
flex-wrap: nowrap; } footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid {
@media screen and (min-width: 768px) { display: grid;
footer #block-colloque2024-renderedsitesettingsblock-5 .site_setting_entity > div { grid-template-columns: 1fr 1fr; }
display: block; } } footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(1) {
footer #block-colloque2024-renderedsitesettingsblock-5 .site_setting_entity > div > div { grid-column: 1;
width: calc((100% / 3) - 0.5rem); } grid-row: 1 / span 3; }
@media screen and (min-width: 768px) { footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(2) {
footer #block-colloque2024-renderedsitesettingsblock-5 .site_setting_entity > div > div { grid-column: 2;
width: calc((100% / 2) - 0.5rem); grid-row: 1; }
max-width: 200px; footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(3) {
margin-bottom: 2rem; } } grid-column: 2;
footer #block-colloque2024-renderedsitesettingsblock-5 .site_setting_entity > div > div:first-child { grid-row: 2; }
margin-right: 0.5rem; } footer #block-renderedsitesettingsblock-5 div.site_setting_entity div.grid div:nth-of-type(4) {
grid-column: 2;
grid-row: 3; }
@media (min-width: 992px) { @media (min-width: 992px) {
footer #block-colloque2024-renderedsitesettingsblock-4 .d-lg-block { footer #block-renderedsitesettingsblock-4 .d-lg-block {
display: block !important; } } display: block !important; } }
footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity > div { footer #block-renderedsitesettingsblock-4 .site_setting_entity > div {
margin: 1rem 0; } margin: 1rem 0; }
footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity > div:first-child::after, footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity > div:first-child:before { footer #block-renderedsitesettingsblock-4 .site_setting_entity > div:first-child::after, footer #block-renderedsitesettingsblock-4 .site_setting_entity > div:first-child:before {
margin: 0.5rem 0; margin: 0.5rem 0;
display: block; display: block;
content: " "; content: " ";
width: 1rem; width: 1rem;
height: 1px; height: 1px;
background: black; } background: black; }
footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity .sub-title { footer #block-renderedsitesettingsblock-4 .site_setting_entity .sub-title {
font-size: 1rem; } font-size: 1rem; }
footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity .d-flex { footer #block-renderedsitesettingsblock-4 .site_setting_entity .d-flex {
margin-top: 1rem; } margin-top: 1rem; }
footer #block-colloque2024-renderedsitesettingsblock-4 .site_setting_entity .d-flex > div { footer #block-renderedsitesettingsblock-4 .site_setting_entity .d-flex > div {
width: 30px; width: 30px;
margin-right: 1rem; } margin-right: 1rem; }
footer .site_setting_entity img { footer .site_setting_entity img {
web/themes/custom/colloque2024/css/components/footer/footer.scss
+56 -21
View File
@@ -3,15 +3,24 @@ footer{
border-top: 1px solid black; border-top: 1px solid black;
width: 100%; width: 100%;
height: auto; height: auto;
padding: 2rem 0 0 0; // padding: 2rem 0 0 0;
margin-top:2rem; margin-top:2rem;
.container{ .container{
max-width: 90vw; max-width: 90vw;
} }
& > .d-flex{ & > .d-flex{
& > div{ & > div{
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
padding-top: 2rem;
padding-left: 2rem !important;
padding-right: 2rem !important;
}
& > div:not(:last-of-type){
border-right: 1px solid black;
} }
} }
@media (min-width: 992px) { @media (min-width: 992px) {
@@ -19,30 +28,55 @@ footer{
display: block !important; display: block !important;
} }
} }
#block-colloque2024-renderedsitesettingsblock-5{ #block-renderedsitesettingsblock-5{
.site_setting_entity{ max-width: 30%;
& > div{
display: flex; div.site_setting_entity div.grid{
flex-wrap: nowrap; display: grid;
@media screen and (min-width: 768px) { grid-template-columns: 1fr 1fr;
display:block; div:nth-of-type(1){
} grid-column: 1;
& > div{ grid-row: 1 / span 3;
width: calc((100% / 3) - #{$gutter}); }
@media screen and (min-width: 768px) { div:nth-of-type(2){
width: calc((100% / 2) - #{$gutter}); grid-column: 2;
max-width: 200px; grid-row: 1;
margin-bottom: 2rem; }
} div:nth-of-type(3){
&:first-child{ grid-column: 2;
margin-right: $gutter; grid-row: 2;
} }
} div:nth-of-type(4){
grid-column: 2;
grid-row: 3;
} }
} }
// & > div{
// // display: flex;
// // flex-wrap: nowrap;
// @media screen and (min-width: 768px) {
// display:block;
// }
// & > div{
// // width: calc((100% / 3) - #{$gutter});
// @media screen and (min-width: 768px) {
// width: calc((100% / 2) - #{$gutter});
// max-width: 200px;
// margin-bottom: 2rem;
// }
// // &:first-child{
// // margin-right: $gutter;
// }
// }
// }
} }
#block-colloque2024-renderedsitesettingsblock-4{ #block-renderedsitesettingsblock-4{
@media (min-width: 992px) { @media (min-width: 992px) {
.d-lg-block { .d-lg-block {
display: block !important; display: block !important;
@@ -97,4 +131,5 @@ footer{
} }
} }
} }
} }
web/themes/custom/colloque2024/css/components/header/header.scss
+43 -22
View File
@@ -31,13 +31,20 @@ header{
z-index: 10000; z-index: 10000;
} }
} }
#block-colloque2024-renderedsitesettingsblock-2{ #block-colloque2024-logoepau{
width: 35%; margin-right: 2rem;
border-left: 1px solid $color1; }
#block-renderedsitesettingsblock-2{
width: 25%;
border-left: 1px solid black;
padding: 0; padding: 0;
display: none; // display: none;
justify-content: end;
a{ a{
display: flex; display: flex;
margin: auto;
// align-items: right;
margin-left: 20%;
} }
@media screen and (min-width: 1200px) { @media screen and (min-width: 1200px) {
display: flex; display: flex;
@@ -45,38 +52,51 @@ header{
} }
.site_setting_entity{ .site_setting_entity{
display: flex; display: flex;
align-items: center; flex-direction: column;
justify-content: flex-start; // align-items: left;
padding: 0 1rem 0 0rem; // justify-content: flex-end;
// padding: 0 1rem 0 0rem;
h1{ h1{
width: 100%; order: 2;
color: $color2; width: 60%;
color: black;
padding-right: 1rem; padding-right: 1rem;
text-transform: uppercase; font-size: 2.2rem;
text-align: right; // text-transform: uppercase;
align-self: stretch; text-align: left;
// align-self: stretch;
margin: auto 0; margin: auto 0;
line-height: 0.95;
} }
.__info_colloque{ .__info_colloque{
width: 50%; // width: 50%;
width: fit-content;
order: 1;
height: auto; height: auto;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
// justify-content: space-between; // justify-content: space-between;
&>div{ &>div{
height: auto; height: auto;
&:first-child{ &:first-child{
color: $color1; order: 2;
color: black;
white-space: nowrap; white-space: nowrap;
border-bottom: 2px solid $color1; // border-bottom: 2px solid $color1;
padding-bottom: 0.4rem; font-family: "Mariannebold";
margin-bottom: 0.6rem; text-transform: uppercase;
padding-left: 0.5rem;
// padding-bottom: 0.4rem;
// margin-bottom: 0.6rem;
} }
&:last-child{ &:last-child{
color: $color2; order: 1;
padding-right: 10px; color: black;
// padding-right: 10px;
width: min-content; width: min-content;
margin-bottom: 0; margin-bottom: 0;
text-transform: uppercase;
} }
} }
} }
@@ -84,7 +104,6 @@ header{
} }
#block-colloque2024-mainnavigation{ #block-colloque2024-mainnavigation{
width: max-content; width: max-content;
.burger{ .burger{
padding-top: 0.25rem; padding-top: 0.25rem;
z-index: 9999; z-index: 9999;
@@ -98,6 +117,8 @@ header{
flex-wrap: wrap; flex-wrap: wrap;
li{ li{
margin: 0 0.5rem; margin: 0 0.5rem;
font-size: 1.3rem !important;
&:not(:last-child){ &:not(:last-child){
&:after{ &:after{
display: inline-block; display: inline-block;
@@ -164,7 +185,7 @@ header{
} }
#block-colloque2024-mainnavigation{ #block-colloque2024-mainnavigation{
border-left: 1px solid black; // border-left: 1px solid black;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
web/themes/custom/colloque2024/template/fields/field--site-setting-entity--field-file--les-logos-du-colloque.html.twig
+1 -1
View File
@@ -46,7 +46,7 @@
{% if label_hidden %} {% if label_hidden %}
{% if multiple %} {% if multiple %}
<div class="d-flex"> <div class="grid">
{% for item in items %} {% for item in items %}
<div class="">{{ item.content }}</div> <div class="">{{ item.content }}</div>
{% endfor %} {% endfor %}