MediaWiki:Common.css: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Zeile 31: | Zeile 31: | ||
.grid-item { | .grid-item { | ||
text-align: justify; | text-align: justify; | ||
border: 1px solid #aaa !important; | border: 1px solid #aaa !important; | ||
Zeile 43: | Zeile 42: | ||
.SFB { | .SFB { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 4; | grid-column-end: 4; | ||
Zeile 51: | Zeile 49: | ||
.HS-SF { | .HS-SF { | ||
grid-column-start: 4; | grid-column-start: 4; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
Zeile 59: | Zeile 56: | ||
.HS-FD { | .HS-FD { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 4; | grid-column-end: 4; | ||
Zeile 67: | Zeile 63: | ||
.item-wrapper { | .item-wrapper { | ||
border: 1px solid #aaa !important; | border: 1px solid #aaa !important; | ||
margin-top: 20px !important; | margin-top: 20px !important; | ||
} | } | ||
.item-header { | .item-header { | ||
text-align: left; | text-align: left; | ||
font-weight: bold !important; | font-weight: bold !important; | ||
Zeile 80: | Zeile 73: | ||
font-family: inherit !important; | font-family: inherit !important; | ||
padding: 0.4em !important; | padding: 0.4em !important; | ||
padding-left: 20px; | padding-left: 20px; | ||
} | |||
} | |||
.HS-FD .item-header{ | .HS-FD .item-header{ | ||
height: 80px; | height: 80px; | ||
border-top: 5px solid #cecec7; | |||
border-top: 5px solid #cecec7; } | } | ||
.HS-SF .item-header{ | .HS-SF .item-header{ | ||
height: 40px; | height: 40px; | ||
border-top: 5px solid #8991ba; | |||
border-top: 5px solid #8991ba; } | } | ||
.HS-TPs .item-header{ | .HS-TPs .item-header{ | ||
height: 150px; | height: 150px; | ||
border-top: 5px solid #2a4b8b; | |||
border-top: 5px solid #2a4b8b; } | } | ||
.item-body{ | .item-body{ | ||
border-top: 1px solid #aaa !important; | border-top: 1px solid #aaa !important; | ||
padding: 0.2em 0.4em; | padding: 0.2em 0.4em; | ||
} | } | ||
.item-header a:link { | .item-header a:link { | ||
color: black; | color: black; | ||
} | |||
.HS-TPs .item-header:hover { | |||
background: #2a4b8b; | |||
} | } | ||
.item- | .HS-SF .item-headerhover { | ||
background: #8991ba; | |||
background: # | } | ||
.HS-FD .item-headerhover { | |||
background: #cecec7; | |||
} | } | ||
.item-header:hover a:link { | .item-header:hover a:link { | ||
color: white; | color: white; | ||
} | } | ||
.item-header a:visited { | .item-header a:visited { | ||
color: black; | color: black; | ||
} | } | ||
.item-header:hover a:visited { | .item-header:hover a:visited { | ||
color: white; | color: white; | ||
} | } | ||
#fd-1 { | #fd-1 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 3; | grid-column-end: 3; | ||
grid-row-start: 1; | grid-row-start: 1; | ||
grid-row-end: 2; | grid-row-end: 2; | ||
} | } | ||
#fd-2 { | #fd-2 { | ||
grid-column-start: 3; | grid-column-start: 3; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 1; | grid-row-start: 1; | ||
grid-row-end: 2; | grid-row-end: 2; | ||
} | } | ||
#fd-3 { | #fd-3 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 3; | grid-column-end: 3; | ||
grid-row-start: 2; | grid-row-start: 2; | ||
grid-row-end: 3; | grid-row-end: 3; | ||
} | } | ||
#fd-4 { | #fd-4 { | ||
grid-column-start: 3; | grid-column-start: 3; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 2; | grid-row-start: 2; | ||
grid-row-end: 3; | grid-row-end: 3; | ||
} | } | ||
#sf-1 { | #sf-1 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 1; | grid-row-start: 1; | ||
grid-row-end: 2; | grid-row-end: 2; | ||
} | } | ||
#sf-2 { | #sf-2 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 2; | grid-row-start: 2; | ||
grid-row-end: 3; | grid-row-end: 3; | ||
} | } | ||
#sf-3 { | #sf-3 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 3; | grid-row-start: 3; | ||
grid-row-end: 4; | grid-row-end: 4; | ||
} | } | ||
#sf-4 { | #sf-4 { | ||
grid-column-start: 1; | grid-column-start: 1; | ||
grid-column-end: 5; | grid-column-end: 5; | ||
grid-row-start: 4; | grid-row-start: 4; | ||
grid-row-end: 5; | grid-row-end: 5; | ||
} | } |
Version vom 7. Juni 2021, 09:47 Uhr
/* Grid "Zentrale Hinhalte" */ .grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1em; } @media only screen and (min-width : 680px) { .grid { grid-template-columns: repeat(2, 1fr); } } @media only screen and (min-width : 980px) { .grid { grid-template-columns: repeat(4, 1fr); } } @media only screen and (min-width : 1980px) { .grid { grid-template-columns: repeat(8, 1fr); } } .grid-item { text-align: justify; border: 1px solid #aaa !important; line-height: 1.5; font-family: inherit; padding-left: 20px; padding-right: 20px; margin: 10px; padding-bottom: 20px; } .SFB { grid-column-start: 1; grid-column-end: 4; grid-row-start: 1; grid-row-end: 2; } .HS-SF { grid-column-start: 4; grid-column-end: 5; grid-row-start: 1; grid-row-end: 3; } .HS-FD { grid-column-start: 1; grid-column-end: 4; grid-row-start: 2; grid-row-end: 4; } .item-wrapper { border: 1px solid #aaa !important; margin-top: 20px !important; } .item-header { text-align: left; font-weight: bold !important; line-height: 1.5 !important; font-family: inherit !important; padding: 0.4em !important; padding-left: 20px; } .HS-FD .item-header{ height: 80px; border-top: 5px solid #cecec7; } .HS-SF .item-header{ height: 40px; border-top: 5px solid #8991ba; } .HS-TPs .item-header{ height: 150px; border-top: 5px solid #2a4b8b; } .item-body{ border-top: 1px solid #aaa !important; padding: 0.2em 0.4em; } .item-header a:link { color: black; } .HS-TPs .item-header:hover { background: #2a4b8b; } .HS-SF .item-headerhover { background: #8991ba; } .HS-FD .item-headerhover { background: #cecec7; } .item-header:hover a:link { color: white; } .item-header a:visited { color: black; } .item-header:hover a:visited { color: white; } #fd-1 { grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 2; } #fd-2 { grid-column-start: 3; grid-column-end: 5; grid-row-start: 1; grid-row-end: 2; } #fd-3 { grid-column-start: 1; grid-column-end: 3; grid-row-start: 2; grid-row-end: 3; } #fd-4 { grid-column-start: 3; grid-column-end: 5; grid-row-start: 2; grid-row-end: 3; } #sf-1 { grid-column-start: 1; grid-column-end: 5; grid-row-start: 1; grid-row-end: 2; } #sf-2 { grid-column-start: 1; grid-column-end: 5; grid-row-start: 2; grid-row-end: 3; } #sf-3 { grid-column-start: 1; grid-column-end: 5; grid-row-start: 3; grid-row-end: 4; } #sf-4 { grid-column-start: 1; grid-column-end: 5; grid-row-start: 4; grid-row-end: 5; }