Vorlage:MediaWiki-Button/styles: Unterschied zwischen den Versionen

keine Bearbeitungszusammenfassung
(Die Seite wurde neu angelegt: „==CSS== .mw-ui-button { background-color: #f8f9fa; color: #222222; display: inline-block; box-sizing: border-box; min-width: 4em; max-width: 28.75…“)
 
Keine Bearbeitungszusammenfassung
 
Zeile 1: Zeile 1:
==CSS==
{{#tag:syntaxhighlight|{{Char|60}}templatestyles src="{{#ifeq:{{NAMESPACENUMBER}}|10||{{NAMESPACE}}:}}{{PAGENAME}}.css" />|lang=html}}
{{Dokumentation/ruler}}
{{#ifeq:{{NAMESPACENUMBER}}|10|
[[Kategorie:Vorlage:TemplateStyles]]
{{#ifexist:{{#rel2abs:{{FULLPAGENAME}}/..}}
  |<!--fein-->
  |{{#if:{{#rel2abs:{{FULLPAGENAME}}/..}}
  | [[Kategorie:Wikipedia:Vorlagenfehler/Vorlage:Dokumentation/verwaist]]
  | [[Kategorie:Wikipedia:Vorlagenfehler/Vorlage:Dokumentation/keine echte Unterseite]]
  }}
}}<!-- {{#invoke:Vorlage:Dokumentation|TemplateStyles|cat=Wikipedia:Vorlagenfehler/Vorlage:Dokumentation/TemplateStyles}} -->{{#ifeq: {{#titleparts:{{FULLPAGENAME}}|99|2}}|  styles|<!-- okay -->|<span class="error">Name der Unterseite der Hauptvorlage muss <code>styles</code> lauten</span>}}
}}{{#ifeq:{{{css|0}}}|1|{{#tag:templatestyles||src={{FULLPAGENAME}}.css}}}}</includeonly></onlyinclude>


.mw-ui-button {
{{Dokumentation/header}}
  background-color: #f8f9fa;
 
  color: #222222;
Kennzeichnung von [[Wikipedia:Vorlage|Vorlagen]]-Seiten, die zur Dokumentation von [[Hilfe:CSS/TemplateStyles|TemplateStyles]] dienen.
  display: inline-block;
 
  box-sizing: border-box;
Alle einschlägigen Unterseiten sollen mit <code>&lt;noinclude></code>{{Vorlage|Dokumentation/styleSeite}}<code>&lt;/noinclude></code> markiert werden.
  min-width: 4em;
 
  max-width: 28.75em;
Zur weiteren Vorgehensweise siehe [[Wikipedia:Technik/Skin/CSS/TemplateStyles]].
  margin: 0;
 
  padding: 0.546875em 1em;
== Parameter ==
  border: 1px solid #a2a9b1;
; css
  border-radius: 2px;
: <code>1</code> – diese TemplateStyles für diese Dokumentationsseite aktivieren
  font-family: inherit;
: <code>0</code> (Vorgabe) – Normalverhalten; keine Aktivierung
  font-size: 1em;
 
  font-weight: bold;
[[Kategorie:Vorlage:für Vorlagen| {{PAGENAME}}]]
  line-height: 1.286;
[[Kategorie:Vorlage:mit Kategorisierung/Vorlage]]
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
}
.mw-ui-button:visited {
  color: #222222;
}
.mw-ui-button:hover {
  background-color: #ffffff;
  color: #444444;
  border-color: #a2a9b1;
}
.mw-ui-button:focus {
  background-color: #ffffff;
  color: #222222;
  border-color: #3366cc;
  box-shadow: inset 0 0 0 1px #3366cc, inset 0 0 0 2px #ffffff;
  outline-width: 0;
}
.mw-ui-button:active,
.mw-ui-button.is-on {
  background-color: #c8ccd1;
  color: #000000;
  border-color: #72777d;
  box-shadow: none;
}
.mw-ui-button:disabled,
.mw-ui-button.mw-ui-quiet.mw-ui-progressive,
.mw-ui-button.mw-ui-quiet.mw-ui-destructive {
  background-color: #c8ccd1;
  color: #ffffff;
  border-color: #c8ccd1;
  cursor: default;
}
.mw-ui-button:disabled:hover,
.mw-ui-button.mw-ui-quiet.mw-ui-progressive:hover,
.mw-ui-button.mw-ui-quiet.mw-ui-destructive:hover,
.mw-ui-button:disabled:active,
.mw-ui-button.mw-ui-quiet.mw-ui-progressive:active,
.mw-ui-button.mw-ui-quiet.mw-ui-destructive:active {
  background-color: #c8ccd1;
  color: #ffffff;
  box-shadow: none;
  border-color: #c8ccd1;
}
.mw-ui-button:not( :disabled ) {
  transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
}
.mw-ui-button.mw-ui-quiet {
  background-color: transparent;
  color: #222222;
  border-color: transparent;
}
.mw-ui-button.mw-ui-quiet:hover {
  background-color: transparent;
  color: #444444;
  border-color: transparent;
  box-shadow: none;
}
.mw-ui-button.mw-ui-quiet:active {
  background-color: transparent;
  color: #000000;
  border-color: transparent;
}
.mw-ui-button.mw-ui-quiet:focus {
  background-color: transparent;
  color: #222222;
  border-color: transparent;
  box-shadow: none;
}
.mw-ui-button.mw-ui-quiet:disabled {
  background-color: transparent;
  color: #c8ccd1;
  border-color: transparent;
}
.mw-ui-button.mw-ui-progressive {
  background-color: #3366cc;
  color: #fff;
  border: 1px solid #3366cc;
}
.mw-ui-button.mw-ui-progressive:hover {
  background-color: #447ff5;
  border-color: #447ff5;
}
.mw-ui-button.mw-ui-progressive:focus {
  box-shadow: inset 0 0 0 1px #3366cc, inset 0 0 0 2px #ffffff;
}
.mw-ui-button.mw-ui-progressive:active,
.mw-ui-button.mw-ui-progressive.is-on {
  background-color: #2a4b8d;
  border-color: #2a4b8d;
  box-shadow: none;
}
.mw-ui-button.mw-ui-progressive:disabled {
  background-color: #c8ccd1;
  color: #fff;
  border-color: #c8ccd1;
}
.mw-ui-button.mw-ui-progressive:disabled:hover,
.mw-ui-button.mw-ui-progressive:disabled:active {
  background-color: #c8ccd1;
  color: #fff;
  border-color: #c8ccd1;
  box-shadow: none;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet {
  color: #3366cc;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet:hover {
  background-color: transparent;
  color: #447ff5;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet:active {
  color: #2a4b8d;
}
.mw-ui-button.mw-ui-progressive.mw-ui-quiet:focus {
  background-color: transparent;
  color: #3366cc;
}
.mw-ui-button.mw-ui-destructive {
  background-color: #dd3333;
  color: #fff;
  border: 1px solid #dd3333;
}
.mw-ui-button.mw-ui-destructive:hover {
  background-color: #ff4242;
  border-color: #ff4242;
}
.mw-ui-button.mw-ui-destructive:focus {
  box-shadow: inset 0 0 0 1px #dd3333, inset 0 0 0 2px #ffffff;
}
.mw-ui-button.mw-ui-destructive:active,
.mw-ui-button.mw-ui-destructive.is-on {
  background-color: #b32424;
  border-color: #b32424;
  box-shadow: none;
}
.mw-ui-button.mw-ui-destructive:disabled {
  background-color: #c8ccd1;
  color: #fff;
  border-color: #c8ccd1;
}
.mw-ui-button.mw-ui-destructive:disabled:hover,
.mw-ui-button.mw-ui-destructive:disabled:active {
  background-color: #c8ccd1;
  color: #fff;
  border-color: #c8ccd1;
  box-shadow: none;
}
.mw-ui-button.mw-ui-destructive.mw-ui-quiet {
  color: #dd3333;
}
.mw-ui-button.mw-ui-destructive.mw-ui-quiet:hover {
  background-color: transparent;
  color: #ff4242;
}
.mw-ui-button.mw-ui-destructive.mw-ui-quiet:active {
  color: #b32424;
}
.mw-ui-button.mw-ui-destructive.mw-ui-quiet:focus {
  background-color: transparent;
  color: #dd3333;
}
.mw-ui-button.mw-ui-big {
  font-size: 1.3em;
}
.mw-ui-button.mw-ui-block {
  display: block;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
a.mw-ui-button {
  text-decoration: none;
}
a.mw-ui-button:hover,
a.mw-ui-button:focus {
  text-decoration: none;
}
.mw-ui-button-group > * {
  min-width: 48px;
  border-radius: 0;
  float: left;
}
.mw-ui-button-group > *:first-child {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
.mw-ui-button-group > *:not( :first-child ) {
  border-left: 0;
}
.mw-ui-button-group > *:last-child {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}
.mw-ui-button-group .is-on .button {
  cursor: default;
}
1.308

Bearbeitungen