[Bf-docboard] Improved BlenderWiki Diff rendering

JimmyVolatile spam at useful.no
Mon Oct 6 22:58:07 CEST 2008


Hi, all.

1. I've improved the rendering of the Wiki Diff in the the default Blender
Skin on my local system but would need some help to actually implement it on
the Wiki (if that's something I'm allowed to do at all).
 The new CSS has been tested on FF and Opera on Ubuntu and IE on XP.

Changes:
*Dark background, light, slightly smaller text for the diff context.
*Pale Background colors for the diffing paragraphs, dark text.
*Line-throughs of deleted words and red higlights for deleted and added
words.
*
2. Please preview the new rendering here:*
http://wiki.blender.org/uploads/f/fa/BlenderWiki-Diff-CSS-Improved.png

You can also download the example html and all necessary css-files (
http://wiki.blender.org/uploads/0/02/Wiki.blender.org.tar.gz )
if you wish to test the changes in your favourite browser or want to play
with editing the Wiki CSS yourself.


3*. How to update the wiki CSS*:
Simply add the following to the end of the existing Blender skin file (
http://wiki.blender.org/skins/blender/main.css ) to get the desired result
or you can simply replace* /skins/blender/main.css* with the equivalent file
from the Wiki.blender.org.tar.gz file.

/*
** Diff rendering
*/
table.diff, td.diff-otitle, td.diff-ntitle {background-color:
#333;color:#fff;}
td.diff-otitle,td.diff-ntitle {text-align: center;}
td.diff-marker {text-align:
right;font-size:18px;font-weight:bold;padding:3px;text-align:center;}
.rtl td.diff-marker {text-align: left;}
table.diff td.diff-lineno {padding-left:15px;font-weight: bold;}

td.diff-addedline {background: #cfc;font-size: smaller;}
td.diff-deletedline {background: #ffa;font-size: smaller;}

table.diff {border: none;width: 98%;border-spacing: 4px;
    /* Fixed layout is required to ensure that cells containing long URLs
       don't widen in Safari, Internet Explorer, or iCab */
    table-layout: fixed;}
table.diff td {    padding: 0;}
table.diff col.diff-marker {width: 2%;}
table.diff col.diff-content {width: 48%;}
table.diff td div {
    /* Force-wrap very long lines such as URLs or page-widening char
strings.
       CSS 3 draft..., but Gecko doesn't support it yet:
       https://bugzilla.mozilla.org/show_bug.cgi?id=99457 */
    word-wrap: break-word;

    /* As fallback, scrollbars will be added for very wide cells
       instead of text overflowing or widening */
    overflow: auto;

    /* The above rule breaks on very old versions of Mozilla due
       to a bug which collapses the table cells to a single line.

       In Mozilla 1.1 and below with JavaScript enabled, the rule
       will be overridden with this by diff.js; wide cell contents
       then spill horizontally without widening the rest of the
       table: */
    /* overflow: visible; */
}


/*Diff in this file*/
td.diff-context div, td.diff-addedline div, td.diff-deletedline
div{font-size:12px;padding:5px}
td.diff-context div {background: #666;color:#bbb;}
td.diff-addedline div{background-color: #caFFc1;color: black;}
td.diff-deletedline div{background-color: #f9ffbb;color: black;}

.diffchange {font-weight:bold;text-decoration:none;/*background-color:
#FFCDF3;*/}
del.diffchange{text-decoration:line-through;color: red;}
ins.diffchange{color: red;}

.autocomment { color:  grey; }
#pagehistory span.user {margin-left: 1.4em;margin-right: 0.4em;}
#pagehistory span.minor {font-weight: bold;}
#pagehistory li.selected {background-color: #292929; border:1px dashed
#aaaaaa;}

--

With regs,

Jarl Arntzen (JimmyVolatile)
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.blender.org/pipermail/bf-docboard/attachments/20081006/a1af4743/attachment.htm 


More information about the Bf-docboard mailing list