Benutzer:Mabba/common.css

aus Wikipedia, der freien Enzyklopädie

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Internet Explorer/Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
  • Opera: Strg+F5
__INDEX__
Auf dieser Seite sammle ich einige nützliche '''CSS-Formatierungen''', die du in [[Spezial:Meine Benutzerseite/common.css|deine common.css]] einfügen kannst.

== Bunte Signaturen normal darstellen ==
Wer sich von den Spielkindern, die meinen durch ihre Signatur mehr auffallen zu müssen als durch ihre Beiträge, genau so gestört fühlt wie ich, kann mit dem folgenden CSS ein wenig für Abhilfe sorgen (eventuell steht in meiner [[Benutzer:Schnark/vector.css|vector.css]] eine bereits aktualisierte Fassung)
<syntaxhighlight lang="css">
/*Farben, Schrift*/
a[href*="/wiki/Benutzer:"],
a[href*="/wiki/Benutzer_Diskussion:"],
a[href*="/wiki/Benutzerin:"],
a[href*="/wiki/Benutzerin_Diskussion:"] {
text-shadow: none !important;
border: none !important;
background: transparent !important;
}
a[href*="/wiki/Benutzer:"] *,
a[href*="/wiki/Benutzer_Diskussion:"] *,
a[href*="/wiki/Benutzerin:"] *,
a[href*="/wiki/Benutzerin_Diskussion:"] * {
font: inherit !important;
text-decoration: inherit !important;
text-shadow: inherit !important;
color: inherit !important;
border: inherit !important;
background: inherit !important;
}

/*Bilder*/
img[alt="Miniauge2.gif"] {display: none;} /*Ralf Roletschek*/
</syntaxhighlight>

== Zurücksetzen-Links entfernen ==
Wer schon einmal versehentlich auf einen Zurücksetzen-Link geklickt hat, will diese vielleicht entfernen. Wenn man einen Versionsunterschied betrachtet, ist der Link aber durchaus hilfreich. Der folgende CSS-Code blendet diese Links überall aus, nur bei Versionsunterschieden ist er rot unterlegt zu sehen:
<syntaxhighlight lang="css">
/* Zurücksetzen-Link nur bei Versionsunterschieden rot hinterlegt anzeigen */
.mw-rollback-link { display: none; }
.diff-ntitle .mw-rollback-link { display: inline; background-color: #FFC0C0; }
</syntaxhighlight>

Eine Javascript-Alternative ist das [[Benutzer:Revolus/monobook.js/safe-rollback.js|Skript von Revolus]].

== Hinweis zum Urheberrecht beim Bearbeiten entfernen ==
Nachdem man den Hinweis unter dem Bearbeiten-Feld gelesen und verstanden hat, will man ihn höchstwahrscheinlich nicht mehr sehen, ausblenden kann man ihn mit:
<syntaxhighlight lang="css">
#editpage-copywarn, .mw-tos-summary { display:none; } /*Zur Kenntnis genommen*/
</syntaxhighlight>

== Neue-Nachrichten-Balken ==
Entweder ist der Balken zu unauffällig oder zu auffällig. Vielleicht gefällt dir ja meine Version, zentriert und rot unterstrichen:
<syntaxhighlight lang="css">
.usermessage {
  background-color: #e0e8ff;
  border-style:none;
  border-bottom: 2px solid red;
  width:100%;
  margin:-1em 0 1em 0;
  padding:.5em 0;
  text-align:center;
}
</syntaxhighlight>

Und wer gefälschte Neue-Nachrichten-Balken sofort als solche erkennen will, färbt diese anders:
<syntaxhighlight lang="css">
#mw-content-text .usermessage {                /*falsche "Neue Nachrichten"*/
background-color: white;
border: 2px solid #ff5500;
margin: .5em;
padding: .5em;
}
</syntaxhighlight>

== Benutzerleiste und Reiter fixieren ==
Wer im Vector-Skin die Zeile mit den Links auf die eigene Benutzerseite und die Reiter fixieren will, kann den folgenden CSS-Code verwenden:
<syntaxhighlight lang="css">
/* Benutzerleiste und Reiter fixieren */
#p-personal {
  position: fixed; z-index: 2;
  width: 100%; left: 0em; height: 5em; 
  background-color: white; }
#p-personal ul {
  margin-right: 11em;
  float: right; }
#left-navigation {
  position: fixed; z-index: 2;
  left: 10em; }
#right-navigation {
  position: fixed; z-index: 2;
  right: 0em; }
</syntaxhighlight>

