skins/common/diff.css

   1 /*
   2 ** Diff rendering
   3 */
   4 table.diff, td.diff-otitle, td.diff-ntitle {
   5         background-color: white;
   6 }
   7 td.diff-otitle,
   8 td.diff-ntitle {
   9         text-align: center;
  10 }
  11 td.diff-marker {
  12         text-align: right;
  13 }
  14 .rtl td.diff-marker {
  15         text-align: left;
  16 }
  17 td.diff-lineno {
  18         font-weight: bold;
  19 }
  20 td.diff-addedline {
  21         background: #cfc;
  22         font-size: smaller;
  23 }
  24 td.diff-deletedline {
  25         background: #ffa;
  26         font-size: smaller;
  27 }
  28 td.diff-context {
  29         background: #eee;
  30         font-size: smaller;
  31 }
  32 .diffchange {
  33         color: red;
  34         font-weight: bold;
  35         text-decoration: none;
  36         white-space: pre-wrap;
  37         white-space: -moz-pre-wrap;
  38 }
  39
  40 table.diff {
  41         border: none;
  42         width: 98%;
  43         border-spacing: 4px;
  44
  45         /* Fixed layout is required to ensure that cells containing long URLs
  46            don't widen in Safari, Internet Explorer, or iCab */
  47         table-layout: fixed;
  48 }
  49 table.diff td {
  50         padding: 0;
  51 }
  52 table.diff col.diff-marker {
  53         width: 2%;
  54 }
  55 table.diff col.diff-content {
  56         width: 48%;
  57 }
  58 table.diff td div {
  59         /* Force-wrap very long lines such as URLs or page-widening char strings.
  60            CSS 3 draft..., but Gecko doesn't support it yet:
  61            https://bugzilla.mozilla.org/show_bug.cgi?id=99457 */
  62         word-wrap: break-word;
  63
  64         /* As fallback, scrollbars will be added for very wide cells
  65            instead of text overflowing or widening */
  66         overflow: auto;
  67
  68         /* The above rule breaks on very old versions of Mozilla due
  69            to a bug which collapses the table cells to a single line.
  70
  71            In Mozilla 1.1 and below with JavaScript enabled, the rule
  72            will be overridden with this by diff.js; wide cell contents
  73            then spill horizontally without widening the rest of the
  74            table: */
  75         /* overflow: visible; */
  76 }
  77
  78 /*
  79  * Styles for the HTML Diff
  80  */
  81 div.diff-switchtype{
  82         text-align: center;
  83         font-weight: bold;
  84         font-size: smaller;
  85 }
  86
  87 span.diff-html-added {
  88   font-size: 100%;
  89   background-color: #20ff20
  90 }
  91
  92 span.diff-html-removed {
  93   font-size: 100%;
  94   text-decoration: line-through;
  95   background-color: #ff2020
  96 }
  97
  98 span.diff-html-changed {
  99   background: url(images/diffunderline.gif) bottom repeat-x;
 100   /* Hack for IE5.5, see http://lists.wikimedia.org/pipermail/wikitech-l/2008-November/040273.html */
 101   *background-color: #c6c6fd; /* light blue */
 102 }
 103
 104 span.diff-html-added img{
 105  border: 5px solid #ccffcc;
 106 }
 107
 108 span.diff-html-removed img{
 109  border: 5px solid #fdc6c6;
 110 }
 111
 112 span.diff-html-changed img{
 113  border: 5px dotted #000099;
 114
 115 }
 116
 117 span.diff-html-changed  {
 118   position: relative;   /* this is key */
 119   cursor: help;
 120 }
 121
 122 span.diff-html-changed span.tip {
 123   display: none;        /* so is this */
 124 }
 125
 126 /* tooltip will display on :hover event */
 127
 128 span.diff-html-changed:hover span.tip {
 129   display: block;
 130   z-index: 95;
 131   position: absolute;
 132   top: 2.5em;
 133   left: 0;
 134   width: auto;
 135   line-height: 1.2em;
 136   padding: 3px 7px 4px 6px;
 137   border: 1px solid #336;
 138   background-color: #f7f7ee;
 139   font-size: 10px;
 140   text-align: left;
 141 }
 142
 143