KKeine Bearbeitungszusammenfassung |
KKeine Bearbeitungszusammenfassung |
||
(61 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
{{DISPLAYTITLE:Common.css: | {{DISPLAYTITLE:Common.css}}{{#vardefinse:headerIcon|fal fa-fw fa-wrench}} | ||
/* CSS an dieser Stelle wirkt sich auf alle Skins aus */ | /* CSS an dieser Stelle wirkt sich auf alle Skins aus */ | ||
Zeile 7: | Zeile 7: | ||
/* moderne Browser sehen das nicht !*/ | /* moderne Browser sehen das nicht !*/ | ||
display: none; | display: none; | ||
} | |||
.img-container { | |||
display: flow-root; | |||
max-width: fit-content; | |||
} | |||
_:-ms-lang(x), _:-webkit-full-screen, .ms-only { | _:-ms-lang(x), _:-webkit-full-screen, .ms-only { | ||
Zeile 14: | Zeile 18: | ||
display: block; | display: block; | ||
color:red; | color:red; | ||
} | |||
_:-ms-lang(x), .ms-only { | _:-ms-lang(x), .ms-only { | ||
Zeile 35: | Zeile 39: | ||
/*** Formatierungen für Alle ***/ | /*** Formatierungen für Alle ***/ | ||
#siteSub { | |||
display: none; | |||
} | |||
.dev { | |||
display: none; | |||
} | |||
#p-search #searchform label span.form-icon-prefix { | |||
height: 2.65em; | |||
} | |||
/* .toc { | |||
display: block; | |||
/*max-width: 48%; */ | |||
float: right; | |||
margin-left: 3%; | |||
font-size:95%; | |||
line-height: 125%; | |||
} */ | |||
.toctogglespan { | |||
display: inline-flex; | |||
} | |||
table { | |||
width: unset; | |||
} | |||
:root { | :root { | ||
--me-width: 32%; | |||
} | } | ||
.embedvideo { | |||
display: inline-block; | |||
float: inline-end; | |||
} | |||
.glyphicons { | .glyphicons { | ||
display: inline-block; | |||
/*opacity: 1;*/ | |||
} | } | ||
body { | body { | ||
font-family: Helvetica,Verdana,Arial,sans-serif; | |||
font-size: 13px; | |||
color: black; | |||
background-color: #b40001; | |||
text-align: justify; | |||
background-position: top center; | |||
background-repeat: no-repeat; | |||
line-height: 18px; | |||
} | |||
} | |||
.bodyContent, .menu-vertical, .mw-editfont-monospace { | |||
font-size: 16px; | |||
} | |||
.mw-body { | |||
margin-top: -24px; | |||
} | |||
code { | code { | ||
Zeile 72: | Zeile 106: | ||
display: inline-block; | display: inline-block; | ||
padding: 2px; | padding: 2px; | ||
} | |||
img { | img { | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
.flexelement.items_n { | .flexelement.items_n { | ||
width: var(--me-width); | |||
align-items: stretch; | |||
border: 0; | |||
padding: 0px; | |||
background-color: white; | |||
font-size: 110%; | |||
text-align: left; | |||
/*overflow: hidden;*/ | |||
margin: 2px 10px 1px 0px; | |||
flex-wrap: wrap; | |||
} | |||
.de { | .de { | ||
{{#vardefine: sp-wiki-lang | de }} | |||
} | |||
.en { | .en { | ||
{{#vardefine: sp-wiki-lang | en }} | |||
} | |||
.language { | .language { | ||
display: | display: none; | ||
} | |||
h1 i, h2 i, h3 i, h4 i { | |||
color: unset; | |||
font-size: unset !important; | |||
position: unset; | |||
top: unset; | |||
margin-right: unset; | |||
} | |||
a:visited { | |||
color: #F1948A; | |||
} | |||
a:hover { | |||
color: #e74c3c; | |||
text-decoration: underline; | |||
} | |||
a.external { | |||
color: #e74c3c; | |||
} | |||
a[href].external { | |||
color: #e74c3c; | |||
} | |||
a.external:visited { | |||
color: #F1948A; | |||
} | |||
a[href].external:visited { | |||
color: #F1948A; | |||
} | |||
a.new { | |||
color: magenta; | |||
} | |||
a[href].new { | |||
color: magenta; | |||
} | |||
a.new:visited { | |||
color: magenta; | |||
} | |||
a[href].new:visited { | |||
color: magenta; | |||
} | |||
table tr td { | |||
padding: unset; | |||
} | |||
.right { | |||
float: inline-end; | |||
} | |||
.ui-icon { | |||
position: relative; | |||
background-image: url("/images/d/d4/Ui-icons.png"); | |||
width: 16px; | |||
height: 16px; | |||
display: inline-block; | |||
} | |||
.cb::after { | |||
background-position: -80px -224px; | |||
position: relative; | |||
background-image: url(/images/d/d4/Ui-icons.png); | |||
width: 16px; | |||
height: 16px; | |||
display: inline-block; | |||
} | } | ||
.sp-icons-cpu { | |||
color: | position: relative; | ||
background-image: url("/images/7/72/Cpu.svg"); | |||
display: inline-block; | |||
} | |||
.sp-icons-x2 { | |||
height: 35px; | |||
width: 35px; | |||
background-size: 35px; | |||
} | |||
.sp-icons-x3 { | |||
height: 50px; | |||
width: 50px; | |||
background-size: 50px; | |||
} | |||
.portlet-icon-ram-info { | |||
position: relative; | |||
background-image: url("/images/b/b1/App-ram-info.svg"); | |||
display: inline-block; | |||
} | |||
.portlet-icon-dhcp-info { | |||
position: relative; | |||
background-image: url("/images/8/8e/App-dhcp-info.svg"); | |||
display: inline-block; | |||
} | |||
.portlet-icon-interfaces-info { | |||
position: relative; | |||
background-image: url("/images/d/d4/App-interfaces-info.svg"); | |||
display: inline-block; | |||
} | |||
.SPicon-awp { | |||
position: relative; | |||
background-image: url("/images/d/d5/Icon-security-awareness.svg"); | |||
width: 16px; | |||
height: 16px; | |||
display: inline-block; | |||
} | |||
.icon-save-and-restart { | |||
position: relative; | |||
background-image: url(/images/6/64/Save-and-restart.svg); | |||
width: 1.3em; | |||
height: 1.3em; | |||
display: inline-block; | |||
background-size: contain; | |||
background-repeat: no-repeat; | |||
top: 0.1em; | |||
} | |||
.key-skeleton-gear-white { | |||
position: relative; | |||
background-image: url("/images/9/9f/Key-skeleton-gear-white.svg"); | |||
display: inline-block; | |||
width: 1.3em; | |||
height: 1.3em; | |||
top: 0.1em; | |||
background-size: contain !important; | |||
background-repeat: no-repeat; | |||
filter: brightness(0.27); | |||
} | |||
i.subicon { | |||
padding-left: 2em; | |||
} | |||
i.subicon ~ span{ | |||
padding-left: 1em; | |||
} | |||
.available, | |||
.icon.available { | |||
width: -webkit-fill-available; | |||
width: -moz-available; | |||
} | |||
.mw-parser-output [class*="color-box-shadow"].Hinweis-Container__einblenden, | |||
.mw-parser-output [class*="color-box-shadow"].Hinweis-Container__einblenden__block { | |||
/* display: flex; */ | |||
max-width: fit-content; | |||
align-items: center; | |||
} | |||
.Hinweis-Container__einblenden__inline-flex { | |||
display: inline-flex; | |||
margin-right: 3px; | |||
max-width: fit-content; | |||
} | |||
.thumbactiv { | |||
box-shadow: 0 0 8px #ddd; | |||
-webkit-transition: box-shadow 0.2s ease-in-out; | |||
-moz-transition: box-shadow 0.2s ease-in-out; | |||
-o-transition: box-shadow 0.2s ease-in-out; | |||
transition: box-shadow 0.2s ease-in-out; | |||
margin-right: 1em; | |||
margin-bottom: 2em; | |||
text-align: center; | |||
} | |||
.thumbactiv:hover { | |||
box-shadow: 0 0 8px #E74C3C; | |||
-webkit-transition:box-shadow 0.2s ease-in-out; | |||
-moz-transition: box-shadow 0.2s ease-in-out; | |||
-o-transition: box-shadow 0.2s ease-in-out; | |||
transition: box-shadow 0.2s ease-in-out; | |||
} | |||
.small .ic-eingabe .inner-block { | |||
vertical-align: -moz-middle-with-baseline; | |||
vertical-align: -webkit-baseline-middle; | |||
} | |||
.strikethrough::before { | |||
position: absolute; | |||
content: ""; | |||
left: 0; | |||
top: 50%; | |||
right: 0; | |||
border-top: 3px solid; | |||
border-color: red; | |||
-webkit-transform: rotate(-20deg); | |||
-moz-transform: rotate(-20deg); | |||
-ms-transform: rotate(-20deg); | |||
-o-transform: rotate(-5deg); | |||
transform: rotate(-15deg); | |||
} | |||
.code { | |||
overflow: scroll; | |||
scrollbar-color:red grey; | |||
} | |||
.img-container.Wechselbild { | |||
opacity: 0; | |||
position: absolute; | |||
top: 0; | |||
transition: opacity 300ms ease; | |||
-moz-transition: opacity 300ms ease; | |||
-webkit-transition: opacity 300ms ease; | |||
-o-transition: opacity 300ms ease; | |||
} | |||
/*** *** Übernahme in SASS im nächsten Release *** ***/ | |||
.mw-body { | |||
margin-top: -24px; | |||
} | } | ||
/*** Formatierung Breakpoint ***/ | |||
@media (min-width: 768px) { | |||
.padding-md-x-2 { | |||
padding: 16px 8px; | |||
} | |||
} /*** Ende Formatierung Breakpoint ***/ | |||
/*** Formatierung Breakpoint ***/ | |||
@media (min-width: 992px) { | |||
.padding-lg-4 { | |||
padding: 18px; | |||
} | |||
} /*** Ende Formatierung Breakpoint ***/ | |||
/*** Formatierung Breakpoint xl ***/ | |||
@media (min-width:1200px) { | |||
.padding-xl-8 { | |||
padding: 36px; | |||
} | |||
} /*** Ende Formatierung Breakpoint xl ***/ | |||
/*** *** Ende für nächstes Release *** ***/ | |||
/**** Glyphicons Sondergröße ******/ | |||
/** Das muss hier stehen, da das bereinigte css keine background-position-xy kennt **/ | |||
.glyphicons-size-50 { | |||
background-size:950px; | |||
width:50px; | |||
height:50px; | |||
} | |||
.glyphicons-size-50.glyphicons-user, | |||
.glyphicons-size-50.glyphicons-envelope, | |||
.glyphicons-size-50.glyphicons-heart, | |||
.glyphicons-size-50.glyphicons-print, | |||
.glyphicons-size-50.glyphicons-search, | |||
.glyphicons-size-50.glyphicons-pencil, | |||
.glyphicons-size-50.glyphicons-pie-chart, | |||
.glyphicons-size-50.glyphicons-group, | |||
.glyphicons-size-50.glyphicons-router, | |||
.glyphicons-size-50.glyphicons-star { | |||
background-position-y:-100px; | |||
} | |||
.glyphicons-size-50.glyphicons-link, | |||
.glyphicons-size-50.glyphicons-alarm, | |||
.glyphicons-size-50.glyphicons-clock, | |||
.glyphicons-size-50.glyphicons-history, | |||
.glyphicons-size-50.glyphicons-power, | |||
.glyphicons-size-50.glyphicons-refresh, | |||
.glyphicons-size-50.glyphicons-message-full, | |||
.glyphicons-size-50.glyphicons-cogwheel, | |||
.glyphicons-size-50.glyphicons-cogwheels, | |||
.glyphicons-size-50.glyphicons-folder-open { | |||
background-position-y:-200px; | |||
} | |||
.glyphicons-size-50.glyphicons-folder-plus, | |||
.glyphicons-size-50.glyphicons-more-windows, | |||
.glyphicons-size-50.glyphicons-step-backward, | |||
.glyphicons-size-50.glyphicons-play, | |||
.glyphicons-size-50.glyphicons-stop, | |||
.glyphicons-size-50.glyphicons-step-forward, | |||
.glyphicons-size-50.glyphicons-download-alt, | |||
.glyphicons-size-50.glyphicons-question-sign, | |||
.glyphicons-size-50.glyphicons-info-sign, | |||
.glyphicons-size-50.glyphicons-ban-circle { | |||
background-position-y:-300px; | |||
} | |||
.glyphicons-size-50.glyphicons-lock, | |||
.glyphicons-size-50.glyphicons-unlock, | |||
.glyphicons-size-50.glyphicons-ok, | |||
.glyphicons-size-50.glyphicons-remove, | |||
.glyphicons-size-50.glyphicons-resize-small, | |||
.glyphicons-size-50.glyphicons-resize-full, | |||
.glyphicons-size-50.glyphicons-circle-arrow-left, | |||
.glyphicons-size-50.glyphicons-circle-arrow-right, | |||
.glyphicons-size-50.glyphicons-chevron-right, | |||
.glyphicons-size-50.glyphicons-chevron-left { | |||
background-position-y:-400px; | |||
} | |||
.glyphicons-size-50.glyphicons-retweet-2, | |||
.glyphicons-size-50.glyphicons-zoom-in, | |||
.glyphicons-size-50.glyphicons-zoom-out, | |||
.glyphicons-size-50.glyphicons-rotation-lock, | |||
.glyphicons-size-50.glyphicons-flag, | |||
.glyphicons-size-50.glyphicons-share-alt, | |||
.glyphicons-size-50.glyphicons-pushpin, | |||
.glyphicons-size-50.glyphicons-bullhorn, | |||
.glyphicons-size-50.glyphicons-cloud-upload, | |||
.glyphicons-size-50.glyphicons-cloud-download { | |||
background-position-y:-500px; | |||
} | |||
.glyphicons-size-50.glyphicons-restart, | |||
.glyphicons-size-50.glyphicons-new-window-alt, | |||
.glyphicons-size-50.glyphicons-plus, | |||
.glyphicons-size-50.glyphicons-minus, | |||
.glyphicons-size-50.glyphicons-undo, | |||
.glyphicons-size-50.glyphicons-wrench, | |||
.glyphicons-size-50.glyphicons-folder-closed, | |||
.glyphicons-size-50.glyphicons-floppy-disk, | |||
.glyphicons-size-50.glyphicons-floppy-saved, | |||
.glyphicons-size-50.glyphicons-server { | |||
background-position-y:-600px; | |||
} | |||
.glyphicons-size-50.glyphicons-menu-hamburger, | |||
.glyphicons-size-50.glyphicons-user-ban, | |||
.glyphicons-size-50.glyphicons-user-key, | |||
.glyphicons-size-50.glyphicons-chevron-up, | |||
.glyphicons-size-50.glyphicons-chevron-down, | |||
.glyphicons-size-50.glyphicons-temperature, | |||
.glyphicons-size-50.glyphicons-skull, | |||
.glyphicons-size-50.glyphicons-copy-to-clipboard { | |||
background-position-y:-700px; | |||
} | |||
.glyphicons-size-50.glyphicons-router-customized-no-wlan, | |||
.glyphicons-size-50.glyphicons-warning-sign-customized-orange, | |||
.glyphicons-size-50.glyphicons-step-forward-customized-down, | |||
.glyphicons-size-50.glyphicons-step-forward-customized-up, | |||
.glyphicons-size-50.glyphicons-download-alt-customized-upload, | |||
.glyphicons-size-50.glyphicons-play-button-customized-down, | |||
.glyphicons-size-50.glyphicons-play-button-customized-up, | |||
.glyphicons-size-50.glyphicons-arrow-right-customized-white, | |||
.glyphicons-size-50.glyphicons-menu-hamburger-customized-cancelled { | |||
background-position-y:-900px; | |||
} | |||
.glyphicons-size-50.glyphicons-user, | |||
.glyphicons-size-50.glyphicons-link, | |||
.glyphicons-size-50.glyphicons-folder-plus, | |||
.glyphicons-size-50.glyphicons-lock, | |||
.glyphicons-size-50.glyphicons-retweet-2, | |||
.glyphicons-size-50.glyphicons-restart, | |||
.glyphicons-size-50.glyphicons-menu-hamburger, | |||
.glyphicons-size-50.glyphicons-router-customized-no-wlan { | |||
background-position-x:0px; | |||
} | |||
.glyphicons-size-50.glyphicons-envelope, | |||
.glyphicons-size-50.glyphicons-alarm, | |||
.glyphicons-size-50.glyphicons-more-windows, | |||
.glyphicons-size-50.glyphicons-unlock, | |||
.glyphicons-size-50.glyphicons-zoom-in, | |||
.glyphicons-size-50.glyphicons-new-window-alt, | |||
.glyphicons-size-50.glyphicons-user-ban, | |||
.glyphicons-size-50.glyphicons-warning-sign-customized-orange { | |||
background-position-x:-100px; | |||
} | |||
.glyphicons-size-50.glyphicons-heart, | |||
.glyphicons-size-50.glyphicons-clock, | |||
.glyphicons-size-50.glyphicons-step-backward, | |||
.glyphicons-size-50.glyphicons-ok, | |||
.glyphicons-size-50.glyphicons-zoom-out, | |||
.glyphicons-size-50.glyphicons-plus, | |||
.glyphicons-size-50.glyphicons-user-key, | |||
.glyphicons-size-50.glyphicons-step-forward-customized-down { | |||
background-position-x:-200px; | |||
} | |||
.glyphicons-size-50.glyphicons-print, | |||
.glyphicons-size-50.glyphicons-history, | |||
.glyphicons-size-50.glyphicons-play, | |||
.glyphicons-size-50.glyphicons-remove, | |||
.glyphicons-size-50.glyphicons-rotation-lock, | |||
.glyphicons-size-50.glyphicons-minus, | |||
.glyphicons-size-50.glyphicons-chevron-up, | |||
.glyphicons-size-50.glyphicons-step-forward-customized-up { | |||
background-position-x:-300px; | |||
} | |||
.glyphicons-size-50.glyphicons-search, | |||
.glyphicons-size-50.glyphicons-power, | |||
.glyphicons-size-50.glyphicons-stop, | |||
.glyphicons-size-50.glyphicons-resize-small, | |||
.glyphicons-size-50.glyphicons-flag, | |||
.glyphicons-size-50.glyphicons-undo, | |||
.glyphicons-size-50.glyphicons-chevron-down, | |||
.glyphicons-size-50.glyphicons-download-alt-customized-upload { | |||
background-position-x:-400px; | |||
} | |||
.glyphicons-size-50.glyphicons-pencil, | |||
.glyphicons-size-50.glyphicons-refresh, | |||
.glyphicons-size-50.glyphicons-step-forward, | |||
.glyphicons-size-50.glyphicons-resize-full, | |||
.glyphicons-size-50.glyphicons-share-alt, | |||
.glyphicons-size-50.glyphicons-wrench, | |||
.glyphicons-size-50.glyphicons-temperature, | |||
.glyphicons-size-50.glyphicons-play-button-customized-down { | |||
background-position-x:-500px; | |||
} | |||
.glyphicons-size-50.glyphicons-pie-chart, | |||
.glyphicons-size-50.glyphicons-message-full, | |||
.glyphicons-size-50.glyphicons-download-alt, | |||
.glyphicons-size-50.glyphicons-circle-arrow-left, | |||
.glyphicons-size-50.glyphicons-pushpin, | |||
.glyphicons-size-50.glyphicons-folder-closed, | |||
.glyphicons-size-50.glyphicons-skull, | |||
.glyphicons-size-50.glyphicons-play-button-customized-up { | |||
background-position-x:-600px; | |||
} | |||
.glyphicons-size-50.glyphicons-group, | |||
.glyphicons-size-50.glyphicons-cogwheel, | |||
.glyphicons-size-50.glyphicons-question-sign, | |||
.glyphicons-size-50.glyphicons-circle-arrow-right, | |||
.glyphicons-size-50.glyphicons-bullhorn, | |||
.glyphicons-size-50.glyphicons-floppy-disk, | |||
.glyphicons-size-50.glyphicons-copy-to-clipboard, | |||
.glyphicons-size-50.glyphicons-arrow-right-customized-white { | |||
background-position-x:-700px; | |||
} | |||
.glyphicons-size-50.glyphicons-router, | |||
.glyphicons-size-50.glyphicons-cogwheels, | |||
.glyphicons-size-50.glyphicons-info-sign, | |||
.glyphicons-size-50.glyphicons-chevron-right, | |||
.glyphicons-size-50.glyphicons-cloud-upload, | |||
.glyphicons-size-50.glyphicons-floppy-saved, | |||
.glyphicons-size-50.glyphicons-menu-hamburger-customized-cancelled { | |||
background-position-x:-800px; | |||
} | |||
.glyphicons-size-50.glyphicons-star, | |||
.glyphicons-size-50.glyphicons-folder-open, | |||
.glyphicons-size-50.glyphicons-ban-circle, | |||
.glyphicons-size-50.glyphicons-chevron-left, | |||
.glyphicons-size-50.glyphicons-cloud-download, | |||
.glyphicons-size-50.glyphicons-server { | |||
background-position-x:-900px; | |||
} | |||
/**** Glyphicons Sondergröße ******/ | |||
Zeile 120: | Zeile 629: | ||
caption { | caption { | ||
/* Tabellenbeschriftung, die mit |+ formatiert werden, werden oberhalb der Tabelle angezeigt. | |||
Der Toggle erscheint direkt daneben */ | |||
caption-side: top; | |||
caption-side: top-outside; | |||
width: 800px; /* Damit wird eine ausreichende Breite für MS-Browser formatiert. */ | |||
width: max-content; /* Alle Anderen können vernünftiges css */ | |||
} | |||
.spgridtr { | .spgridtr { | ||
background-color:white; | |||
color: #222; | |||
margin: 0em 0; | |||
border: 0; | |||
border-collapse: collapse; | |||
} | |||
.spgridtr th { | .spgridtr th { | ||
background-color: #eaecf0; | |||
border: 1px solid #a2a9b1; | |||
} | |||
.spgridtr td { | .spgridtr td { | ||
background-color: #f8f9fa; | |||
border: 1px solid #a2a9b1; | |||
padding: 0.2em 0.1em; | |||
line-height:1.4; | |||
} | |||
.spgridtr .Leerzeile { | .spgridtr .Leerzeile { | ||
border-left: 0; | |||
border-right: 0; | |||
background: white; | |||
} | |||
.bild2 { | .bild2 { | ||
Zeile 171: | Zeile 679: | ||
.spgridtr { | .spgridtr { | ||
background-color:white; | |||
color: #222; | |||
margin: 0em 0; | |||
border: 0; | |||
width: 100%; | width: 100%; | ||
} | |||
.spgridtr td { | .spgridtr td { | ||
background-color: #f8f9fa; | |||
border: 1px solid #a2a9b1; | |||
padding: 0.2em 0.1em; | |||
line-height:1.4; | |||
} | |||
.spgridtr > * > tr > th { | .spgridtr > * > tr > th { | ||
float: left; | |||
padding-left: 1px; | |||
padding-right: 0.4em; | |||
background-color: #eaecf0; | |||
border: 1px solid #a2a9b1; | |||
padding: 0.2em 0.1em; | |||
line-height:1.4; | |||
width: calc(95% / (var(--me-nn) - 1)); | |||
} | |||
.spgridtr { | .spgridtr { | ||
border-collapse: separate; | |||
border-spacing: 0.3em; | |||
} | |||
.spgridtr > * > tr > th:nth-child(1) { | .spgridtr > * > tr > th:nth-child(1) { | ||
display: block; | |||
width:95%; | |||
text-align: left; | |||
padding-left: 1px; | |||
padding-right: 0.4em; | |||
} | |||
.spgridtr > * > tr > th:nth-child(2) { | .spgridtr > * > tr > th:nth-child(2) { | ||
text-align:left; | |||
} | } | ||
.spgridtr .Leerzeile { | .spgridtr .Leerzeile { | ||
border-left: 0; | |||
border-right: 0; | |||
background: white; | |||
} | |||
.spgridtr tbody > tr { | .spgridtr tbody > tr { | ||
Zeile 224: | Zeile 732: | ||
grid-template-columns: var(--me-width-2,calc((95% - var(--me-width-3,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-3,calc((95% - var(--me-width-2,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-4,calc((100% - var(--me-width-2,0%) - var(--me-width-3,0%)) / var(--Spalten,var(--me-n,3)))); | grid-template-columns: var(--me-width-2,calc((95% - var(--me-width-3,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-3,calc((95% - var(--me-width-2,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-4,calc((100% - var(--me-width-2,0%) - var(--me-width-3,0%)) / var(--Spalten,var(--me-n,3)))); | ||
width: 100%; | width: 100%; | ||
} | } | ||
.spgridtr tbody > tr:first-child { | .spgridtr tbody > tr:first-child { | ||
display: table-row; | display: table-row; | ||
width: 100%; | width: 100%; | ||
} | } | ||
.spgridtr td:nth-child(1) { | .spgridtr td:nth-child(1) { | ||
Zeile 238: | Zeile 746: | ||
margin-top: 5px; | margin-top: 5px; | ||
text-align: left; | text-align: left; | ||
} | } | ||
.spgridtr tr > td:nth-child(2) { | .spgridtr tr > td:nth-child(2) { | ||
Zeile 247: | Zeile 755: | ||
text-align: center; | text-align: center; | ||
vertical-align: middle; | vertical-align: middle; | ||
} | } | ||
.spgridtr tr > td:nth-child(3) { | .spgridtr tr > td:nth-child(3) { | ||
Zeile 254: | Zeile 762: | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
} | } | ||
.spgridtr tr > td:nth-child(4) { | .spgridtr tr > td:nth-child(4) { | ||
Zeile 261: | Zeile 769: | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
} | } | ||
.sptable3 tbody > tr { | .sptable3 tbody > tr { | ||
Zeile 267: | Zeile 775: | ||
grid-template-columns: var(--me-width-2,15%) calc(100% - var(--me-width-2,15%)); | grid-template-columns: var(--me-width-2,15%) calc(100% - var(--me-width-2,15%)); | ||
width: 100%; | width: 100%; | ||
} | } | ||
caption { | caption { | ||
/* Tabellenbeschriftung, die mit |+ formatiert werden, werden oberhalb der Tabelle angezeigt. | |||
Der Toggle erscheint direkt daneben */ | |||
caption-side: top; | |||
caption-side: top-outside; | |||
width: auto; | |||
display: run-in; /* Greetings to IE */ | |||
display: inline-grid; | |||
} | |||
}/*** Ende Formatierungen für Breakpoint xs ***/ | |||
/***** Beginn @media Print *****/ | |||
@media print { | |||
#main-header { | |||
display: none; | |||
color: red; | |||
} | |||
.jump-to-nav { | |||
display: none; | |||
} | |||
} | } /***** Ende @media Print *****/ |
Version vom 28. Februar 2024, 10:23 Uhr
{{DISPLAYTITLE:Common.css}}{{#vardefinse:headerIcon|fal fa-fw fa-wrench}} /* CSS an dieser Stelle wirkt sich auf alle Skins aus */ /*** Browserweiche für MS ***/ .ms-only { /* moderne Browser sehen das nicht !*/ display: none; } .img-container { display: flow-root; max-width: fit-content; } _:-ms-lang(x), _:-webkit-full-screen, .ms-only { /* Edge */ display: block; color:red; } _:-ms-lang(x), .ms-only { /* IE10 + IE11 */ display: block; color: white; background: red; border: 5px solid green; line-height: 2em; width: 100%; padding: 10px; font-size: 2em; } /*** Ende Browserweiche ***/ /*** Formatierungen für Alle ***/ #siteSub { display: none; } .dev { display: none; } #p-search #searchform label span.form-icon-prefix { height: 2.65em; } /* .toc { display: block; /*max-width: 48%; */ float: right; margin-left: 3%; font-size:95%; line-height: 125%; } */ .toctogglespan { display: inline-flex; } table { width: unset; } :root { --me-width: 32%; } .embedvideo { display: inline-block; float: inline-end; } .glyphicons { display: inline-block; /*opacity: 1;*/ } body { font-family: Helvetica,Verdana,Arial,sans-serif; font-size: 13px; color: black; background-color: #b40001; text-align: justify; background-position: top center; background-repeat: no-repeat; line-height: 18px; } .bodyContent, .menu-vertical, .mw-editfont-monospace { font-size: 16px; } .mw-body { margin-top: -24px; } code { color: black; display: inline-block; padding: 2px; } img { display: inline-block; } .flexelement.items_n { width: var(--me-width); align-items: stretch; border: 0; padding: 0px; background-color: white; font-size: 110%; text-align: left; /*overflow: hidden;*/ margin: 2px 10px 1px 0px; flex-wrap: wrap; } .de { {{#vardefine: sp-wiki-lang | de }} } .en { {{#vardefine: sp-wiki-lang | en }} } .language { display: none; } h1 i, h2 i, h3 i, h4 i { color: unset; font-size: unset !important; position: unset; top: unset; margin-right: unset; } a:visited { color: #F1948A; } a:hover { color: #e74c3c; text-decoration: underline; } a.external { color: #e74c3c; } a[href].external { color: #e74c3c; } a.external:visited { color: #F1948A; } a[href].external:visited { color: #F1948A; } a.new { color: magenta; } a[href].new { color: magenta; } a.new:visited { color: magenta; } a[href].new:visited { color: magenta; } table tr td { padding: unset; } .right { float: inline-end; } .ui-icon { position: relative; background-image: url("/images/d/d4/Ui-icons.png"); width: 16px; height: 16px; display: inline-block; } .cb::after { background-position: -80px -224px; position: relative; background-image: url(/images/d/d4/Ui-icons.png); width: 16px; height: 16px; display: inline-block; } .sp-icons-cpu { position: relative; background-image: url("/images/7/72/Cpu.svg"); display: inline-block; } .sp-icons-x2 { height: 35px; width: 35px; background-size: 35px; } .sp-icons-x3 { height: 50px; width: 50px; background-size: 50px; } .portlet-icon-ram-info { position: relative; background-image: url("/images/b/b1/App-ram-info.svg"); display: inline-block; } .portlet-icon-dhcp-info { position: relative; background-image: url("/images/8/8e/App-dhcp-info.svg"); display: inline-block; } .portlet-icon-interfaces-info { position: relative; background-image: url("/images/d/d4/App-interfaces-info.svg"); display: inline-block; } .SPicon-awp { position: relative; background-image: url("/images/d/d5/Icon-security-awareness.svg"); width: 16px; height: 16px; display: inline-block; } .icon-save-and-restart { position: relative; background-image: url(/images/6/64/Save-and-restart.svg); width: 1.3em; height: 1.3em; display: inline-block; background-size: contain; background-repeat: no-repeat; top: 0.1em; } .key-skeleton-gear-white { position: relative; background-image: url("/images/9/9f/Key-skeleton-gear-white.svg"); display: inline-block; width: 1.3em; height: 1.3em; top: 0.1em; background-size: contain !important; background-repeat: no-repeat; filter: brightness(0.27); } i.subicon { padding-left: 2em; } i.subicon ~ span{ padding-left: 1em; } .available, .icon.available { width: -webkit-fill-available; width: -moz-available; } .mw-parser-output [class*="color-box-shadow"].Hinweis-Container__einblenden, .mw-parser-output [class*="color-box-shadow"].Hinweis-Container__einblenden__block { /* display: flex; */ max-width: fit-content; align-items: center; } .Hinweis-Container__einblenden__inline-flex { display: inline-flex; margin-right: 3px; max-width: fit-content; } .thumbactiv { box-shadow: 0 0 8px #ddd; -webkit-transition: box-shadow 0.2s ease-in-out; -moz-transition: box-shadow 0.2s ease-in-out; -o-transition: box-shadow 0.2s ease-in-out; transition: box-shadow 0.2s ease-in-out; margin-right: 1em; margin-bottom: 2em; text-align: center; } .thumbactiv:hover { box-shadow: 0 0 8px #E74C3C; -webkit-transition:box-shadow 0.2s ease-in-out; -moz-transition: box-shadow 0.2s ease-in-out; -o-transition: box-shadow 0.2s ease-in-out; transition: box-shadow 0.2s ease-in-out; } .small .ic-eingabe .inner-block { vertical-align: -moz-middle-with-baseline; vertical-align: -webkit-baseline-middle; } .strikethrough::before { position: absolute; content: ""; left: 0; top: 50%; right: 0; border-top: 3px solid; border-color: red; -webkit-transform: rotate(-20deg); -moz-transform: rotate(-20deg); -ms-transform: rotate(-20deg); -o-transform: rotate(-5deg); transform: rotate(-15deg); } .code { overflow: scroll; scrollbar-color:red grey; } .img-container.Wechselbild { opacity: 0; position: absolute; top: 0; transition: opacity 300ms ease; -moz-transition: opacity 300ms ease; -webkit-transition: opacity 300ms ease; -o-transition: opacity 300ms ease; } /*** *** Übernahme in SASS im nächsten Release *** ***/ .mw-body { margin-top: -24px; } /*** Formatierung Breakpoint ***/ @media (min-width: 768px) { .padding-md-x-2 { padding: 16px 8px; } } /*** Ende Formatierung Breakpoint ***/ /*** Formatierung Breakpoint ***/ @media (min-width: 992px) { .padding-lg-4 { padding: 18px; } } /*** Ende Formatierung Breakpoint ***/ /*** Formatierung Breakpoint xl ***/ @media (min-width:1200px) { .padding-xl-8 { padding: 36px; } } /*** Ende Formatierung Breakpoint xl ***/ /*** *** Ende für nächstes Release *** ***/ /**** Glyphicons Sondergröße ******/ /** Das muss hier stehen, da das bereinigte css keine background-position-xy kennt **/ .glyphicons-size-50 { background-size:950px; width:50px; height:50px; } .glyphicons-size-50.glyphicons-user, .glyphicons-size-50.glyphicons-envelope, .glyphicons-size-50.glyphicons-heart, .glyphicons-size-50.glyphicons-print, .glyphicons-size-50.glyphicons-search, .glyphicons-size-50.glyphicons-pencil, .glyphicons-size-50.glyphicons-pie-chart, .glyphicons-size-50.glyphicons-group, .glyphicons-size-50.glyphicons-router, .glyphicons-size-50.glyphicons-star { background-position-y:-100px; } .glyphicons-size-50.glyphicons-link, .glyphicons-size-50.glyphicons-alarm, .glyphicons-size-50.glyphicons-clock, .glyphicons-size-50.glyphicons-history, .glyphicons-size-50.glyphicons-power, .glyphicons-size-50.glyphicons-refresh, .glyphicons-size-50.glyphicons-message-full, .glyphicons-size-50.glyphicons-cogwheel, .glyphicons-size-50.glyphicons-cogwheels, .glyphicons-size-50.glyphicons-folder-open { background-position-y:-200px; } .glyphicons-size-50.glyphicons-folder-plus, .glyphicons-size-50.glyphicons-more-windows, .glyphicons-size-50.glyphicons-step-backward, .glyphicons-size-50.glyphicons-play, .glyphicons-size-50.glyphicons-stop, .glyphicons-size-50.glyphicons-step-forward, .glyphicons-size-50.glyphicons-download-alt, .glyphicons-size-50.glyphicons-question-sign, .glyphicons-size-50.glyphicons-info-sign, .glyphicons-size-50.glyphicons-ban-circle { background-position-y:-300px; } .glyphicons-size-50.glyphicons-lock, .glyphicons-size-50.glyphicons-unlock, .glyphicons-size-50.glyphicons-ok, .glyphicons-size-50.glyphicons-remove, .glyphicons-size-50.glyphicons-resize-small, .glyphicons-size-50.glyphicons-resize-full, .glyphicons-size-50.glyphicons-circle-arrow-left, .glyphicons-size-50.glyphicons-circle-arrow-right, .glyphicons-size-50.glyphicons-chevron-right, .glyphicons-size-50.glyphicons-chevron-left { background-position-y:-400px; } .glyphicons-size-50.glyphicons-retweet-2, .glyphicons-size-50.glyphicons-zoom-in, .glyphicons-size-50.glyphicons-zoom-out, .glyphicons-size-50.glyphicons-rotation-lock, .glyphicons-size-50.glyphicons-flag, .glyphicons-size-50.glyphicons-share-alt, .glyphicons-size-50.glyphicons-pushpin, .glyphicons-size-50.glyphicons-bullhorn, .glyphicons-size-50.glyphicons-cloud-upload, .glyphicons-size-50.glyphicons-cloud-download { background-position-y:-500px; } .glyphicons-size-50.glyphicons-restart, .glyphicons-size-50.glyphicons-new-window-alt, .glyphicons-size-50.glyphicons-plus, .glyphicons-size-50.glyphicons-minus, .glyphicons-size-50.glyphicons-undo, .glyphicons-size-50.glyphicons-wrench, .glyphicons-size-50.glyphicons-folder-closed, .glyphicons-size-50.glyphicons-floppy-disk, .glyphicons-size-50.glyphicons-floppy-saved, .glyphicons-size-50.glyphicons-server { background-position-y:-600px; } .glyphicons-size-50.glyphicons-menu-hamburger, .glyphicons-size-50.glyphicons-user-ban, .glyphicons-size-50.glyphicons-user-key, .glyphicons-size-50.glyphicons-chevron-up, .glyphicons-size-50.glyphicons-chevron-down, .glyphicons-size-50.glyphicons-temperature, .glyphicons-size-50.glyphicons-skull, .glyphicons-size-50.glyphicons-copy-to-clipboard { background-position-y:-700px; } .glyphicons-size-50.glyphicons-router-customized-no-wlan, .glyphicons-size-50.glyphicons-warning-sign-customized-orange, .glyphicons-size-50.glyphicons-step-forward-customized-down, .glyphicons-size-50.glyphicons-step-forward-customized-up, .glyphicons-size-50.glyphicons-download-alt-customized-upload, .glyphicons-size-50.glyphicons-play-button-customized-down, .glyphicons-size-50.glyphicons-play-button-customized-up, .glyphicons-size-50.glyphicons-arrow-right-customized-white, .glyphicons-size-50.glyphicons-menu-hamburger-customized-cancelled { background-position-y:-900px; } .glyphicons-size-50.glyphicons-user, .glyphicons-size-50.glyphicons-link, .glyphicons-size-50.glyphicons-folder-plus, .glyphicons-size-50.glyphicons-lock, .glyphicons-size-50.glyphicons-retweet-2, .glyphicons-size-50.glyphicons-restart, .glyphicons-size-50.glyphicons-menu-hamburger, .glyphicons-size-50.glyphicons-router-customized-no-wlan { background-position-x:0px; } .glyphicons-size-50.glyphicons-envelope, .glyphicons-size-50.glyphicons-alarm, .glyphicons-size-50.glyphicons-more-windows, .glyphicons-size-50.glyphicons-unlock, .glyphicons-size-50.glyphicons-zoom-in, .glyphicons-size-50.glyphicons-new-window-alt, .glyphicons-size-50.glyphicons-user-ban, .glyphicons-size-50.glyphicons-warning-sign-customized-orange { background-position-x:-100px; } .glyphicons-size-50.glyphicons-heart, .glyphicons-size-50.glyphicons-clock, .glyphicons-size-50.glyphicons-step-backward, .glyphicons-size-50.glyphicons-ok, .glyphicons-size-50.glyphicons-zoom-out, .glyphicons-size-50.glyphicons-plus, .glyphicons-size-50.glyphicons-user-key, .glyphicons-size-50.glyphicons-step-forward-customized-down { background-position-x:-200px; } .glyphicons-size-50.glyphicons-print, .glyphicons-size-50.glyphicons-history, .glyphicons-size-50.glyphicons-play, .glyphicons-size-50.glyphicons-remove, .glyphicons-size-50.glyphicons-rotation-lock, .glyphicons-size-50.glyphicons-minus, .glyphicons-size-50.glyphicons-chevron-up, .glyphicons-size-50.glyphicons-step-forward-customized-up { background-position-x:-300px; } .glyphicons-size-50.glyphicons-search, .glyphicons-size-50.glyphicons-power, .glyphicons-size-50.glyphicons-stop, .glyphicons-size-50.glyphicons-resize-small, .glyphicons-size-50.glyphicons-flag, .glyphicons-size-50.glyphicons-undo, .glyphicons-size-50.glyphicons-chevron-down, .glyphicons-size-50.glyphicons-download-alt-customized-upload { background-position-x:-400px; } .glyphicons-size-50.glyphicons-pencil, .glyphicons-size-50.glyphicons-refresh, .glyphicons-size-50.glyphicons-step-forward, .glyphicons-size-50.glyphicons-resize-full, .glyphicons-size-50.glyphicons-share-alt, .glyphicons-size-50.glyphicons-wrench, .glyphicons-size-50.glyphicons-temperature, .glyphicons-size-50.glyphicons-play-button-customized-down { background-position-x:-500px; } .glyphicons-size-50.glyphicons-pie-chart, .glyphicons-size-50.glyphicons-message-full, .glyphicons-size-50.glyphicons-download-alt, .glyphicons-size-50.glyphicons-circle-arrow-left, .glyphicons-size-50.glyphicons-pushpin, .glyphicons-size-50.glyphicons-folder-closed, .glyphicons-size-50.glyphicons-skull, .glyphicons-size-50.glyphicons-play-button-customized-up { background-position-x:-600px; } .glyphicons-size-50.glyphicons-group, .glyphicons-size-50.glyphicons-cogwheel, .glyphicons-size-50.glyphicons-question-sign, .glyphicons-size-50.glyphicons-circle-arrow-right, .glyphicons-size-50.glyphicons-bullhorn, .glyphicons-size-50.glyphicons-floppy-disk, .glyphicons-size-50.glyphicons-copy-to-clipboard, .glyphicons-size-50.glyphicons-arrow-right-customized-white { background-position-x:-700px; } .glyphicons-size-50.glyphicons-router, .glyphicons-size-50.glyphicons-cogwheels, .glyphicons-size-50.glyphicons-info-sign, .glyphicons-size-50.glyphicons-chevron-right, .glyphicons-size-50.glyphicons-cloud-upload, .glyphicons-size-50.glyphicons-floppy-saved, .glyphicons-size-50.glyphicons-menu-hamburger-customized-cancelled { background-position-x:-800px; } .glyphicons-size-50.glyphicons-star, .glyphicons-size-50.glyphicons-folder-open, .glyphicons-size-50.glyphicons-ban-circle, .glyphicons-size-50.glyphicons-chevron-left, .glyphicons-size-50.glyphicons-cloud-download, .glyphicons-size-50.glyphicons-server { background-position-x:-900px; } /**** Glyphicons Sondergröße ******/ /*** Ende Formatierungen für Alle ***/ /*** Formatierungen Standard (=Monitor) ***/ caption { /* Tabellenbeschriftung, die mit |+ formatiert werden, werden oberhalb der Tabelle angezeigt. Der Toggle erscheint direkt daneben */ caption-side: top; caption-side: top-outside; width: 800px; /* Damit wird eine ausreichende Breite für MS-Browser formatiert. */ width: max-content; /* Alle Anderen können vernünftiges css */ } .spgridtr { background-color:white; color: #222; margin: 0em 0; border: 0; border-collapse: collapse; } .spgridtr th { background-color: #eaecf0; border: 1px solid #a2a9b1; } .spgridtr td { background-color: #f8f9fa; border: 1px solid #a2a9b1; padding: 0.2em 0.1em; line-height:1.4; } .spgridtr .Leerzeile { border-left: 0; border-right: 0; background: white; } .bild2 { display: inline-block; min-width: max-content; } /*** Ende Formatierungen Standard ***/ /*** Formatierung Breakpoint sm ***/ @media (max-width: 576px) { .spgridtr { background-color:white; color: #222; margin: 0em 0; border: 0; width: 100%; } .spgridtr td { background-color: #f8f9fa; border: 1px solid #a2a9b1; padding: 0.2em 0.1em; line-height:1.4; } .spgridtr > * > tr > th { float: left; padding-left: 1px; padding-right: 0.4em; background-color: #eaecf0; border: 1px solid #a2a9b1; padding: 0.2em 0.1em; line-height:1.4; width: calc(95% / (var(--me-nn) - 1)); } .spgridtr { border-collapse: separate; border-spacing: 0.3em; } .spgridtr > * > tr > th:nth-child(1) { display: block; width:95%; text-align: left; padding-left: 1px; padding-right: 0.4em; } .spgridtr > * > tr > th:nth-child(2) { text-align:left; } .spgridtr .Leerzeile { border-left: 0; border-right: 0; background: white; } .spgridtr tbody > tr { display: grid; grid-template-columns: var(--me-width-2,calc((95% - var(--me-width-3,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-3,calc((95% - var(--me-width-2,0%) - var(--me-width-4,0%)) / var(--me-n,4))) var(--me-width-4,calc((100% - var(--me-width-2,0%) - var(--me-width-3,0%)) / var(--Spalten,var(--me-n,3)))); width: 100%; } .spgridtr tbody > tr:first-child { display: table-row; width: 100%; } .spgridtr td:nth-child(1) { grid-column: 1 / var(--me-nn,3); grid-row: 2; background-color: #eaecf0; border: 1px solid #a2a9b1; margin-top: 5px; text-align: left; } .spgridtr tr > td:nth-child(2) { grid-column: 1; grid-row: 3; background-color: #f8f9fa; border: 1px solid #a2a9b1; text-align: center; vertical-align: middle; } .spgridtr tr > td:nth-child(3) { grid-column: 2; grid-row: 3; background-color: #f8f9fa; border: 1px solid #a2a9b1; } .spgridtr tr > td:nth-child(4) { grid-column: 3; grid-row: 3; background-color: #f8f9fa; border: 1px solid #a2a9b1; } .sptable3 tbody > tr { display: grid; grid-template-columns: var(--me-width-2,15%) calc(100% - var(--me-width-2,15%)); width: 100%; } caption { /* Tabellenbeschriftung, die mit |+ formatiert werden, werden oberhalb der Tabelle angezeigt. Der Toggle erscheint direkt daneben */ caption-side: top; caption-side: top-outside; width: auto; display: run-in; /* Greetings to IE */ display: inline-grid; } }/*** Ende Formatierungen für Breakpoint xs ***/ /***** Beginn @media Print *****/ @media print { #main-header { display: none; color: red; } .jump-to-nav { display: none; } } /***** Ende @media Print *****/