MediaWiki:Common.css: Unterschied zwischen den Versionen
Aus kvwmap
Zeile 39: | Zeile 39: | ||
position: relative; | position: relative; | ||
width: 100%; | width: 100%; | ||
− | height: | + | height: 100vh; |
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
+ | font-size: 1.3em; | ||
} | } | ||
− | #start- | + | #start-block1, #start-block2, #start-huebschesbild, #start-logo { |
position: relative; | position: relative; | ||
} | } | ||
Zeile 61: | Zeile 62: | ||
} | } | ||
− | #start- | + | #start-block1, #start-block2, #start-huebschesbild, #start-logo { |
position: relative; | position: relative; | ||
display: flex; | display: flex; | ||
Zeile 68: | Zeile 69: | ||
} | } | ||
− | #start- | + | #start-block1, #start-block2 { |
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; | box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; | ||
} | } | ||
Zeile 77: | Zeile 78: | ||
} | } | ||
− | #start- | + | #start-block1 { |
order: 2; | order: 2; | ||
width: 50%; | width: 50%; | ||
} | } | ||
− | #start- | + | #start-block2 { |
order: 3; | order: 3; | ||
width: 50%; | width: 50%; | ||
Zeile 97: | Zeile 98: | ||
@media only screen and (min-width: 1000px) { | @media only screen and (min-width: 1000px) { | ||
− | #start- | + | #start-block1, #start-block2, #start-huebschesbild, #start-logo { |
position: absolute; | position: absolute; | ||
} | } | ||
− | #start- | + | #start-block1 { |
− | left: | + | left: 30%; |
− | top: | + | top: 5%; |
transform: translate(-50%,0%); | transform: translate(-50%,0%); | ||
} | } | ||
− | #start- | + | #start-block2 { |
− | left: | + | left: 82%; |
− | top: | + | top: 45%; |
transform: translate(-50%,0%); | transform: translate(-50%,0%); | ||
} | } | ||
Zeile 115: | Zeile 116: | ||
#start-huebschesbild { | #start-huebschesbild { | ||
left: 60%; | left: 60%; | ||
− | top: | + | top: 15%; |
transform: translate(-50%,0%); | transform: translate(-50%,0%); | ||
} | } | ||
#start-logo { | #start-logo { | ||
− | left: | + | left: 27%; |
− | top: | + | top: 50%; |
transform: translate(-50%,0%); | transform: translate(-50%,0%); | ||
} | } | ||
Zeile 130: | Zeile 131: | ||
@media only screen and (min-width: 1400px) { | @media only screen and (min-width: 1400px) { | ||
− | #start- | + | #start-logo { |
− | + | left: 30%; | |
+ | top: 60%; | ||
} | } | ||
− | #start- | + | #start-block2 { |
− | + | left: 82%; | |
− | + | top: 45%; | |
} | } | ||
} | } | ||
− | .start- | + | .start-block1, .start-block2, .start-logo { |
width: 250px; | width: 250px; | ||
height: fit-content; | height: fit-content; | ||
} | } | ||
− | .start- | + | .start-block1, .start-block2 { |
} | } | ||
− | .start- | + | .start-block1, .start-block2 { |
padding: 0.5em 1em; | padding: 0.5em 1em; | ||
} | } |
Version vom 30. Oktober 2023, 10:38 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ .noautonum .tocnumber { display: none; } .portlet h3 { font-size: 106%; } .portlet ul { line-height: 1.5em; font-size: 106%; } img.halfwidth { width: 100%; height: auto; } div#mw-panel.collapsible-nav { position: fixed; } body.page-kvwmap_-_Open_Source_WebGIS #firstHeading { display: none; } body.page-kvwmap_-_Open_Source_WebGIS .mw-content-ltr > p { display: none; } div#p-namespaces.vectorTabs { display: none; } /* -------------- Startseite -------------- */ .start-wrapper { position: relative; width: 100%; height: 100vh; margin: 0; padding: 0; font-size: 1.3em; } #start-block1, #start-block2, #start-huebschesbild, #start-logo { position: relative; } /* Max. Breite 1000 px */ @media only screen and (max-width: 1000px) { .start-wrapper { height: 100%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; gap: 1em; } #start-block1, #start-block2, #start-huebschesbild, #start-logo { position: relative; display: flex; flex-direction: row; justify-content: center; } #start-block1, #start-block2 { box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; } #start-logo { order: 1; width: 100%; } #start-block1 { order: 2; width: 50%; } #start-block2 { order: 3; width: 50%; } #start-huebschesbild { order: 4; width: 50%; } } /* Min. Breite 1000 px */ @media only screen and (min-width: 1000px) { #start-block1, #start-block2, #start-huebschesbild, #start-logo { position: absolute; } #start-block1 { left: 30%; top: 5%; transform: translate(-50%,0%); } #start-block2 { left: 82%; top: 45%; transform: translate(-50%,0%); } #start-huebschesbild { left: 60%; top: 15%; transform: translate(-50%,0%); } #start-logo { left: 27%; top: 50%; transform: translate(-50%,0%); } } /* Min. Breite 1400 px */ @media only screen and (min-width: 1400px) { #start-logo { left: 30%; top: 60%; } #start-block2 { left: 82%; top: 45%; } } .start-block1, .start-block2, .start-logo { width: 250px; height: fit-content; } .start-block1, .start-block2 { } .start-block1, .start-block2 { padding: 0.5em 1em; } #start-huebschesbild img { width: 60%; height: auto; border: 10px solid #3976aa; border-radius: 100%; background: #eef7fb; } /* -------------- Startseite Ende -------------- */