/*** Tabellenlayout: 2-Spaltig, jede 2. Zeile als Überschrift ***/ /*** Formatierungen für Alle ***/ .language { display: initial; } .language:not(.inline) { display: none; } .startbox-head:not(.greenalert) > :first-child { position: absolute; } .startbox-head > h4 + .end { text-align: right; width: 100%; } .startbox-head .spc__default { position: relative; top: -0.6em; vertical-align: top; } /* a { color: #1b599b; } a:visited { color: #636; } */ .padding10 td { padding: 10px !important; } ul { margin-bottom: 0.3em; list-style: none; margin-top: 3px; } dl { /* padding-top: 1em !important; padding-bottom: 0px !important; */ margin-bottom: 0px !important; break-inside: avoid; /* margin-top: 1em; */ } ul li { break-inside: avoid; } dt { margin: 0; font-weight: bold; margin-bottom: 0em; } dd { margin-top: 0.3em; margin-bottom: 0em; margin-left: 16px; font-style: italic; color: rgba(0,0,0,0.9); text-align: left; } .noitalic dd { font-style: unset; } .startbox .Release + div > ul > li::before, .startbox .Release > ul > li::before { left: 0; margin-right: 0.5em; } .startbox ul > li:before { font-family: 'Font Awesome 6 Pro'; content: "\f0a9"; font-size: 12px; color: rgb(231, 76, 60); /* position: absolute; */ left: -1.4em; margin-right: -1.0em; font-weight: 900; position: inherit; } .startbox ul li { padding-left: 1.5em; display: flow-root; position: relative; left: 0px; } .startbox ul > * > ul { margin-left: -0.25em; } .list--element__bullet li::before, li.list--element__bullet::before, .startbox .list--element__bullet li::before, .startbox.new.star .list--element__bullet li::before, .startbox li.list--element__bullet::before, .list--element__alert .bullet li::before, .startbox-body .bullet li::before { font-family: 'Font Awesome 6 Pro'; content: "\f111"; font-size: 6px; left: -3em; } .greenalert li:before { font-family: 'Font Awesome 6 Pro'; content: "\f071"; font-size: 12px; color: rgb(2,90,0);; position: absolute; left: 1.5em; margin-right: 1em; font-weight: 400; top: 2.25em } .startbox-head li { list-style: none; } .startbox-head.greenalert li:before { font-size: 2em; } .startbox-head.greenalert li { padding-left: 2.75em; } .startbox-head.greenalert { padding: 1em; margin-top: 0px; } /* .startbox-body-breit li { padding-left: 20px; display: block; position: relative; } */ /****** Kann wieder raus, wenn in scss _position_ entfernt ******/ .angel li::before { position: unset; } .mw-collapsible .mw-collapsible-toggle-default::after { content: ""; } /***** *****/ .new li:before { font-family: 'Font Awesome 6 Pro'; content: "\f013"; font-size: 0.7em; color: rgb(2,90,0); /* position: absolute; */ left: 0px; top: 4px; margin-right: 1em; font-weight: 300; } .new.star li:before { font-family: 'Font Awesome 6 Pro'; content: "\f005"; font-size: 0.7em; color: #468847; top: unset; font-weight: 900; } .new li.edit:before { font-family: 'Font Awesome 6 Pro'; content: "\f040"; font-size: 0.7em; color: #f0ad4e; position: absolute; left: 0px; top: 4px; margin-right: 1em; font-weight: 300; } .new .gelb li:before { color: #f0ad4e; } .newtext { position: absolute; left: -2em; top: -0.65em; width: 5em; text-align: center; font-size: 0.5em; color: rgb(2,90,0); display: inline-block; margin-right: -2em; } .new .startbox-head [class*=fa-] { font-size: 1.5em; padding: 0 0.5em; } .spgrid { background-color:white; color: #222; margin: 1em 0em; width: 100%; } .spgrid td { background-color: #f8f9fa; padding: 0.2em 0.1em; line-height:1.4; } .spgrid .Leerzeile { border-left: 0; border-right: 0; background: white; } .spgrid tr { display: grid; grid-template-columns: 50% 50%; width: 100%; } .spgrid .colspan2 { border-right: 0!important; } .startbox { display: block; background: #fff; /* border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; border-left: 1px solid #a2a9b1; */ /* margin: 10px 5px 0px 5px; */ box-shadow: 0 0 0 1px rgba(0,0,0,0.05); border-radius: 3px 3px 0px 0px; margin: 15px; flex-grow: 2; flex-shrink: 2; flex-basis: calc((100% - 91px)/3); } .startbox.breit { min-width: 500px; flex-grow: 2; flex-shrink: 0; flex-basis: calc(((100% - 91px) / 3) * 2 + 30px); } .startbox-body-breit { column-count: 2; column-gap: calc( 2em + 20px); column-rule: thin solid rgba(0,0,0,0.1); padding: 1em; } .startbox-head { background-color: #eaecf0; min-height: 3em; padding: 1em; display: flex; justify-content:space-between; } .startbox-head .spc__circle-big { display: inline-flex; } .startbox-body { padding: 1em; } .startbox-body-breit-col { width: 45%; } .changelog { column-count: 3; column-gap: calc( 2em + 20px); column-rule: thin solid rgba(0,0,0,0.1); padding: 1em; } .startbox-body .Hinweis-Container.Hinweis-Container__einblenden { display: contents; } .Hinweis-Container--Text-bordered { display: inline-block; padding: 0px 3px; } .mw-headline { display: inline-block; } /*** Ende Formatierungen für Alle ***/ /*** Formatierungen Standard (=Monitor) ***/ @media (min-width:769px) { table { border: 0; } .startbox { margin: 15px; min-width: 300px; } .startbox-flex { display: flex; flex-flow: wrap; } .startbox-changelog { width: 830px; } .startbox-flex.max-content { width: unset; max-width: max-content; min-width: 830px; } .startbox-body .startbox-flex { width: 768px; } .wikitable2 tr:nth-child(2n) { background: green!important; } .spgrid tr > td:nth-child(1) { padding: 15px; grid-column: 1 / 2; grid-row: 1; background-color: #eaecf0; /* border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; border-left: 1px solid #a2a9b1; */ margin: 10px 5px 0px 5px; box-shadow: 0 0 0 1px rgba(0,0,0,0.05); border-radius: 3px 3px 0px 0px; } .spgrid tr > td:nth-child(2) { padding: 15px; grid-column: 2 / 3; grid-row: 1; background-color: #eaecf0; /* border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; */ margin: 10px 5px 0px 5px; box-shadow: 0 0 0 1px rgba(0,0,0,0.05); border-radius: 3px; } .spgrid tr > td:nth-child(3) { padding: 15px; grid-column: 1 / 2; grid-row: 2; /* background-color: #f8f9fa; border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; border-left: 1px solid #a2a9b1; */ border-spacing: 5px; margin: 0px 5px 10px 5px; box-shadow: 0 0 0 1px rgba(0,0,0,0.05); border-radius: 0px 0px 3px 3px; background: #fff; } .spgrid tr > td:nth-child(4) { padding: 15px; grid-column: 2 / 3; grid-row: 2; /* background-color: #f8f9fa; border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; */ border-spacing: 5px; margin: 0px 5px 10px 5px; box-shadow: 0 0 0 1px rgba(0,0,0,0.05); border-radius: 0px 0px 3px 3px; background: #fff; } .spgrid tr:last-child > td:nth-child(3) { padding: 15px; grid-column: 1 / 2; grid-row: 2; background-color: #f8f9fa; border-top: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; border-bottom: 1px solid #a2a9b1; border-left: 1px solid #a2a9b1; } .spgrid tr:last-child > td:nth-child(4) { padding: 15px; grid-column: 2 / 3; grid-row: 2; background-color: #f8f9fa; border-top: 1px solid #a2a9b1; border-bottom: 1px solid #a2a9b1; border-right: 1px solid #a2a9b1; } h4 { font-size:16px; font-weight: bolder; color: rgba(0,0,0,0.7); } h5 { margin-bottom: 0; margin-top: 16px; font-weight: bold; font-size: 16px; color: rgba(0,0,0,0.7); } .startbox-body h5:first-child { margin-top: 0px; } .startbox-body-breit dl:first-child h5 { margin-top: 0px; } .toctitle { display: none; } .toc { border: 0; background: unset; padding-top: 0px; } .toc ul { margin-top: 0px; } .tocnumber { display: none !important; } .toclimit-1 { margin-left: 11em; } .TOC3 { float: right; } .TOC3 .mw-collapsible-content { display: block; } .text-h1.h-box:empty { display: none; } .startbox-body .Einrücken { margin-left: 1.5em; } } /*** Ende Formatierungen Standard ***/ /*** Formatierungen für Breakpoint md ***/ @media (max-width:768px) { .startbox { margin: 15px 0px; min-width: 100%; } .startbox.breit { margin: 15px 0px; width: 100%; min-width: 0; } .startbox-body-breit { column-count: 1; } .TOC3 .mw-collapsible-toggle { min-width: 100%; } .TOC3 .mw-collapsible-toggle-default::before { content: "\f25a"; font-family: "Font Awesome 6 Pro"; font-weight: 300; } } /*** Ende Formatierungen Breakpoint md ***/ /*** Formatierungen für Breakpoint xs ***/ @media (max-width:576px) { table { border: 0; } .startbox-flex { display: flex; flex-flow: wrap; } .startbox-flex.max-content { min-width: unset; } .max-content { min-width: unset; } .startbox-body .startbox-flex { } .Einrücken2 { margin-left: 16px; } .spgrid tr > td:nth-child(1) { padding: 15px; grid-column: 1 / 3; grid-row: 1; background-color: #eaecf0; border: 1px solid #a2a9b1; border-bottom: 0; margin-top: 5px; } .spgrid tr > td:nth-child(2) { padding: 15px; grid-column: 1 / 3; grid-row: 3; background-color: #eaecf0; border: 1px solid #a2a9b1; border-bottom: 0; margin-top: 5px; } .spgrid tr > td:nth-child(3), .spgrid tr:last-child > td:nth-child(3) { padding-top: 15px; grid-column: 1 / 3; grid-row: 2; background-color: #f8f9fa; border: 1px solid #a2a9b1; } .spgrid tr > td:nth-child(4), .spgrid tr:last-child > td:nth-child(4) { padding-top: 15px; grid-column: 1 / 3; grid-row: 4; background-color: #f8f9fa; border: 1px solid #a2a9b1; } .spgrid .colspan2 { border-right: 1px solid #a2a9b1!important; } .spgrid .frei { display: none; } .spgrid .noborderbottom { border-bottom: 0!important; } .spgrid .nobordertop { border-top: 0!important; } .TOC3 ~ ul { display: none; } .TOC3 .toctogglecheckbox:checked ~ ul { display: block; } .nomobil { display: none; } } /*** Ende Formatierungen für Breakpoint xs ***/ /*** Übersetzungen für Ausklapp Schaltflächen ***/ /*** UTM ***/ .translate.S2E + .language.german.inline + div + span > * > span.mw-collapsible-toggle-collapsed >.mw-collapsible-text::after { content: "Alle Artikel zu Roadwarrior Verbindungen"; } .translate.S2E + div + .language.english.inline + span > * > span.mw-collapsible-toggle-collapsed > .mw-collapsible-text::after { content: "All articles about Roadwarrior Connections"; } .translate.S2S + .language.german.inline + div + span > * > span.mw-collapsible-toggle-collapsed >.mw-collapsible-text::after { content: "Artikel zu S2S Verbindungen"; } .translate.S2S + div + .language.english.inline + span > * > span.mw-collapsible-toggle-collapsed > .mw-collapsible-text::after { content: "All articles about S2S Connections"; } /* .translate + .language.german.inline + div + span > * > span.mw-collapsible-toggle-expanded > .mw-collapsible-text::after */ .mw-collapsible-toggle-expanded > .mw-collapsible-text:lang(de)::after { content: "ausblenden"; } .translate + div + .language.english.inline + span > * > span.mw-collapsible-toggle-expanded > .mw-collapsible-text::after, .mw-collapsible-toggle-expanded > .mw-collapsible-text:lang(en)::after { content: "hide"; } .translate_enrollment .mw-collapsed > * > .mw-collapsible-text:lang(de)::before{ content: "Veraltete Enrollmentmethoden einblenden"; } .translate_enrollment .mw-collapsed > * > .mw-collapsible-text:lang(en)::before{ content: "Show obsolete enrollment methods"; } .Uebersicht_Profilreiter .mw-collapsed > * > .mw-collapsible-text:lang(de)::before{ content: "Übersicht der einzelnen Profilreiter einblenden"; } .Uebersicht_Profilreiter .mw-collapsed > * > .mw-collapsible-text:lang(en)::before{ content: "Show overview of the individual profile tabs"; } .Einbau_Hardware * .mw-collapsed > * > .mw-collapsible-text:lang(de)::before { content: "Einbau in G3/G5 Hardware"; color: #e52b2b; } .Einbau_Hardware * .mw-collapsed > * > .mw-collapsible-text:lang(en)::before { content: "Installation on G3/G5 Hardware"; color: #e52b2b; } /*** Ende UTM ***/ /*** Ende Übersetzungen für Ausklapp Schaltflächen ***/
Vorlage:Styles-Startseiten.css
Aus Securepoint Wiki