Further adjusted CSS for smaller screens.

This commit is contained in:
Reto Bollinger 2025-01-15 21:48:56 +01:00
parent f361219927
commit 5cfb7c7d4c

View file

@ -748,7 +748,7 @@ div.left_footer, div.middle_footer, div.right_footer {
border-collapse: collapse; border-collapse: collapse;
padding: 0 0 calc(50px * 0.7) calc(50px * 0.7); padding: 0 0 calc(50px * 0.7) calc(50px * 0.7);
margin: 0 0 calc(50px * 0.7) calc(50px* 0.7); margin: 0 0 calc(50px * 0.7) calc(50px* 0.7);
width: 84vw; width: calc(100vw - 70px);
} }
.termine ul > li, .vorstand ul > li { .termine ul > li, .vorstand ul > li {
@ -758,7 +758,7 @@ div.left_footer, div.middle_footer, div.right_footer {
.termine ul > li > div, .vorstand ul > li > div{ .termine ul > li > div, .vorstand ul > li > div{
line-height: normal; line-height: normal;
width: 84vw; width: calc(100vw - 100px);
max-width: 700px; max-width: 700px;
text-align: left; text-align: left;
padding: 0; padding: 0;
@ -774,7 +774,7 @@ div.left_footer, div.middle_footer, div.right_footer {
margin: 0; margin: 0;
display: grid; display: grid;
grid-gap: 0; grid-gap: 0;
width: 84vw; width: calc(100vw - 70px);
} }
.termine ul > li > ul,{ .termine ul > li > ul,{
@ -804,16 +804,16 @@ div.left_footer, div.middle_footer, div.right_footer {
grid-column: span 1; grid-column: span 1;
} }
.termine ul > li > ul > li:nth-child(2) { .termine ul > li > ul > li:nth-child(2) {
width: 430px; width: calc(100vw - 350px);
grid-column: span 1; grid-column: span 1;
} }
.termine ul > li > ul > li:nth-child(3) { .termine ul > li > ul > li:nth-child(3) {
width: 84vw; width: calc(100vw - 70px);
grid-column: span 2; grid-column: span 2;
} }
.vorstand ul > li > ul > li:nth-child(1), .vorstand ul > li > ul > li:nth-child(2){ .vorstand ul > li > ul > li:nth-child(1), .vorstand ul > li > ul > li:nth-child(2){
width: 84vw; width: calc(100vw - 70px);
grid-column: span 1; grid-column: span 1;
} }
@ -826,20 +826,26 @@ div.left_footer, div.middle_footer, div.right_footer {
.termine ul > li > ul > li:nth-child(1) > div{ width: 250px; } .termine ul > li > ul > li:nth-child(1) > div{ width: 250px; }
.termine ul > li > ul > li:nth-child(2) > div{ .termine ul > li > ul > li:nth-child(2) > div{
width: 410px; width: calc(100vw - 355px);
margin-left: 0; margin-left: 0;
margin-right: auto; margin-right: auto;
text-align: left; text-align: left;
} }
.termine ul > li > ul > li:nth-child(3) > div{ .termine ul > li > ul > li:nth-child(3) > div{
width: 84vw; width: calc(100vw - 70px);
line-height: 24px; line-height: 24px;
padding: 0; padding: 0;
margin: 0 0 0 7px; margin: 0 0 0 7px;
} }
.vorstand ul > li > ul > li:nth-child(1) > div, .vorstand ul > li > ul > li:nth-child(2) > div{ width: 84vw;} .vorstand ul > li > ul > li:nth-child(1) > div, .vorstand ul > li > ul > li:nth-child(2) > div{ width: calc(100vw - 100px);}
.vorstand ul > li > ul > li:nth-child(2) > div { padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7); } .vorstand ul > li > ul > li:nth-child(2) > div {
padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7);
white-space: nowrap;
line-height: normal;
padding: 0 0 5px 0;
margin: 0 0 0 7px;
}
.termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div { .termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div {