MediaWiki:Common.css: Unterschied zwischen den Versionen

Zeile 273: Zeile 273:
@media (max-width: 767px) {.sectionflex.col2 > div, .sectionflex.col3 > div {flex-basis:100%; margin-top:2em}}
@media (max-width: 767px) {.sectionflex.col2 > div, .sectionflex.col3 > div {flex-basis:100%; margin-top:2em}}
/*Aufzählungszeichen fortlaufend nummerieren */
/*Aufzählungszeichen fortlaufend nummerieren  
.mw-content-ltr ol, .ve-ce-branchNode ol{ counter-reset: item; margin-left:1.5em }
.mw-content-ltr ol, .ve-ce-branchNode ol{ counter-reset: item; margin-left:1.5em }
.mw-content-ltr ol li { display: block }
.mw-content-ltr ol li { display: block }
Zeile 279: Zeile 279:
.ve-ce-branchNode  ol li p { display: inline}  
.ve-ce-branchNode  ol li p { display: inline}  

Version vom 4. Juli 2022, 12:10 Uhr

@import url(;
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
h2 {margin: 1.8em 0 1.2em 0;}
/*Discussions and attachments currently not in use in the helpdesk, therfore hiding for no */

/* bootstrap icons in blue and big */
.bi-big {font-size: 2rem; color: #2b80ea}

#data-after-content {display: none;}
table {font-size: var(--content-font-size);}
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {padding: 0.8em 0.4em;} { content: 'neu!'; vertical-align: super; background: #64b334; margin-left: 3px;font-size: 10px;padding: 2px 5px; border-radius: 50%;
.flexbox div{margin:5px;padding:2px 8px;text-align:center;background:#ececec}
.center > div.thumb {margin-top:2em}
#content .toctitle h2 {margin-right: 1em; display: inline;font-size: 1.4rem;}
.qtip {font-size: 1em;line-height: 1.4em;}

/*Related links */
{border-left: solid 4px #d8d8d9;
color: #868585;
margin-top: 3rem;
margin-bottom:0 !important;
padding: 20px 10px 2px 30px;
.relatedtopics {
flex-wrap: wrap;
border-left: solid 4px #d8d8d9;
padding: 2em !important;
margin:0  !important;
.relatedtopics .col{flex-basis: 50%; flex-grow: 1; flex-shrink: 1;}

.flexbox.themenhd div {background:#fff; border:1px solid #d8d8d9; padding:10px 20px; flex-basis:24%; text-align:left}
.flexbox.themenhd div [class*=" bi-"]::before {font-size: 1.6em; vertical-align: middle;background-color: #fff; padding: 6px; border-radius: 50%;}
.flexbox.themenhd  div [class*=" bi-"]::before {font-size:2em; vertical-align:middle; background-color:#f1f3f9; padding: 10px; }
.themenhd div a {display:block}
.themenhd div:hover {background:rgb(233,233,238,0.5)}
ul.smw-format.ul-format.alltopics-col {column-count: 3;}

/*Tours */
.nextstep {display: inline-block;padding: 6px;background: #36c;border-radius: 2px;color: #ffffff;font-weight: bold;}
#mw-content-text .nextstep a:not(.new), [class^="mw-content-"] .nextstep a:not(.new), #mw-content-text .nextstep a:link:not(.new), [class^="mw-content-"] .nextstep a:link:not(.new) {
    color: #ffffff;    font-weight: bold;}
#mw-content-text .nextstep a:not(.new):hover, #mw-content-text .nextstep a:link:not(.new):hover, [class^="mw-content-"] .nextstep a:link:not(.new):hover {
    color: #efefef;}
.nextstep a:not(.new)::after, .nextstep a:link:not(.new)::after {content: " \25B6";}

/*Main page*/
.flexbox-portal div > h2 span::before {vertical-align: text-bottom; size:1.1em;}
.mw-parser-output .flexbox-portal.col3 > div:nth-child(3n) {margin-right:0 !important}
#maintopics ul {list-style: none!important;}
#maintopics li {padding-bottom:0.6em!important;margin-left: 12px!important;}
#mpbanner {background:#fff url(/w/nsfr_img_auth.php/f/fa/BlueSpice-Demo_Header.jpg) -90px no-repeat; padding-bottom: 20px; background-size: 1000px 122px;}
#mpbanner-byline {font-size:1.8em; color:#3e5389;line-height: 0.8rem; padding-top: 20px;}
#mpbanner-title {font-size:3.4em; color:#3e5389; line-height:1.2em; font-weight: 900;letter-spacing: 1px;}
#maintopics h2 span::before {vertical-align: text-bottom;padding-bottom: 2px;}

/** Cards **/
.cards {display:flex; flex-wrap:wrap;  justify-content: space-around;}
.cards > div {flex-basis:290px; margin-bottom:50px; border-top: 1px solid #f0f0f0; box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
    transition: all .3s cubic-bezier(.25,.8,.25,1); cursor: pointer; text-align:center}
.cards > div:hover {
    box-shadow: 0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);
.cards a.image img {max-width:600px}
.cards .screenshot {width:300px;height:200px; overflow:hidden; border-top:14px solid #eee; border-bottom:14px solid #eee}
#content #bodyContent .cards h2 {margin:10px; padding:0; font-size:1.1rem; font-color:#444; border:none; text-align:center}
.cards h2 .mw-editsection {display:none}
.cards .text {font-size:0.85rem; padding:20px 10px; text-align:center; font-weight:bold;}
#mw-content-text text a:not(.new), [class^="mw-content-"] .text a:not(.new), #mw-content-text .text a:link:not(.new), [class^="mw-content-"] .text a:link:not(.new), #mw-content-text .text a:not(.new):visited, [class^="mw-content-"] .text a:not(.new):visited, #mw-content-text .text a:link:not(.new):visited, [class^="mw-content-"] .text a:link:not(.new):visited 
.cards .emptycard, .cards > div.emptycard:hover 
{border: 0;
box-shadow: none;}
.getButton {
    display: inline-block;
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 8px 20px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    margin: 0 0 10px 0;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    border-radius: 8px;}

#mw-content-text .getButton a:not(.new), [class^="mw-content-"] .getButton  a:not(.new), #mw-content-text .getButton  a:link:not(.new), [class^="mw-content-"] .getButton  a:link:not(.new), #mw-content-text .getButton a:not(.new):visited, [class^="mw-content-"] a:not(.new):visited, #mw-content-text .getButton a:link:not(.new):visited, [class^="mw-content-"] .getButton a:link:not(.new):visited
.getButton:hover {
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
.getButton:active {
.getButton a:before {font-family: 'fontawesome';
content: '\f019 ';
font-size: 1.3em;
vertical-align: middle;
margin-right: 10px;

.cart a:before {font-family: 'fontawesome';
content: '\f217 ';

.downloadarea {
display: inline-block;
float: right;
margin: 0 0 20px 40px;
padding: 10px;
background: #efefef;
background: linear-gradient(270deg, rgb(240, 240, 240) 0%, rgb(224, 224, 224) 52%, rgb(240, 240, 240) 100%);
.downloadarea p {margin:0}
@media only screen and (max-width: 768px)
{.cards > div {flex-basis:98%; }}

.headertabsbox  .oo-ui-panelLayout-framed {border: 0;}
.headertabsbox .oo-ui-tabSelectWidget-framed {border-bottom: 1px solid #d3d5da;}

/*HP Aktuelles */
#aktuelles {background: rgba(201, 224, 143, .3); padding:10px; margin:20px 0}
#aktuelles h2::before {font-family:'fontawesome'; font-size:0.8em; content:'\f02e'; color: #64b334; margin-right:10px}
#aktuelles h2 {margin: 8px 0 8px 24px; color: #454545; font-size: 1.4em; border-bottom: none; }
#aktuelles table {margin: 0 8px 15px 37px}
#aktuelles td {padding:3px 10px}
#aktuelles  [class^="bi-"]::before, #aktuelles [class*=" bi-"]::before {
  vertical-align: -0.125em;

/*Training Handout */
body.traininghandout {margin-right:1cm; margin-top:1cm;}
.traininghandout .toc  {border:0;}
.traininghandout h1 {visibility:hidden;}
.traininghandout p img, .traininghandout  img, .traininghandout a.image img {max-width:17cm !important; padding-left:10px;}
.traininghandout .arrow-icon {float: left; padding-left: 4px; padding-bottom: 0;}
.traininghandout #deckblatt h1,.traininghandout #deckblatt #firstHeading {visibility:hidden;}
.traininghandout h2 {border-bottom:1px solid grey;}
.traininghandout h3 {margin:24pt 0 24pt 0}
.traininghandout  p, .traininghandout ul {font-size:10pt; margin-top:0;}
.traininghandout ol > li {margin-bottom:0.25cm}
.traininghandout .toc ol > li {margin-bottom:12pt; border: 1px solid red;}
.traininghandout li {margin-bottom:0.3cm; font-size:10pt;margin-top:0; padding-top:0;}
.traininghandout table td ul {padding-left:16pt;}
.traininghandout .bookicon {margin:0;padding:0;}
.traininghandout .helpref img, .helpref img {vertical-align: baseline;}
.traininghandout img.fullwidth {width:16cm !important;}
table.padded td {padding:8px;}/*extra padding in table cells*/
/* indicate training transclusions in edit mode */
section ~ {background: #fffde2;}
section ~ {background: #f8f9fa;}
section ~ {background: #c5e8c9;}
section ~ {background: #e0ecf8;}
section ~ {background: #fff0dd;}

/*sample table designs */
table.portal {border-spacing: 20px 2px; border-collapse: separate;}
table.portalboxes {border-spacing: 20px; border-collapse: separate;}
table.portal th, table.portal td, table.portalboxes th, table.portalboxes td 
{padding:10px; border:0; vertical-align:top;}

.tblue th {background-color:#CADAEA;}
.tblue td {background-color:#E0ECF8;}

.tyellow th {background-color:#F7E1B2;}
.tyellow td {background-color:#E0ECF8;}

.twhite th {background-color:#787878; color:#FFF;}
.twhite td {background-color:#FFF;}

.tgrey th {background-color:#ACB1CF; color:#FFF;}
.tgrey td {background-color:#E6E7EB}

/** cropped image **/
img.responsive {width:100%;height:auto;}
.crop { max-height: 50px; overflow: hidden; }

/*Fixed table header */

.scrolltable table.jquery-tablesorter th.headerSort {background-position: 20px 112px;}

  /*width:100%; */
  display: block;
  empty-cells: show;
  /* Decoration */
  border-spacing: 0;
  border: 1px solid;

.table-scroll thead{
  background-color: #f1f1f1;  
  display: block;
  overflow-y: scroll;

.table-scroll tbody{
  /* Position */
  display: block; position:relative;
  width:100%; overflow-y:scroll;
  /* Decoration */
  border-top: 1px solid rgba(0,0,0,0.2);
   max-height: 50vh;

.table-scroll tr{
  width: 100%;
.table-scroll th{
.table-scroll td,.table-scroll th{
flex-grow: 2;
display: block;
padding: 5px;
text-align: right;
border-right: 1px solid #ccc;
.table-scroll td {text-align: center;}
.table-scroll th {text-align: right;}
/* Other options */

.table-scroll td:first-child,
.table-scroll th:first-child{
  writing-mode: unset;
.widefirst td:first-child,.widefirst th:first-child{  flex-basis:500px;}

.table-scroll tbody tr:nth-child(2n){
  background-color: rgba(130,130,170,0.1);
.mediawiki [class^="bi-"]::before, .mediawiki [class*=" bi-"]::before {
    vertical-align: -0.125em;
.mediawiki .bi-arrow-right-circle::before {vertical-align: -0.1em!important}

/* Styles for section cards */
.sectionflex {display: flex; flex-wrap: wrap; justify-content:space-between;}
.sectionflex.col1 > div {flex-basis:100%; padding:10px 20px 20px 20px; margin:10px 0;}
.sectionflex.col2 > div {flex-basis:49%; padding:10px 20px 20px 20px; margin:10px 0;}
.sectionflex.col3 > div {flex-basis:32%; padding:10px 20px 20px 20px; margin:10px 0;}
.sectionflex > div h2 {margin:0 0 1em 0; font-size:1.3em}
.sectionflex.frame > div {border: 1px solid #e7e7e7}
.sectionflex.background> div {background: #f1f3f9}
.sectionflex .ve-ce-branchNode-slug, {display:none}
@media (max-width: 767px) {.sectionflex.col2 > div, .sectionflex.col3 > div {flex-basis:100%; margin-top:2em}}

/*Aufzählungszeichen fortlaufend nummerieren 
.mw-content-ltr ol, .ve-ce-branchNode ol{ counter-reset: item; margin-left:1.5em }
.mw-content-ltr ol li { display: block }
.mw-content-ltr ol li:before, .ve-ce-branchNode ol li:before { content: counters(item, ".") "."; counter-increment: item; margin-right:0.5em  }
.ve-ce-branchNode  ol li p { display: inline} 


* {
 -webkit-print-color-adjust: exact !important;   /* Chrome, Safari */
 color-adjust: exact !important;                 /*Firefox*/

.bs-data-after-content, .mw-lingo-tooltip {display:none}
.slideNav {font-size:1rem}
.slideNext::after {font-family:"fontawesome"; content:"\f061"; color:blue; margin-left: 5px;}
.slidePrevious::before {font-family:"fontawesome"; content:"\f060"; color:blue; margin-right:5px;}
.slideHd h1 {border-bottom: 1px solid #e5e5e5;}
.main-footer {display:none;}
.slideBoxes {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
.slideBoxes > div {
    width: 45%;
    color: #242424;
    background-color: #f2f2f2;
    border-radius: 20px;
    padding: 4px 30px 30px 30px;
    margin: 15px;
.slideBoxes > div.empty {background:none;}
.slideBoxes.hdOnly > div.haslink {transition: all .3s cubic-bezier(.25,.8,.25,1); cursor: pointer;}
.slideBoxes.hdOnly > div.haslink:hover {box-shadow: 0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);}
.slideBoxes.hdOnly > div {padding:10px;}
.slideBoxes.col3 > div {width:30%;}
.slideBoxes.col1 > div {width:90%;}
#content #bodyContent .slideBoxes h2 {
border-bottom: 0px;
padding-bottom: 0;
margin-top: 10px;
margin-bottom: 0px;
color: #242424;
#content #bodyContent #mw-content-text .slideBoxes h2 {padding-left:68px; display:block; min-height:2em;}
#content #bodyContent #mw-content-text .slideBoxes.noicon h2 {padding-left:0;}
#content #bodyContent #mw-content-text .slideBoxes h2 a {color: #242424 !important;}

#content #bodyContent .slideBoxes p, #content #bodyContent .slideBoxes li {
.slideBoxes .fas,.slideBoxes .fab, .slideBoxes .fa {
    margin-right: 20px;
    vertical-align: sub;
.slidetext, .slidetext p, .slidetext div, .slidetext h3 {font-size:1.3rem;}
#slidecollection {width:100%;}
#slidecollection .slideNav {display:none;}
#slidecollection .slide {padding-top:30px; 
background:url('')top right no-repeat !important;
/* printstyles for presentation slides note- PDF export not working well, therefore use browser print function*/

/*Referenz Seiten */
.extension-infobox {width:25em;font-size:90%;background-color:#f1f3f9;color:black;margin-bottom:0.5em;margin-left:1em;padding:0.2em;float:right;clear:right;text-align:left;}
.extension-infobox-header{text-align:center;background-color:#2e6096;padding:8px; color:#ffffff;}
.extension-infobox-description{font-weight:normal!important;text-align:left;background-color:#f1f3f9;padding:20px 10px 20px 10px!important;}
.extension-infobox-first-row{vertical-align:top;padding:20px 10px 0 10px;}
.extension-infobox-row{vertical-align:top;padding:0 10px;}
.extension-infobox-last-row{vertical-align:top;padding:0 10px 20px 10px;}
.extension-infobox.fullwidth {width:100%; float:none;  font-size:1em; margin-left:0;}
.extension-infobox.fullwidth th {text-align:right; }
.extension-infobox-header, .extension-infobox-helppage {text-align:center !important; font-size:1.1em}
.extension-infobox.fullwidth th, .extension-infobox.fullwidth td {padding:8px;width:100px; border: 1px solid #ffffff;}
.extension-infobox.fullwidth td {width:300px; }
.extension-infobox-helppage { background-color: #eaecf0;}
/* #content #bodyContent #importdata h3 {margin:1em 0 1.4em;}
#importdata .flexbox {justify-content: space-between; margin-top: 2em;}
#mw-content-text #importdata .flexbox h3, [class^="mw-content-"] #importdata .flexbox h3 {background:#d8d8d9; margin:0 0  12px 0; padding:8px; font-size:1em !important; font-weight:bold}
#importdata .mw ul, .bs ul {margin:0}
#importdata .mw li {margin-left:0;list-style-type:none; padding-left:30px; background:  no-repeat left 1px top 3px / 18px url('/w/nsfr_img_auth.php/c/c6/MediaWiki-2020-small-icon.svg');}
#importdata .bs li {margin-left:0;list-style-type:none; padding-left:30px; background:  no-repeat left 2px top 4px / 15px url('/w/nsfr_img_auth.php/c/c4/Bluespice_Icon.svg');}
#importdata .flexbox div {background:#f1f3f9; text-align:left; margin:0; flex-basis:33%; padding:0}
#importdata table.wikitable > tr > th, #importdata table.wikitable > * > tr > th,  table.wikitable.reference > tr > th, .importdata .wikitable.reference > * > tr > th {background-color: #eaecf0;text-align: left;padding:8px; border: 1px solid #ffffff}
#importdata  table.wikitable > tr > td, #importdata  table.wikitable > * > tr > td, #importdata  table.wikitable.reference > tr > td, #importdata  table.wikitable.reference > * > tr > td {padding:8px;  border: 1px solid #ffffff;}
#importdata div .inner {padding:8px 12px}
#importdata .bs p {font-size: 0.9rem; margin-left: 2.1em; display:list-item;} */
Keine Kategorien vergebenBearbeiten