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

responsive

Browse Source
This commit is contained in:
ouidade
2024-05-08 23:23:39 +02:00
parent fa2b4ee25a
commit 7232b25e0d
2 changed files with 40 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/colloque2024/css-compiled/index.css
+20 -1
View File
@@ -1001,7 +1001,7 @@ header {
max-height: inherit; max-height: inherit;
border-bottom: 1px solid black; border-bottom: 1px solid black;
padding-left: 40px; } padding-left: 40px; }
@media screen and (max-width: 300px) { @media screen and (max-width: 550px) {
header .row { header .row {
padding-left: 20px; padding-left: 20px;
flex-wrap: nowrap; } } flex-wrap: nowrap; } }
@@ -1032,6 +1032,9 @@ header {
z-index: 10000; } z-index: 10000; }
header .row #block-colloque2024-logoepau { header .row #block-colloque2024-logoepau {
margin-right: 2rem; } margin-right: 2rem; }
@media screen and (max-width: 550px) {
header .row #block-colloque2024-logoepau {
margin: 0; } }
header .row #block-renderedsitesettingsblock-2 { header .row #block-renderedsitesettingsblock-2 {
width: 25%; width: 25%;
border-left: 1px solid black; border-left: 1px solid black;
@@ -1040,6 +1043,9 @@ header {
@media screen and (max-width: 300px) { @media screen and (max-width: 300px) {
header .row #block-renderedsitesettingsblock-2 { header .row #block-renderedsitesettingsblock-2 {
display: none; } } display: none; } }
@media screen and (max-width: 550px) {
header .row #block-renderedsitesettingsblock-2 {
align-content: center; } }
header .row #block-renderedsitesettingsblock-2 a { header .row #block-renderedsitesettingsblock-2 a {
display: flex; display: flex;
margin: auto; margin: auto;
@@ -1059,12 +1065,18 @@ header {
text-align: left; text-align: left;
margin: auto 0; margin: auto 0;
line-height: 0.95; } line-height: 0.95; }
@media screen and (max-width: 550px) {
header .row #block-renderedsitesettingsblock-2 .site_setting_entity h1 {
font-size: 1rem; } }
header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque {
width: fit-content; width: fit-content;
order: 1; order: 1;
height: auto; height: auto;
display: flex; display: flex;
flex-direction: row; } flex-direction: row; }
@media screen and (max-width: 550px) {
header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque {
flex-direction: column; } }
header .row #block-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-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:first-child { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:first-child {
@@ -1074,12 +1086,19 @@ header {
font-family: "Mariannebold"; font-family: "Mariannebold";
text-transform: uppercase; text-transform: uppercase;
padding-left: 0.5rem; } padding-left: 0.5rem; }
@media screen and (max-width: 550px) {
header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:first-child {
padding-left: 0;
font-size: 0.6rem; } }
header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:last-child { header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:last-child {
order: 1; order: 1;
color: black; color: black;
width: min-content; width: min-content;
margin-bottom: 0; margin-bottom: 0;
text-transform: uppercase; } text-transform: uppercase; }
@media screen and (max-width: 550px) {
header .row #block-renderedsitesettingsblock-2 .site_setting_entity .__info_colloque > div:last-child {
font-size: 0.6rem; } }
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 {
web/themes/custom/colloque2024/css/components/header/header.scss
+20 -1
View File
@@ -5,7 +5,7 @@ header{
max-height: inherit; max-height: inherit;
border-bottom: 1px solid black; border-bottom: 1px solid black;
padding-left: 40px; padding-left: 40px;
@media screen and (max-width: 300px) { @media screen and (max-width: 550px) {
padding-left: 20px; padding-left: 20px;
flex-wrap: nowrap; flex-wrap: nowrap;
} }
@@ -43,6 +43,9 @@ header{
} }
#block-colloque2024-logoepau{ #block-colloque2024-logoepau{
margin-right: 2rem; margin-right: 2rem;
@media screen and (max-width: 550px) {
margin: 0;
}
} }
#block-renderedsitesettingsblock-2{ #block-renderedsitesettingsblock-2{
width: 25%; width: 25%;
@@ -52,6 +55,9 @@ header{
@media screen and (max-width: 300px) { @media screen and (max-width: 300px) {
display: none; display: none;
} }
@media screen and (max-width: 550px) {
align-content: center;
}
a{ a{
display: flex; display: flex;
margin: auto; margin: auto;
@@ -73,6 +79,9 @@ header{
text-align: left; text-align: left;
margin: auto 0; margin: auto 0;
line-height: 0.95; line-height: 0.95;
@media screen and (max-width: 550px) {
font-size: 1rem;
}
} }
.__info_colloque{ .__info_colloque{
width: fit-content; width: fit-content;
@@ -80,6 +89,9 @@ header{
height: auto; height: auto;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@media screen and (max-width: 550px) {
flex-direction: column;
}
&>div{ &>div{
height: auto; height: auto;
&:first-child{ &:first-child{
@@ -89,6 +101,10 @@ header{
font-family: "Mariannebold"; font-family: "Mariannebold";
text-transform: uppercase; text-transform: uppercase;
padding-left: 0.5rem; padding-left: 0.5rem;
@media screen and (max-width: 550px) {
padding-left: 0;
font-size: 0.6rem;
}
} }
&:last-child{ &:last-child{
order: 1; order: 1;
@@ -96,6 +112,9 @@ header{
width: min-content; width: min-content;
margin-bottom: 0; margin-bottom: 0;
text-transform: uppercase; text-transform: uppercase;
@media screen and (max-width: 550px) {
font-size: 0.6rem;
}
} }
} }