MediaWiki:Common.css: Unterschied zwischen den Versionen

Version vom 24. März 2024, 01:14 Uhr

/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */

/* CSS for hiding and showing paragraphs after checkboxes */
/* this is here because templatestyles doesn't allow some of the tricks used here */
/* to be used with Vorlage:CheckBox and Vorlage:CSSMarker */

/* hide paragraphs containing .hide-when-checked when a checkbox in the previous paragraph is checked */
:has(> input:checked) + :has(> .hide-when-checked) {
  display: none;
}

/* hide paragraphs containing .hide-when-unchecked when a checkbox in the previous paragraph is unchecked */
:has(> input:not(:checked)) + :has(> .hide-when-unchecked) {
  display: none;
}

/* ensure .hide-when-unchecked is still visible in the editor */
[contenteditable="true"] :has(> input:not(:checked)) + :has(> .hide-when-unchecked) {
  display: revert;
}

/* hide paragraphs containing .show-when-all-checked when at least one checkbox in a previous paragraph is unchecked */
:has(> input:not(:checked)) ~ :has(> .show-when-all-checked) {
  display: none;
}

/* ensure .show-when-all-checked is still visible in the editor */
[contenteditable="true"] :has(> input:not(:checked)) ~ :has(> .show-when-all-checked)  {
  display: revert;
}

/* show paragraphs containing .hide-when-all-checked by default */
:has(> .hide-when-all-checked) {
  display: none;
}

/* show paragraphs containing .hide-when-all-checked when at least one checkbox in a previous paragraph is unchecked */
:has(> input:not(:checked)) ~ :has(> .hide-when-all-checked) {
  display: revert;
}

/* CSS for showing CSS Markers in the visual editor */
/* this is here because templatestyles aren't loaded properly in the editor it seems */
/* to be used with Vorlage:CSSMarker */

/* make markers invisible on pages */
.marker {
  display: none;
}

/* make markers visible in editors */
[contenteditable="true"] .marker {
  display: revert;
  border: 1px solid gray;
  border-radius: .2em;
  padding-left: .2em;
  padding-right: .2em;
  background-color: lightgray;
}