== Linkfarben ==
Das folgende CSS (nur Vector-Skin) färbt alle internen und externen Links im gleichen Blauton (externe Links erkennt man am entsprechenden Symbol), externe Links ohne Symbol (also auf Wikipedia selbst und den Toolserver) sowie Interwiki-Links im Textkörper grün, fehlende Seiten rot. Unbesuchte Links sind etwas heller, nur in der Navigation haben besuchte und unbesuchte Links den gleichen Farbton.
<syntaxhighlight lang="css">
div#content a.external:link, /* externe Links selbe Farbe wie interne Links,
                                                     Symbol daneben reicht */
div#content a:link          {color: #0645ad;}             /* interne Links */
div#content a.external:visited,
div#content a:visited       {color: #0b0080;}
div#content a.new           {color: #ba0000;}           /* fehlende Seiten */
div#content a.new:visited   {color: #a55858;}
div#content a.external[href^="//"] { /* protokoll-relative Links markieren */
 background: url(//bits.wikimedia.org/skins/vector/images/link-icon.png) center right no-repeat;
 padding-right: 13px;
}
div#content a.external[href^="//de.wikipedia.org"],
div#content a.external[href^="http://de.wikipedia.org"],
div#content a.external[href^="https://de.wikipedia.org"],
div#content a.external[href^="https://secure.wikimedia.org/wikipedia/de/"],
div#content a.external[href^="//toolserver.org"],
div#content a.external[href^="http://toolserver.org"],
div#content a.external[href^="https://toolserver.org"],
div#content a.extiw         {color: #059416;  /* Interwikilinks etc. im Text */
     background: none; padding-right: 0;}
div#content a.external[href^="//de.wikipedia.org"]:visited,
div#content a.external[href^="http://de.wikipedia.org"]:visited,
div#content a.external[href^="https://de.wikipedia.org"]:visited,
div#content a.external[href^="https://secure.wikimedia.org/wikipedia/de/"]:visited,
div#content a.external[href^="//toolserver.org"]:visited,
div#content a.external[href^="http://toolserver.org"]:visited,
div#content a.external[href^="https://toolserver.org"]:visited,
div#content a.extiw:visited {color: #047b12;}
div#content a.external[href^="http://de.wikipedia.org"],
div#content a.external[href^="https://de.wikipedia.org"],
div#content a.external[href^="https://secure.wikimedia.org/wikipedia/de/"],
div#content a.external[href^="http://toolserver.org"],
div#content a.external[href^="https://toolserver.org"],
div#content a.external[href^="http://de.wikipedia.org"]:visited,
div#content a.external[href^="https://de.wikipedia.org"]:visited,
div#content a.external[href^="https://secure.wikimedia.org/wikipedia/de/"]:visited,
div#content a.external[href^="http://toolserver.org"]:visited,
div#content a.external[href^="https://toolserver.org"]:visited
{text-decoration: underline;} /* nicht relative Links unterstreichen */
div#mw-head a:link, div#mw-head a:visited, /* Navigation */
div#mw-panel a:link, div#mw-panel a:visited,
div#footer a:link, div#footer a:visited
                            {color: #0645ad !important;} /* immer wie unbesuchte darstellen
                                             important ist notwendig, da in der Navigation
                                  Selektoren mit absurd hoher Spezifität verwendet werden */
div#mw-head li.new a:link, div#mw-head li.new a:visited
                            {color: #ba0000 !important;}
div#content .wikiEditor-ui-toolbar .tool-select *,
body div#mw-head div.vectorTabs li.selected a {color:#333333 !important;} /* zurück zum Standard */
a:active                    {color: #fad000 !important;}
</syntaxhighlight>

== Interwikilinks auf wichtige Sprachen hervorheben ==
Mit <syntaxhighlight lang="css" enclose="none">.interwiki-en { font-weight: bold; }</syntaxhighlight> lassen sich die Interwikilinks auf die englische Wikipedia hervorheben, analog natürlich auch andere Sprachen.

== Ungesehene Änderungen ==
Auf der Beobachtungsliste und in Versionsgeschichten beobachteter Seiten werden ungesehene Änderungen hervorgehoben, allerdings viel zu auffällig für meinen Geschmack. Ein kleiner Kringel reicht auch:
<syntaxhighlight lang="css">
.updatedmarker {display: none;}
.mw-history-line-updated input + a::before {content: "°";}
.mw-special-Watchlist .mw-changeslist-line-watched .mw-title {font-weight: normal;}
.mw-special-Watchlist .mw-changeslist-line-watched .mw-title::before {content: "°";}
#mw-watchlist-resetbutton ul {display:none;}
#mw-watchlist-resetbutton {float:right; display:inline}
#mw-watchlist-resetbutton + hr {clear:right;}
</syntaxhighlight>

== Siehe auch ==
* [[Wikipedia:Technik/Skin/CSS]]