MediaWiki:Common.css: Unterschied zwischen den Versionen
Aus kvwmap
| Zeile 32: | Zeile 32: | ||
display: none; | display: none; | ||
} | } | ||
| + | |||
| + | |||
| + | /* -------------- Startseite -------------- */ | ||
| + | |||
| + | .start-wrapper { | ||
| + | position: relative; | ||
| + | width: 100%; | ||
| + | height: 75vh; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | } | ||
| + | |||
| + | #start-block-1, #start-block-2, #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-block-1, #start-block-2, #start-huebschesbild, #start-logo { | ||
| + | position: relative; | ||
| + | display: flex; | ||
| + | flex-direction: row; | ||
| + | justify-content: center; | ||
| + | } | ||
| + | |||
| + | #start-block-1, #start-block-2 { | ||
| + | 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-block-1 { | ||
| + | order: 2; | ||
| + | width: 50%; | ||
| + | } | ||
| + | |||
| + | #start-block-2 { | ||
| + | order: 3; | ||
| + | width: 50%; | ||
| + | } | ||
| + | |||
| + | #start-huebschesbild { | ||
| + | order: 4; | ||
| + | width: 50%; | ||
| + | } | ||
| + | |||
| + | } | ||
| + | |||
| + | /* Min. Breite 1000 px */ | ||
| + | @media only screen and (min-width: 1000px) { | ||
| + | |||
| + | #start-block-1, #start-block-2, #start-huebschesbild, #start-logo { | ||
| + | position: absolute; | ||
| + | } | ||
| + | |||
| + | #start-block-1 { | ||
| + | left: 34%; | ||
| + | top: 10%; | ||
| + | transform: translate(-50%,0%); | ||
| + | } | ||
| + | |||
| + | #start-block-2 { | ||
| + | left: 75%; | ||
| + | top: 80%; | ||
| + | transform: translate(-50%,0%); | ||
| + | } | ||
| + | |||
| + | #start-huebschesbild { | ||
| + | left: 60%; | ||
| + | top: 20%; | ||
| + | transform: translate(-50%,0%); | ||
| + | } | ||
| + | |||
| + | #start-logo { | ||
| + | left: 30%; | ||
| + | top: 80%; | ||
| + | transform: translate(-50%,0%); | ||
| + | } | ||
| + | |||
| + | } | ||
| + | |||
| + | /* Min. Breite 1400 px */ | ||
| + | @media only screen and (min-width: 1400px) { | ||
| + | |||
| + | #start-block-1 { | ||
| + | left: 32%; | ||
| + | } | ||
| + | |||
| + | #start-block-2 { | ||
| + | left: 78%; | ||
| + | top: 75%; | ||
| + | } | ||
| + | |||
| + | } | ||
| + | |||
| + | .start-block-1, .start-block-2, .start-logo { | ||
| + | width: 250px; | ||
| + | height: fit-content; | ||
| + | } | ||
| + | |||
| + | .start-block-1, .start-block-2 { | ||
| + | |||
| + | } | ||
| + | |||
| + | .start-block-1, .start-block-2 { | ||
| + | padding: 0.5em 1em; | ||
| + | } | ||
| + | |||
| + | #start-huebschesbild img { | ||
| + | width: 60%; | ||
| + | height: auto; | ||
| + | border: 10px solid #3976aa; | ||
| + | border-radius: 100%; | ||
| + | background: #eef7fb; | ||
| + | } | ||
| + | |||
| + | /* -------------- Startseite Ende -------------- */ | ||
Version vom 27. Oktober 2023, 14:47 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: 75vh;
margin: 0;
padding: 0;
}
#start-block-1, #start-block-2, #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-block-1, #start-block-2, #start-huebschesbild, #start-logo {
position: relative;
display: flex;
flex-direction: row;
justify-content: center;
}
#start-block-1, #start-block-2 {
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-block-1 {
order: 2;
width: 50%;
}
#start-block-2 {
order: 3;
width: 50%;
}
#start-huebschesbild {
order: 4;
width: 50%;
}
}
/* Min. Breite 1000 px */
@media only screen and (min-width: 1000px) {
#start-block-1, #start-block-2, #start-huebschesbild, #start-logo {
position: absolute;
}
#start-block-1 {
left: 34%;
top: 10%;
transform: translate(-50%,0%);
}
#start-block-2 {
left: 75%;
top: 80%;
transform: translate(-50%,0%);
}
#start-huebschesbild {
left: 60%;
top: 20%;
transform: translate(-50%,0%);
}
#start-logo {
left: 30%;
top: 80%;
transform: translate(-50%,0%);
}
}
/* Min. Breite 1400 px */
@media only screen and (min-width: 1400px) {
#start-block-1 {
left: 32%;
}
#start-block-2 {
left: 78%;
top: 75%;
}
}
.start-block-1, .start-block-2, .start-logo {
width: 250px;
height: fit-content;
}
.start-block-1, .start-block-2 {
}
.start-block-1, .start-block-2 {
padding: 0.5em 1em;
}
#start-huebschesbild img {
width: 60%;
height: auto;
border: 10px solid #3976aa;
border-radius: 100%;
background: #eef7fb;
}
/* -------------- Startseite Ende -------------- */