resources/src/mediawiki.skinning/content.externallinks.css

   1 /*!
   2  * Icons and colors for external links.
   3  */
   4
   5 /* Bug 66091 is blocking is from converting this file to LESS
   6  * and using the .background-image-svg mixin. */
   7
   8 /* SVG support using a transparent gradient to guarantee cross-browser
   9  * compatibility (browsers able to understand gradient syntax support also SVG).
  10  * http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique */
  11
  12 .mw-body a.external,
  13 .link-https {
  14         background: url(images/external-ltr.png) center right no-repeat;
  15         /* @embed */
  16         background-image: -webkit-linear-gradient(transparent, transparent), url(images/external-ltr.svg);
  17         /* @embed */
  18         background-image: linear-gradient(transparent, transparent), url(images/external-ltr.svg);
  19         padding-right: 15px;
  20 }
  21
  22 .mw-body a.external[href^="mailto:"],
  23 .link-mailto {
  24         background: url(images/mail.png) center right no-repeat;
  25         /* @embed */
  26         background-image: -webkit-linear-gradient(transparent, transparent), url(images/mail.svg);
  27         /* @embed */
  28         background-image: linear-gradient(transparent, transparent), url(images/mail.svg);
  29         padding-right: 15px;
  30 }
  31
  32 .mw-body a.external[href^="ftp://"],
  33 .link-ftp {
  34         background: url(images/ftp-ltr.png) center right no-repeat;
  35         /* @embed */
  36         background-image: -webkit-linear-gradient(transparent, transparent), url(images/ftp-ltr.svg);
  37         /* @embed */
  38         background-image: linear-gradient(transparent, transparent), url(images/ftp-ltr.svg);
  39         padding-right: 15px;
  40 }
  41
  42 .mw-body a.external[href^="irc://"],
  43 .mw-body a.external[href^="ircs://"],
  44 .link-irc {
  45         background: url(images/chat-ltr.png) center right no-repeat;
  46         /* @embed */
  47         background-image: -webkit-linear-gradient(transparent, transparent), url(images/chat-ltr.svg);
  48         /* @embed */
  49         background-image: linear-gradient(transparent, transparent), url(images/chat-ltr.svg);
  50         padding-right: 15px;
  51 }
  52
  53 .mw-body a.external[href$=".ogg"], .mw-body a.external[href$=".OGG"],
  54 .mw-body a.external[href$=".mid"], .mw-body a.external[href$=".MID"],
  55 .mw-body a.external[href$=".midi"], .mw-body a.external[href$=".MIDI"],
  56 .mw-body a.external[href$=".mp3"], .mw-body a.external[href$=".MP3"],
  57 .mw-body a.external[href$=".wav"], .mw-body a.external[href$=".WAV"],
  58 .mw-body a.external[href$=".wma"], .mw-body a.external[href$=".WMA"],
  59 .link-audio {
  60         background: url(images/audio-ltr.png) center right no-repeat;
  61         /* @embed */
  62         background-image: -webkit-linear-gradient(transparent, transparent), url(images/audio-ltr.svg);
  63         /* @embed */
  64         background-image: linear-gradient(transparent, transparent), url(images/audio-ltr.svg);
  65         padding-right: 15px;
  66 }
  67
  68 .mw-body a.external[href$=".ogm"], .mw-body a.external[href$=".OGM"],
  69 .mw-body a.external[href$=".avi"], .mw-body a.external[href$=".AVI"],
  70 .mw-body a.external[href$=".mpeg"], .mw-body a.external[href$=".MPEG"],
  71 .mw-body a.external[href$=".mpg"], .mw-body a.external[href$=".MPG"],
  72 .link-video {
  73         background: url(images/video.png) center right no-repeat;
  74         /* @embed */
  75         background-image: -webkit-linear-gradient(transparent, transparent), url(images/video.svg);
  76         /* @embed */
  77         background-image: linear-gradient(transparent, transparent), url(images/video.svg);
  78         padding-right: 15px;
  79 }
  80
  81 .mw-body a.external[href$=".pdf"], .mw-body a.external[href$=".PDF"],
  82 .mw-body a.external[href*=".pdf#"], .mw-body a.external[href*=".PDF#"],
  83 .mw-body a.external[href*=".pdf?"], .mw-body a.external[href*=".PDF?"],
  84 .link-document {
  85         background: url(images/document-ltr.png) center right no-repeat;
  86         /* @embed */
  87         background-image: -webkit-linear-gradient(transparent, transparent), url(images/document-ltr.svg);
  88         /* @embed */
  89         background-image: linear-gradient(transparent, transparent), url(images/document-ltr.svg);
  90         padding-right: 15px;
  91 }
  92
  93 /* Interwiki styling */
  94 .mw-body a.extiw,
  95 .mw-body a.extiw:active {
  96         color: #36b;
  97 }
  98
  99 /* External link color */
 100 .mw-body a.external {
 101         color: #36b;
 102 }