resources/src/mediawiki.diff.styles/diff.css

   1 /*!
   2  * Diff rendering
   3  */
   4
   5 /* stylelint-disable selector-class-pattern */
   6
   7 .diff {
   8         border: 0;
   9         border-spacing: 4px;
  10         margin: 0;
  11         width: 100%;
  12         /* Ensure that colums are of equal width */
  13         table-layout: fixed;
  14 }
  15
  16 .diff td {
  17         padding: 0.33em 0.5em;
  18 }
  19
  20 .diff td.diff-marker {
  21         /* Compensate padding for increased font-size */
  22         padding: 0.25em;
  23 }
  24
  25 .diff col.diff-marker {
  26         width: 2%;
  27 }
  28
  29 .diff .diff-content {
  30         width: 48%;
  31 }
  32
  33 .diff td div {
  34         /* Force-wrap very long lines such as URLs or page-widening char strings */
  35         word-wrap: break-word;
  36 }
  37
  38 .diff-title {
  39         vertical-align: top;
  40 }
  41
  42 .diff-notice,
  43 .diff-multi,
  44 .diff-otitle,
  45 .diff-ntitle {
  46         text-align: center;
  47 }
  48
  49 .diff-lineno {
  50         font-weight: bold;
  51 }
  52
  53 td.diff-marker {
  54         text-align: right;
  55         font-weight: bold;
  56         font-size: 1.25em;
  57         line-height: 1.2;
  58 }
  59
  60 .diff-addedline,
  61 .diff-deletedline,
  62 .diff-context {
  63         font-size: 88%;
  64         line-height: 1.6;
  65         vertical-align: top;
  66         white-space: -moz-pre-wrap;
  67         white-space: pre-wrap;
  68         border-style: solid;
  69         border-width: 1px 1px 1px 4px;
  70         border-radius: 0.33em;
  71 }
  72
  73 .diff-addedline {
  74         border-color: #a3d3ff;
  75 }
  76
  77 .diff-deletedline {
  78         border-color: #ffe49c;
  79 }
  80
  81 .diff-context {
  82         background: #f8f9fa;
  83         border-color: #eaecf0;
  84         color: #222;
  85 }
  86
  87 .diffchange {
  88         font-weight: bold;
  89         text-decoration: none;
  90 }
  91
  92 .diff-addedline .diffchange,
  93 .diff-deletedline .diffchange {
  94         border-radius: 0.33em;
  95         padding: 0.25em 0;
  96 }
  97
  98 .diff-addedline .diffchange {
  99         background: #d8ecff;
 100 }
 101
 102 .diff-deletedline .diffchange {
 103         background: #feeec8;
 104 }
 105
 106 /* Correct user & content directionality when viewing a diff */
 107 .diff-currentversion-title,
 108 .diff {
 109         direction: ltr;
 110         unicode-bidi: embed;
 111 }
 112
 113 /* @noflip */ .diff-contentalign-right td {
 114         direction: rtl;
 115         unicode-bidi: embed;
 116 }
 117
 118 /* @noflip */ .diff-contentalign-left td {
 119         direction: ltr;
 120         unicode-bidi: embed;
 121 }
 122
 123 .diff-multi,
 124 .diff-otitle,
 125 .diff-ntitle,
 126 .diff-lineno {
 127         direction: ltr !important; /* stylelint-disable-line declaration-no-important */
 128         unicode-bidi: embed;
 129 }
 130
 131 .mw-diff-slot-header {
 132         text-align: center;
 133 }
 134
 135 /*!
 136  * Wikidiff2 rendering for moved paragraphs
 137  */
 138
 139 .mw-diff-movedpara-left,
 140 .mw-diff-movedpara-right,
 141 .mw-diff-movedpara-left:visited,
 142 .mw-diff-movedpara-right:visited,
 143 .mw-diff-movedpara-left:active,
 144 .mw-diff-movedpara-right:active {
 145         display: block;
 146         color: transparent;
 147 }
 148
 149 .mw-diff-movedpara-left:hover,
 150 .mw-diff-movedpara-right:hover {
 151         text-decoration: none;
 152         color: transparent;
 153 }
 154
 155 .mw-diff-movedpara-left:after,
 156 .mw-diff-movedpara-right:after {
 157         display: block;
 158         color: #222;
 159         margin-top: -1.25em;
 160 }
 161
 162 .mw-diff-movedpara-left:after,
 163 .rtl .mw-diff-movedpara-right:after {
 164         content: '↪';
 165 }
 166
 167 .mw-diff-movedpara-right:after,
 168 .rtl .mw-diff-movedpara-left:after {
 169         content: '↩';
 170 }