Initial commit

This commit is contained in:
Khanh Ngo
2015-12-13 16:34:12 +07:00
commit 2dac8205f6
3113 changed files with 514935 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 995 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 992 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 992 B

View File

@ -0,0 +1,16 @@
div.antenna div.rateit-range
{
background: url(antenna-black.png) no-repeat;
height: 25px;
}
div.antenna div.rateit-hover
{
background: url(antenna-yellow.png) no-repeat;
}
div.antenna div.rateit-selected
{
background: url(antenna-red.png) no-repeat;
}

View File

@ -0,0 +1,34 @@
/*
SOURCE: http://iconexpo.com/2008/12/free-8color-star-icons/
*/
div.bigstars div.rateit-range
{
background: url(star-white32.png);
height: 32px;
}
div.bigstars div.rateit-hover
{
background: url(star-gold32.png);
}
div.bigstars div.rateit-selected
{
background: url(star-red32.png);
}
div.bigstars div.rateit-reset
{
background: url(star-black32.png);
width: 32px;
height: 32px;
}
div.bigstars div.rateit-reset:hover
{
background: url(star-white32.png);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,639 @@
<!DOCTYPE html>
<html>
<head>
<title>RateIt</title>
<link href="../src/rateit.css" rel="stylesheet" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<style>
body
{
font-family: Tahoma;
font-size: 12px;
}
h1
{
font-size: 1.7em;
}
h2
{
font-size: 1.5em;
}
h3
{
font-size: 1.2em;
}
ul.nostyle
{
list-style: none;
}
ul.nostyle h3
{
margin-left: -20px;
}
</style>
<!-- alternative styles -->
<link href="content/bigstars.css" rel="stylesheet" type="text/css">
<link href="content/antenna.css" rel="stylesheet" type="text/css">
<!-- syntax highlighter -->
<link href="sh/shCore.css" rel="stylesheet" type="text/css">
<link href="sh/shCoreDefault.css" rel="stylesheet" type="text/css">
</head>
<body>
<h1>
RateIt plugin</h1>
<h2>
Prerequisites</h2>
<p>
In order to use RateIt you'll need:
<ul>
<li><a target="_blank" href="http://www.jquery.com">jQuery 1.6.0</a> or newer.</li>
<li>jquery.rateit.min.js, rateit.css, delete.gif, star.gif - <a href="http://rateit.codeplex.com/releases">
Download RateIt</a></li>
<li>Place a reference to the rateit.css stylesheet into the page head.</li>
<li>Place a script reference to jquery.rateit.js before your &lt;/body&gt; tag.
</li>
</ul>
</p>
<h2>
Options</h2>
Go to the <a href="http://rateit.codeplex.com">RateIt project homepage</a> to view
the documentation.
<h2>
Examples</h2>
<div style="font-weight: bold">
<span id="toc"></span>
</div>
<ul class="nostyle" id="examples">
<li id="ex_a1">
<h3>
1a) Basic usage</h3>
<div class="rateit">
</div>
<pre class="brush: xml">
&lt;div class="rateit">
&lt;/div>
</pre>
</li>
<li id="ex_1b">
<h3>
1a) Basic usage (inline element)</h3>
<span class="rateit">
</span>
<pre class="brush: xml">
&lt;span class="rateit">
&lt;/span>
</pre>
</li>
<li id="ex_2a">
<h3>
2a) Progressive enhancement (using HTML5 range input type)
</h3>
<input type="range" min="0" max="7" value="0" step="0.5" id="backing2">
<div class="rateit" data-rateit-backingfld="#backing2">
</div>
<pre class="brush: xml">
&lt;input type="range" min="0" max="7" value="0" step="0.5" id="backing2">
&lt;div class="rateit" data-rateit-backingfld="#backing2">&lt;/div>
</pre>
<button onclick="$('#backing2').toggle()">
Toggle Backing Field visibility</button>
</li>
<li id="ex_2b">
<h3>
2b) Progressive enhancement (using select)
</h3>
<select id="backing2b">
<option value="0">Bad</option>
<option value="1">OK</option>
<option value="2">Great</option>
<option value="3">Excellent</option>
</select>
<div class="rateit" data-rateit-backingfld="#backing2b">
</div>
<pre class="brush: xml">
&lt;select id="backing2b">
&lt;option value="0">Bad&lt;/option>
&lt;option value="1">OK&lt;/option>
&lt;option value="2">Great&lt;/option>
&lt;option value="3">Excellent&lt;/option>
&lt;/select>
&lt;div class="rateit" data-rateit-backingfld="#backing2b">&lt;/div>
</pre>
</li>
<li id="ex_3">
<h3>
3) Readonly and preset value</h3>
<div class="rateit" data-rateit-value="2.5" data-rateit-ispreset="true" data-rateit-readonly="true">
</div>
<pre class="brush: xml">
&lt;div class="rateit" data-rateit-value="2.5" data-rateit-ispreset="true" data-rateit-readonly="true">&lt;/div>
</pre>
</li>
<li id="ex_4">
<h3>
4) More settings</h3>
<input type="range" value="4" step="0.25" id="backing4">
<div class="rateit" data-rateit-backingfld="#backing4" data-rateit-resetable="false" data-rateit-ispreset="true"
data-rateit-min="0" data-rateit-max="10">
</div>
<pre class="brush: xml">
&lt;input type="range" value="4" step="0.25" id="backing4">
&lt;div class="rateit" data-rateit-backingfld="#backing4" data-rateit-resetable="false" data-rateit-ispreset="true"
data-rateit-min="0" data-rateit-max="10">
&lt;/div>
</pre>
</li>
<li id="ex_5">
<h3>
5) Javascript interaction</h3>
<div class="rateit" id="rateit5" data-rateit-min="2">
</div>
<div>
<span id="value5"></span><span id="hover5"></span>
</div>
<script type="text/javascript">
$("#rateit5").bind('rated', function (event, value) { $('#value5').text('You\'ve rated it: ' + value); });
$("#rateit5").bind('reset', function () { $('#value5').text('Rating reset'); });
$("#rateit5").bind('over', function (event, value) { $('#hover5').text('Hovering over: ' + value); });
</script>
<pre class="brush: xml">
&lt;div class="rateit" id="rateit5" data-rateit-min="2">
&lt;/div>
&lt;div>
&lt;span id="value5">&lt;/span>
&lt;span id="hover5">&lt;/span>
&lt;/div>
&lt;script type="text/javascript">
$("#rateit5").bind('rated', function (event, value) { $('#value5').text('You\'ve rated it: ' + value); });
$("#rateit5").bind('reset', function () { $('#value5').text('Rating reset'); });
$("#rateit5").bind('over', function (event, value) { $('#hover5').text('Hovering over: ' + value); });
&lt;/script>
</pre>
</li>
<li id="ex_6">
<h3>
6) Javascript invocation</h3>
<input type="hidden" id="backing6">
<div id="rateit6">
</div>
<script type="text/javascript">
$(function () { $('#rateit6').rateit({ max: 20, step: 2, backingfld: '#backing6' }); });
</script>
<pre class="brush: xml">
&lt;input type="hidden" id="backing6">
&lt;div id="rateit6">
&lt;/div>
&lt;script type="text/javascript">
$(function () { $('#rateit6').rateit({ max: 20, step: 2, backingfld: '#backing6' }); });
&lt;/script>
</pre>
</li>
<li id="ex_7a">
<h3>
7a) Styling</h3>
<p>
You can change the styles of the plugin in a two ways.
<ul>
<li>You can change change the star.gif and delete.gif pictures (and perhaps the default
starwidth, and starheight values in the javascript file). This will change the style
everywhere.</li>
<li>You can change individual items, by adding a stylesheet with a few rules.</li>
</ul>
Here I've opted for the second option.
</p>
<div class="rateit bigstars" data-rateit-starwidth="32" data-rateit-starheight="32">
</div>
<h4>
Inline code</h4>
<pre class="brush: xml">
&lt;div class="rateit bigstars" data-rateit-starwidth="32" data-rateit-starheight="32">&lt;/div>
</pre>
<h4>
Style sheet</h4>
<pre class="brush: css">
div.bigstars div.rateit-range
{
background: url(star-white32.png);
height: 32px;
}
div.bigstars div.rateit-hover
{
background: url(star-gold32.png);
}
div.bigstars div.rateit-selected
{
background: url(star-red32.png);
}
div.bigstars div.rateit-reset
{
background: url(star-black32.png);
width: 32px;
height: 32px;
}
div.bigstars div.rateit-reset:hover
{
background: url(star-white32.png);
}
</pre>
</li>
<li id="ex_7b">
<h3>
7b) More styling</h3>
<p>
Here we use one big image (actually 3), with different dimensions. Not very pretty,
but it conveys the message I hope.</p>
<div class="rateit antenna" data-rateit-starwidth="11" data-rateit-starheight="25">
</div>
<h4>
Inline code</h4>
<pre class="brush: xml">
&lt;div class="rateit antenna" data-rateit-starwidth="11" data-rateit-starheight="25">&lt;/div>
</pre>
<h4>
Style sheet</h4>
<pre class="brush: css">
div.antenna div.rateit-range
{
background: url(antenna-black.png) no-repeat;
height: 25px;
}
div.antenna div.rateit-hover
{
background: url(antenna-yellow.png) no-repeat;
}
div.antenna div.rateit-selected
{
background: url(antenna-red.png) no-repeat;
}
</pre>
</li>
<li id="ex_8">
<h3>
8) RTL support</h3>
<div style="direction: rtl">
Now we are in RTL mode. No changes needed to make this work.
<div class="rateit">
</div>
</div>
</li>
<li id="ex_9">
<h3>
9) Setting and Getting values</h3>
<p>
All properties can also be set on the fly. Here are a few examples:</p>
<div class="rateit" id="rateit9">
</div>
<div>
<button onclick="alert($('#rateit9').rateit('value'))">
Get value</button>
<button onclick="$('#rateit9').rateit('value', prompt('Input numerical value'))">
Set value</button>
</div>
<div>
<button onclick="alert($('#rateit9').rateit('max'))">
Get max value</button>
<button onclick="$('#rateit9').rateit('max', prompt('Input numerical value'))">
Set max value</button>
</div>
<div>
<button onclick="alert($('#rateit9').rateit('min'))">
Get min value</button>
<button onclick="$('#rateit9').rateit('min', prompt('Input numerical value'))">
Set min value</button>
</div>
<div>
<button onclick="alert($('#rateit9').rateit('step'))">
Get step size</button>
<button onclick="$('#rateit9').rateit('step', prompt('Input numerical value'))">
Set step size</button>
</div>
<div>
<button onclick="alert($('#rateit9').rateit('readonly'))">
Get readonly value</button>
<button onclick="$('#rateit9').rateit('readonly',!$('#rateit9').rateit('readonly'))">
Toggle readonly</button>
</div>
<div>
<button onclick="alert($('#rateit9').rateit('ispreset'))">
Get ispreset value</button>
<button onclick="$('#rateit9').rateit('ispreset',!$('#rateit9').rateit('ispreset'))">
Toggle ispreset</button>
</div>
<div>
<button onclick="$('#rateit9').rateit('reset')">
Reset
</button>
</div>
<pre class="brush: xml">
&lt;div class="rateit" id="rateit9">
&lt;/div>
&lt;div>
&lt;button onclick="alert($('#rateit9').rateit('value'))">Get value&lt;/button>
&lt;button onclick="$('#rateit9').rateit('value', prompt('Input numerical value'))">Set value&lt;/button>
&lt;/div>
&lt;div>
&lt;button onclick="alert($('#rateit9').rateit('max'))">Get max value&lt;/button>
&lt;button onclick="$('#rateit9').rateit('max', prompt('Input numerical value'))">Set max value&lt;/button>
&lt;/div>
&lt;div>
&lt;button onclick="alert($('#rateit9').rateit('step'))">Get step size&lt;/button>
&lt;button onclick="$('#rateit9').rateit('step', prompt('Input numerical value'))">Set step size&lt;/button>
&lt;/div>
&lt;div>
&lt;button onclick="alert($('#rateit9').rateit('readonly'))">Get readonly value&lt;/button>
&lt;button onclick="$('#rateit9').rateit('readonly',!$('#rateit9').rateit('readonly'))">Toggle readonly&lt;/button>
&lt;/div>
&lt;div>
&lt;button onclick="alert($('#rateit9').rateit('ispreset'))">Get ispreset value&lt;/button>
&lt;button onclick="$('#rateit9').rateit('ispreset',!$('#rateit9').rateit('ispreset'))">Toggle ispreset&lt;/button>
&lt;/div>
&lt;div>
&lt;button onclick="$('#rateit9').rateit('reset')">Reset&lt;/button>
&lt;/div>
</pre>
</li>
<li id="ex_10">
<h3>
10) Tooltip example</h3>
<p>
Using tooltips is easy. Just bind to the hover event, and do your thing. Shown here
is the basic tooltip, but of course you can use any tooltip you'd like.</p>
<h4>
Basic numbers</h4>
<div class="rateit" id="rateit10">
</div>
<script type="text/javascript">
$("#rateit10").bind('over', function (event, value) { $(this).attr('title', value); });
</script>
<pre class="brush: xml">
&lt;div class="rateit" id="rateit10">
&lt;/div>
&lt;script type="text/javascript">
$("#rateit10").bind('over', function (event,value) { $(this).attr('title', value); });
&lt;/script>
</pre>
<h4>
Custom text</h4>
<div class="rateit" id="rateit10b" data-rateit-step="1">
</div>
<script type="text/javascript">
var tooltipvalues = ['bad', 'poor', 'ok', 'good', 'super'];
$("#rateit10b").bind('over', function (event, value) { $(this).attr('title', tooltipvalues[value - 1]); });
</script>
<pre class="brush: xml">
&lt;div class="rateit" id="rateit10b" data-rateit-step="1">
&lt;/div>
&lt;script type="text/javascript">
var tooltipvalues = ['bad', 'poor', 'ok', 'good', 'super'];
$("#rateit10b").bind('over', function (event, value) { $(this).attr('title', tooltipvalues[value-1]); });
&lt;/script>
</pre>
</li>
<li id="ex_11">
<h3>
11) AJAX example</h3>
<p>
Most times RateIt will be used using some Ajax. There are different ways of implementing
it (with/without backing field, using data-* attributes etc.)</p>
<div id="products">
<div style="float: right; width: 350px; border: 1px solid #ccc; padding: 1em;">
<strong>Server response:</strong>
<ul id="response">
</ul>
</div>
<ul>
<li>
<h4>
Product X (id: 312)</h4>
RateIt:
<div data-productid="312" class="rateit">
</div>
</li>
<li>
<h4>
Product Y (id: 423)</h4>
RateIt:
<div data-productid="423" class="rateit">
</div>
</li>
<li>
<h4>
Product Z (id: 653)</h4>
RateIt:
<div data-productid="653" class="rateit">
</div>
</li>
</ul>
</div>
<script type="text/javascript">
//we bind only to the rateit controls within the products div
$('#products .rateit').bind('rated reset', function (e) {
var ri = $(this);
//if the use pressed reset, it will get value: 0 (to be compatible with the HTML range control), we could check if e.type == 'reset', and then set the value to null .
var value = ri.rateit('value');
var productID = ri.data('productid'); // if the product id was in some hidden field: ri.closest('li').find('input[name="productid"]').val()
//maybe we want to disable voting?
ri.rateit('readonly', true);
$.ajax({
url: 'rateit.aspx', //your server side script
data: { id: productID, value: value }, //our data
type: 'POST',
success: function (data) {
$('#response').append('<li>' + data + '</li>');
},
error: function (jxhr, msg, err) {
$('#response').append('<li style="color:red">' + msg + '</li>');
}
});
});
</script>
<h4>
Client</h4>
<pre class="brush: xml">
&lt;div id="products">
&lt;div style="float:right; width:350px; border:1px solid #ccc; padding:1em;">
&lt;strong>Server response:&lt;/strong>
&lt;ul id="response">
&lt;/ul>
&lt;/div>
&lt;ul>
&lt;li>&lt;h4>Product X (id: 312)&lt;/h4>
RateIt: &lt;div data-productid="312" class="rateit">&lt;/div>
&lt;/li>
&lt;li>&lt;h4>Product Y (id: 423)&lt;/h4>
RateIt: &lt;div data-productid="423" class="rateit">&lt;/div>&lt;/li>
&lt;li>&lt;h4>Product Z (id: 653)&lt;/h4>
RateIt: &lt;div data-productid="653" class="rateit">&lt;/div>
&lt;/li>
&lt;/ul>
&lt;/div>
&lt;script type ="text/javascript">
//we bind only to the rateit controls within the products div
$('#products .rateit').bind('rated reset', function (e) {
var ri = $(this);
//if the use pressed reset, it will get value: 0 (to be compatible with the HTML range control), we could check if e.type == 'reset', and then set the value to null .
var value = ri.rateit('value');
var productID = ri.data('productid'); // if the product id was in some hidden field: ri.closest('li').find('input[name="productid"]').val()
//maybe we want to disable voting?
ri.rateit('readonly', true);
$.ajax({
url: 'rateit.aspx', //your server side script
data: { id: productID, value: value }, //our data
type: 'POST',
success: function (data) {
$('#response').append('&lt;li>' + data + '&lt;/li>');
},
error: function (jxhr, msg, err) {
$('#response').append('&lt;li style="color:red">' + msg + '&lt;/li>');
}
});
});
&lt;/script>
</pre>
<h4>
Server (ASPX) super simplified</h4>
<pre class="brush: c-sharp">
&lt;%@ Page Language="C#" %>
&lt;%
//Get value
float value = float.Parse(Request.Form["value"]);
int productID = int.Parse(Request.Form["id"]);
Response.Write(string.Format("You voted {0} on product: {1}.&lt;br/>Time on server: {2}", value, productID, DateTime.Now.ToString()));
%>
</pre>
</li>
<li id="ex_12">
<h3>
12) Resizing
</h3>
<p>
Sometimes we would like to resize the rating controls (perhaps based on screen size). <br />
This is as easy as<br />
a) adding a class to the rateit control, which would change the background image.<br/>
b) modifying the starwidth and starheigth properties.
<br /><br />
The alternative styling is taken from example <a href="#ex_7a">7a) styling</a>.
</p>
<div class="rateit" id="rateit12">
</div>
<p>Pick a size: <select id="size_12"><option data-class="" data-size="16" selected>normal</option><option data-class="bigstars" data-size="32">big</option></select></p>
<script type="text/javascript">
$('#size_12').change(function () {
var option = $(this.options[this.selectedIndex]);
$('#rateit12').removeClass('bigstars')
.addClass(option.data('class'))
.rateit('starwidth', option.data('size'))
.rateit('starheight', option.data('size'));
});
</script>
<pre class="brush: xml">
&lt;div class=&quot;rateit&quot; id=&quot;rateit12&quot;&gt;&lt;/div&gt;
&lt;p&gt;Pick a size:
&lt;select id=&quot;size_12&quot;&gt;
&lt;option data-class=&quot;&quot; data-size=&quot;16&quot; selected&gt;normal&lt;/option&gt;
&lt;option data-class=&quot;bigstars&quot; data-size=&quot;32&quot;&gt;big&lt;/option&gt;
&lt;/select&gt;
&lt;/p&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
$(&#39;#size_12&#39;).change(function () {
var option = $(this.options[this.selectedIndex]);
$(&#39;#rateit12&#39;).removeClass(&#39;bigstars&#39;) //remove old class
.addClass(option.data(&#39;class&#39;)) //add new class
.rateit(&#39;starwidth&#39;, option.data(&#39;size&#39;)) //change width
.rateit(&#39;starheight&#39;, option.data(&#39;size&#39;)); //change height
});
&lt;/script&gt;
</pre>
</li>
</ul>
<script src="../src/jquery.rateit.js" type="text/javascript"></script>
<script>
//build toc
var toc = [];
$('#examples > li').each(function (i, e) {
if (i > 0)
toc.push(', ');
toc.push('<a href="#')
toc.push(e.id)
toc.push('">')
var title = $(e).find('h3:first').text();
title = title.substring(title.indexOf(')') + 2);
toc.push(title);
toc.push('</a>');
});
$('#toc').html(toc.join(''));
</script>
<!-- syntax highlighter -->
<script src="sh/shCore.js" type="text/javascript"></script>
<script src="sh/shBrushJScript.js" type="text/javascript"></script>
<script src="sh/shBrushXml.js" type="text/javascript"></script>
<script src="sh/shBrushCss.js" type="text/javascript"></script>
<script src="sh/shBrushCSharp.js" type="text/javascript"></script>
<script type="text/javascript">
SyntaxHighlighter.all()
</script>
</body>
</html>

View File

@ -0,0 +1,9 @@
<%@ Page Language="C#" %>
<%
//Get value
float value = float.Parse(Request.Form["value"]);
int productID = int.Parse(Request.Form["id"]);
Response.Write(string.Format("You voted {0} on product: {1}.<br/>Time on server: {2}", value, productID, DateTime.Now.ToString()));
%>

View File

@ -0,0 +1,65 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
;(function()
{
// CommonJS
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
function Brush()
{
var keywords = 'abstract as base bool break byte case catch char checked class const ' +
'continue decimal default delegate do double else enum event explicit ' +
'extern false finally fixed float for foreach get goto if implicit in int ' +
'interface internal is lock long namespace new null object operator out ' +
'override params private protected public readonly ref return sbyte sealed set ' +
'short sizeof stackalloc static string struct switch this throw true try ' +
'typeof uint ulong unchecked unsafe ushort using virtual void while';
function fixComments(match, regexInfo)
{
var css = (match[0].indexOf("///") == 0)
? 'color1'
: 'comments'
;
return [new SyntaxHighlighter.Match(match[0], match.index, css)];
}
this.regexList = [
{ regex: SyntaxHighlighter.regexLib.singleLineCComments, func : fixComments }, // one line comments
{ regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments
{ regex: /@"(?:[^"]|"")*"/g, css: 'string' }, // @-quoted strings
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // strings
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // strings
{ regex: /^\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' }, // c# keyword
{ regex: /\bpartial(?=\s+(?:class|interface|struct)\b)/g, css: 'keyword' }, // contextual keyword: 'partial'
{ regex: /\byield(?=\s+(?:return|break)\b)/g, css: 'keyword' } // contextual keyword: 'yield'
];
this.forHtmlScript(SyntaxHighlighter.regexLib.aspScriptTags);
};
Brush.prototype = new SyntaxHighlighter.Highlighter();
Brush.aliases = ['c#', 'c-sharp', 'csharp'];
SyntaxHighlighter.brushes.CSharp = Brush;
// CommonJS
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
})();

View File

@ -0,0 +1,91 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
;(function()
{
// CommonJS
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
function Brush()
{
function getKeywordsCSS(str)
{
return '\\b([a-z_]|)' + str.replace(/ /g, '(?=:)\\b|\\b([a-z_\\*]|\\*|)') + '(?=:)\\b';
};
function getValuesCSS(str)
{
return '\\b' + str.replace(/ /g, '(?!-)(?!:)\\b|\\b()') + '\:\\b';
};
var keywords = 'ascent azimuth background-attachment background-color background-image background-position ' +
'background-repeat background baseline bbox border-collapse border-color border-spacing border-style border-top ' +
'border-right border-bottom border-left border-top-color border-right-color border-bottom-color border-left-color ' +
'border-top-style border-right-style border-bottom-style border-left-style border-top-width border-right-width ' +
'border-bottom-width border-left-width border-width border bottom cap-height caption-side centerline clear clip color ' +
'content counter-increment counter-reset cue-after cue-before cue cursor definition-src descent direction display ' +
'elevation empty-cells float font-size-adjust font-family font-size font-stretch font-style font-variant font-weight font ' +
'height left letter-spacing line-height list-style-image list-style-position list-style-type list-style margin-top ' +
'margin-right margin-bottom margin-left margin marker-offset marks mathline max-height max-width min-height min-width orphans ' +
'outline-color outline-style outline-width outline overflow padding-top padding-right padding-bottom padding-left padding page ' +
'page-break-after page-break-before page-break-inside pause pause-after pause-before pitch pitch-range play-during position ' +
'quotes right richness size slope src speak-header speak-numeral speak-punctuation speak speech-rate stemh stemv stress ' +
'table-layout text-align top text-decoration text-indent text-shadow text-transform unicode-bidi unicode-range units-per-em ' +
'vertical-align visibility voice-family volume white-space widows width widths word-spacing x-height z-index';
var values = 'above absolute all always aqua armenian attr aural auto avoid baseline behind below bidi-override black blink block blue bold bolder '+
'both bottom braille capitalize caption center center-left center-right circle close-quote code collapse compact condensed '+
'continuous counter counters crop cross crosshair cursive dashed decimal decimal-leading-zero default digits disc dotted double '+
'embed embossed e-resize expanded extra-condensed extra-expanded fantasy far-left far-right fast faster fixed format fuchsia '+
'gray green groove handheld hebrew help hidden hide high higher icon inline-table inline inset inside invert italic '+
'justify landscape large larger left-side left leftwards level lighter lime line-through list-item local loud lower-alpha '+
'lowercase lower-greek lower-latin lower-roman lower low ltr marker maroon medium message-box middle mix move narrower '+
'navy ne-resize no-close-quote none no-open-quote no-repeat normal nowrap n-resize nw-resize oblique olive once open-quote outset '+
'outside overline pointer portrait pre print projection purple red relative repeat repeat-x repeat-y rgb ridge right right-side '+
'rightwards rtl run-in screen scroll semi-condensed semi-expanded separate se-resize show silent silver slower slow '+
'small small-caps small-caption smaller soft solid speech spell-out square s-resize static status-bar sub super sw-resize '+
'table-caption table-cell table-column table-column-group table-footer-group table-header-group table-row table-row-group teal '+
'text-bottom text-top thick thin top transparent tty tv ultra-condensed ultra-expanded underline upper-alpha uppercase upper-latin '+
'upper-roman url visible wait white wider w-resize x-fast x-high x-large x-loud x-low x-slow x-small x-soft xx-large xx-small yellow';
var fonts = '[mM]onospace [tT]ahoma [vV]erdana [aA]rial [hH]elvetica [sS]ans-serif [sS]erif [cC]ourier mono sans serif';
this.regexList = [
{ regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // double quoted strings
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // single quoted strings
{ regex: /\#[a-fA-F0-9]{3,6}/g, css: 'value' }, // html colors
{ regex: /(-?\d+)(\.\d+)?(px|em|pt|\:|\%|)/g, css: 'value' }, // sizes
{ regex: /!important/g, css: 'color3' }, // !important
{ regex: new RegExp(getKeywordsCSS(keywords), 'gm'), css: 'keyword' }, // keywords
{ regex: new RegExp(getValuesCSS(values), 'g'), css: 'value' }, // values
{ regex: new RegExp(this.getKeywords(fonts), 'g'), css: 'color1' } // fonts
];
this.forHtmlScript({
left: /(&lt;|<)\s*style.*?(&gt;|>)/gi,
right: /(&lt;|<)\/\s*style\s*(&gt;|>)/gi
});
};
Brush.prototype = new SyntaxHighlighter.Highlighter();
Brush.aliases = ['css'];
SyntaxHighlighter.brushes.CSS = Brush;
// CommonJS
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
})();

View File

@ -0,0 +1,52 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
;(function()
{
// CommonJS
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
function Brush()
{
var keywords = 'break case catch continue ' +
'default delete do else false ' +
'for function if in instanceof ' +
'new null return super switch ' +
'this throw true try typeof var while with'
;
var r = SyntaxHighlighter.regexLib;
this.regexList = [
{ regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings
{ regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings
{ regex: r.singleLineCComments, css: 'comments' }, // one line comments
{ regex: r.multiLineCComments, css: 'comments' }, // multiline comments
{ regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords
];
this.forHtmlScript(r.scriptScriptTags);
};
Brush.prototype = new SyntaxHighlighter.Highlighter();
Brush.aliases = ['js', 'jscript', 'javascript'];
SyntaxHighlighter.brushes.JScript = Brush;
// CommonJS
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
})();

View File

@ -0,0 +1,69 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
;(function()
{
// CommonJS
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
function Brush()
{
function process(match, regexInfo)
{
var constructor = SyntaxHighlighter.Match,
code = match[0],
tag = new XRegExp('(&lt;|<)[\\s\\/\\?]*(?<name>[:\\w-\\.]+)', 'xg').exec(code),
result = []
;
if (match.attributes != null)
{
var attributes,
regex = new XRegExp('(?<name> [\\w:\\-\\.]+)' +
'\\s*=\\s*' +
'(?<value> ".*?"|\'.*?\'|\\w+)',
'xg');
while ((attributes = regex.exec(code)) != null)
{
result.push(new constructor(attributes.name, match.index + attributes.index, 'color1'));
result.push(new constructor(attributes.value, match.index + attributes.index + attributes[0].indexOf(attributes.value), 'string'));
}
}
if (tag != null)
result.push(
new constructor(tag.name, match.index + tag[0].indexOf(tag.name), 'keyword')
);
return result;
}
this.regexList = [
{ regex: new XRegExp('(\\&lt;|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\&gt;|>)', 'gm'), css: 'color2' }, // <![ ... [ ... ]]>
{ regex: SyntaxHighlighter.regexLib.xmlComments, css: 'comments' }, // <!-- ... -->
{ regex: new XRegExp('(&lt;|<)[\\s\\/\\?]*(\\w+)(?<attributes>.*?)[\\s\\/\\?]*(&gt;|>)', 'sg'), func: process }
];
};
Brush.prototype = new SyntaxHighlighter.Highlighter();
Brush.aliases = ['xml', 'xhtml', 'xslt', 'html'];
SyntaxHighlighter.brushes.Xml = Brush;
// CommonJS
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
})();

View File

@ -0,0 +1,226 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
.syntaxhighlighter a,
.syntaxhighlighter div,
.syntaxhighlighter code,
.syntaxhighlighter table,
.syntaxhighlighter table td,
.syntaxhighlighter table tr,
.syntaxhighlighter table tbody,
.syntaxhighlighter table thead,
.syntaxhighlighter table caption,
.syntaxhighlighter textarea {
-moz-border-radius: 0 0 0 0 !important;
-webkit-border-radius: 0 0 0 0 !important;
background: none !important;
border: 0 !important;
bottom: auto !important;
float: none !important;
height: auto !important;
left: auto !important;
line-height: 1.1em !important;
margin: 0 !important;
outline: 0 !important;
overflow: visible !important;
padding: 0 !important;
position: static !important;
right: auto !important;
text-align: left !important;
top: auto !important;
vertical-align: baseline !important;
width: auto !important;
box-sizing: content-box !important;
font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
font-weight: normal !important;
font-style: normal !important;
font-size: 1em !important;
min-height: inherit !important;
min-height: auto !important;
}
.syntaxhighlighter {
width: 100% !important;
margin: 1em 0 1em 0 !important;
position: relative !important;
overflow: auto !important;
font-size: 1em !important;
}
.syntaxhighlighter.source {
overflow: hidden !important;
}
.syntaxhighlighter .bold {
font-weight: bold !important;
}
.syntaxhighlighter .italic {
font-style: italic !important;
}
.syntaxhighlighter .line {
white-space: pre !important;
}
.syntaxhighlighter table {
width: 100% !important;
}
.syntaxhighlighter table caption {
text-align: left !important;
padding: .5em 0 0.5em 1em !important;
}
.syntaxhighlighter table td.code {
width: 100% !important;
}
.syntaxhighlighter table td.code .container {
position: relative !important;
}
.syntaxhighlighter table td.code .container textarea {
box-sizing: border-box !important;
position: absolute !important;
left: 0 !important;
top: 0 !important;
width: 100% !important;
height: 100% !important;
border: none !important;
background: white !important;
padding-left: 1em !important;
overflow: hidden !important;
white-space: pre !important;
}
.syntaxhighlighter table td.gutter .line {
text-align: right !important;
padding: 0 0.5em 0 1em !important;
}
.syntaxhighlighter table td.code .line {
padding: 0 1em !important;
}
.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line {
padding-left: 0em !important;
}
.syntaxhighlighter.show {
display: block !important;
}
.syntaxhighlighter.collapsed table {
display: none !important;
}
.syntaxhighlighter.collapsed .toolbar {
padding: 0.1em 0.8em 0em 0.8em !important;
font-size: 1em !important;
position: static !important;
width: auto !important;
height: auto !important;
}
.syntaxhighlighter.collapsed .toolbar span {
display: inline !important;
margin-right: 1em !important;
}
.syntaxhighlighter.collapsed .toolbar span a {
padding: 0 !important;
display: none !important;
}
.syntaxhighlighter.collapsed .toolbar span a.expandSource {
display: inline !important;
}
.syntaxhighlighter .toolbar {
position: absolute !important;
right: 1px !important;
top: 1px !important;
width: 11px !important;
height: 11px !important;
font-size: 10px !important;
z-index: 10 !important;
}
.syntaxhighlighter .toolbar span.title {
display: inline !important;
}
.syntaxhighlighter .toolbar a {
display: block !important;
text-align: center !important;
text-decoration: none !important;
padding-top: 1px !important;
}
.syntaxhighlighter .toolbar a.expandSource {
display: none !important;
}
.syntaxhighlighter.ie {
font-size: .9em !important;
padding: 1px 0 1px 0 !important;
}
.syntaxhighlighter.ie .toolbar {
line-height: 8px !important;
}
.syntaxhighlighter.ie .toolbar a {
padding-top: 0px !important;
}
.syntaxhighlighter.printing .line.alt1 .content,
.syntaxhighlighter.printing .line.alt2 .content,
.syntaxhighlighter.printing .line.highlighted .number,
.syntaxhighlighter.printing .line.highlighted.alt1 .content,
.syntaxhighlighter.printing .line.highlighted.alt2 .content {
background: none !important;
}
.syntaxhighlighter.printing .line .number {
color: #bbbbbb !important;
}
.syntaxhighlighter.printing .line .content {
color: black !important;
}
.syntaxhighlighter.printing .toolbar {
display: none !important;
}
.syntaxhighlighter.printing a {
text-decoration: none !important;
}
.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a {
color: black !important;
}
.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a {
color: #008200 !important;
}
.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a {
color: blue !important;
}
.syntaxhighlighter.printing .keyword {
color: #006699 !important;
font-weight: bold !important;
}
.syntaxhighlighter.printing .preprocessor {
color: gray !important;
}
.syntaxhighlighter.printing .variable {
color: #aa7700 !important;
}
.syntaxhighlighter.printing .value {
color: #009900 !important;
}
.syntaxhighlighter.printing .functions {
color: #ff1493 !important;
}
.syntaxhighlighter.printing .constants {
color: #0066cc !important;
}
.syntaxhighlighter.printing .script {
font-weight: bold !important;
}
.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a {
color: gray !important;
}
.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a {
color: #ff1493 !important;
}
.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a {
color: red !important;
}
.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a {
color: black !important;
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,328 @@
/**
* SyntaxHighlighter
* http://alexgorbatchev.com/SyntaxHighlighter
*
* SyntaxHighlighter is donationware. If you are using it, please donate.
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
*
* @version
* 3.0.83 (July 02 2010)
*
* @copyright
* Copyright (C) 2004-2010 Alex Gorbatchev.
*
* @license
* Dual licensed under the MIT and GPL licenses.
*/
.syntaxhighlighter a,
.syntaxhighlighter div,
.syntaxhighlighter code,
.syntaxhighlighter table,
.syntaxhighlighter table td,
.syntaxhighlighter table tr,
.syntaxhighlighter table tbody,
.syntaxhighlighter table thead,
.syntaxhighlighter table caption,
.syntaxhighlighter textarea {
-moz-border-radius: 0 0 0 0 !important;
-webkit-border-radius: 0 0 0 0 !important;
background: none !important;
border: 0 !important;
bottom: auto !important;
float: none !important;
height: auto !important;
left: auto !important;
line-height: 1.1em !important;
margin: 0 !important;
outline: 0 !important;
overflow: visible !important;
padding: 0 !important;
position: static !important;
right: auto !important;
text-align: left !important;
top: auto !important;
vertical-align: baseline !important;
width: auto !important;
box-sizing: content-box !important;
font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
font-weight: normal !important;
font-style: normal !important;
font-size: 1em !important;
min-height: inherit !important;
min-height: auto !important;
}
.syntaxhighlighter {
width: 100% !important;
margin: 1em 0 1em 0 !important;
position: relative !important;
overflow: auto !important;
font-size: 1em !important;
}
.syntaxhighlighter.source {
overflow: hidden !important;
}
.syntaxhighlighter .bold {
font-weight: bold !important;
}
.syntaxhighlighter .italic {
font-style: italic !important;
}
.syntaxhighlighter .line {
white-space: pre !important;
}
.syntaxhighlighter table {
width: 100% !important;
}
.syntaxhighlighter table caption {
text-align: left !important;
padding: .5em 0 0.5em 1em !important;
}
.syntaxhighlighter table td.code {
width: 100% !important;
}
.syntaxhighlighter table td.code .container {
position: relative !important;
}
.syntaxhighlighter table td.code .container textarea {
box-sizing: border-box !important;
position: absolute !important;
left: 0 !important;
top: 0 !important;
width: 100% !important;
height: 100% !important;
border: none !important;
background: white !important;
padding-left: 1em !important;
overflow: hidden !important;
white-space: pre !important;
}
.syntaxhighlighter table td.gutter .line {
text-align: right !important;
padding: 0 0.5em 0 1em !important;
}
.syntaxhighlighter table td.code .line {
padding: 0 1em !important;
}
.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line {
padding-left: 0em !important;
}
.syntaxhighlighter.show {
display: block !important;
}
.syntaxhighlighter.collapsed table {
display: none !important;
}
.syntaxhighlighter.collapsed .toolbar {
padding: 0.1em 0.8em 0em 0.8em !important;
font-size: 1em !important;
position: static !important;
width: auto !important;
height: auto !important;
}
.syntaxhighlighter.collapsed .toolbar span {
display: inline !important;
margin-right: 1em !important;
}
.syntaxhighlighter.collapsed .toolbar span a {
padding: 0 !important;
display: none !important;
}
.syntaxhighlighter.collapsed .toolbar span a.expandSource {
display: inline !important;
}
.syntaxhighlighter .toolbar {
position: absolute !important;
right: 1px !important;
top: 1px !important;
width: 11px !important;
height: 11px !important;
font-size: 10px !important;
z-index: 10 !important;
}
.syntaxhighlighter .toolbar span.title {
display: inline !important;
}
.syntaxhighlighter .toolbar a {
display: block !important;
text-align: center !important;
text-decoration: none !important;
padding-top: 1px !important;
}
.syntaxhighlighter .toolbar a.expandSource {
display: none !important;
}
.syntaxhighlighter.ie {
font-size: .9em !important;
padding: 1px 0 1px 0 !important;
}
.syntaxhighlighter.ie .toolbar {
line-height: 8px !important;
}
.syntaxhighlighter.ie .toolbar a {
padding-top: 0px !important;
}
.syntaxhighlighter.printing .line.alt1 .content,
.syntaxhighlighter.printing .line.alt2 .content,
.syntaxhighlighter.printing .line.highlighted .number,
.syntaxhighlighter.printing .line.highlighted.alt1 .content,
.syntaxhighlighter.printing .line.highlighted.alt2 .content {
background: none !important;
}
.syntaxhighlighter.printing .line .number {
color: #bbbbbb !important;
}
.syntaxhighlighter.printing .line .content {
color: black !important;
}
.syntaxhighlighter.printing .toolbar {
display: none !important;
}
.syntaxhighlighter.printing a {
text-decoration: none !important;
}
.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a {
color: black !important;
}
.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a {
color: #008200 !important;
}
.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a {
color: blue !important;
}
.syntaxhighlighter.printing .keyword {
color: #006699 !important;
font-weight: bold !important;
}
.syntaxhighlighter.printing .preprocessor {
color: gray !important;
}
.syntaxhighlighter.printing .variable {
color: #aa7700 !important;
}
.syntaxhighlighter.printing .value {
color: #009900 !important;
}
.syntaxhighlighter.printing .functions {
color: #ff1493 !important;
}
.syntaxhighlighter.printing .constants {
color: #0066cc !important;
}
.syntaxhighlighter.printing .script {
font-weight: bold !important;
}
.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a {
color: gray !important;
}
.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a {
color: #ff1493 !important;
}
.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a {
color: red !important;
}
.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a {
color: black !important;
}
.syntaxhighlighter {
background-color: white !important;
}
.syntaxhighlighter .line.alt1 {
background-color: white !important;
}
.syntaxhighlighter .line.alt2 {
background-color: white !important;
}
.syntaxhighlighter .line.highlighted.alt1, .syntaxhighlighter .line.highlighted.alt2 {
background-color: #e0e0e0 !important;
}
.syntaxhighlighter .line.highlighted.number {
color: black !important;
}
.syntaxhighlighter table caption {
color: black !important;
}
.syntaxhighlighter .gutter {
color: #afafaf !important;
}
.syntaxhighlighter .gutter .line {
border-right: 3px solid #6ce26c !important;
}
.syntaxhighlighter .gutter .line.highlighted {
background-color: #6ce26c !important;
color: white !important;
}
.syntaxhighlighter.printing .line .content {
border: none !important;
}
.syntaxhighlighter.collapsed {
overflow: visible !important;
}
.syntaxhighlighter.collapsed .toolbar {
color: blue !important;
background: white !important;
border: 1px solid #6ce26c !important;
}
.syntaxhighlighter.collapsed .toolbar a {
color: blue !important;
}
.syntaxhighlighter.collapsed .toolbar a:hover {
color: red !important;
}
.syntaxhighlighter .toolbar {
color: white !important;
background: #6ce26c !important;
border: none !important;
}
.syntaxhighlighter .toolbar a {
color: white !important;
}
.syntaxhighlighter .toolbar a:hover {
color: black !important;
}
.syntaxhighlighter .plain, .syntaxhighlighter .plain a {
color: black !important;
}
.syntaxhighlighter .comments, .syntaxhighlighter .comments a {
color: #008200 !important;
}
.syntaxhighlighter .string, .syntaxhighlighter .string a {
color: blue !important;
}
.syntaxhighlighter .keyword {
color: #006699 !important;
}
.syntaxhighlighter .preprocessor {
color: gray !important;
}
.syntaxhighlighter .variable {
color: #aa7700 !important;
}
.syntaxhighlighter .value {
color: #009900 !important;
}
.syntaxhighlighter .functions {
color: #ff1493 !important;
}
.syntaxhighlighter .constants {
color: #0066cc !important;
}
.syntaxhighlighter .script {
font-weight: bold !important;
color: #006699 !important;
background-color: none !important;
}
.syntaxhighlighter .color1, .syntaxhighlighter .color1 a {
color: gray !important;
}
.syntaxhighlighter .color2, .syntaxhighlighter .color2 a {
color: #ff1493 !important;
}
.syntaxhighlighter .color3, .syntaxhighlighter .color3 a {
color: red !important;
}
.syntaxhighlighter .keyword {
font-weight: bold !important;
}