Skip to content
Browse files

Created gh-pages branch via GitHub

  • Loading branch information...
0 parents commit 04005510443d070b08ba3b3fef575151aa6c9958 @kossnocorp committed May 1, 2012
Showing with 585 additions and 0 deletions.
  1. +243 −0 index.html
  2. +17 −0 javascripts/scale.fix.js
  3. +1 −0 params.json
  4. +69 −0 stylesheets/pygment_trac.css
  5. +255 −0 stylesheets/styles.css
243 index.html
@@ -0,0 +1,243 @@
+<!doctype html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="chrome=1">
+ <title>Role by kossnocorp</title>
+
+ <link rel="stylesheet" href="stylesheets/styles.css">
+ <link rel="stylesheet" href="stylesheets/pygment_trac.css">
+ <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+ <!--[if lt IE 9]>
+ <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+ </head>
+ <body>
+ <div class="wrapper">
+ <header>
+ <h1>Role</h1>
+ <p>jQuery plugin to provide easy way to handle DOM elements by role attribute</p>
+ <p class="view"><a href="https://github.com/kossnocorp/role">View the Project on GitHub <small>kossnocorp/role</small></a></p>
+ <ul>
+ <li><a href="https://github.com/kossnocorp/role/zipball/master">Download <strong>ZIP File</strong></a></li>
+ <li><a href="https://github.com/kossnocorp/role/tarball/master">Download <strong>TAR Ball</strong></a></li>
+ <li><a href="https://github.com/kossnocorp/role">View On <strong>GitHub</strong></a></li>
+ </ul>
+ </header>
+ <section>
+ <h1>jquery.role — jQuery plugin to provide easy way to handle DOM elements by role attribute</h1>
+
+<p>This project uses <a href="http://semver.org/">Semantic Versioning</a> for release numbering.</p>
+
+<p>Sponsored by <a href="http://evilmartians.com/">Evil Martians</a>.</p>
+
+<h2>Downloads</h2>
+
+<ul>
+<li><a href="https://raw.github.com/kossnocorp/role/master/lib/jquery.role.min.js">jquery.role.min.js</a></li>
+<li><a href="https://raw.github.com/kossnocorp/role/master/lib/jquery.role.min.js">role.min.js</a></li>
+<li><a href="https://raw.github.com/kossnocorp/role/master/lib/jquery.role.js">jquery.role.js</a></li>
+<li><a href="https://raw.github.com/kossnocorp/role/master/lib/role.js">role.js</a></li>
+</ul><p>Also you can add jquery.role.js and role.js by bundle <code>role-rails</code> gem. For futher details see <em>installation</em> section below.</p>
+
+<h2>Use <code>role</code> attribute FTW</h2>
+
+<pre><code>Use cases for a role attribute for HTML5, include:
+
+* accessibility,
+* device adaptation,
+* server-side processing, and
+* complex data description.
+</code></pre>
+
+<p>This is a quote from <a href="http://www.w3.org/wiki/PF/XTech/HTML5/RoleAttribute#A_Role_Attribute_for_HTML5">W3C Specification on Role attribute</a>.</p>
+
+<p>In <a href="http://evilmartians.com/">Evil Martians</a> we came up with a way to use this attribute for our own purposes.</p>
+
+<p>Say you have to update your website page design. HTML markup is done and you have to apply it to the existing site. Of course this marvelous page is crammed with Javascript code tied to an existing structure.</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'.list .item img'</span><span class="p">)</span>
+ <span class="p">.</span><span class="nx">mouseenter</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">rotateTo</span><span class="p">(</span><span class="mi">30</span><span class="p">,</span> <span class="mi">300</span><span class="p">)</span>
+ <span class="p">})</span>
+ <span class="p">.</span><span class="nx">mouseleave</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">rotateTo</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">300</span><span class="p">)</span>
+ <span class="p">});</span>
+</pre>
+</div>
+
+
+<p>Obviously, you'll have to rewrite all the selectors for the new layout. And it would be nice if you had to fix only one (or even ten) of these selectors. In reality, most likely, there will be several dozen of them.</p>
+
+<p>Another issue is that refactoring process requires you to change the names or a number of classes. You'll have to muddle through every JS file to find all classes you are going to change.</p>
+
+<p>And, of course, in both cases the end result is absolutely unpredictable, because layout alone is not enougn to figure out if a class is actualy used in JS.</p>
+
+<p>The <code>.js-class_name</code> prefix use may seem like a good idea, except that someone will surely add styles to this class in a future... Let alone the difficulty to spot, among a large of number of classes, one with a prefix.</p>
+
+<p>In order to avoid this problems, we can "attach" JS to DOM elements by a <code>role</code> attribute.</p>
+
+<p>It's a lot safer then prefixes, beacause it's much harder to attach styles to <code>role</code> and it feals morally difficult to break the <code>role</code> use convention.</p>
+
+<p>With the use of <code>role</code>, layout update becomes very straightforward: you just have to add roles to a new element, and if you are not tied to the "magic numbers" -- it will work with no further hassle.</p>
+
+<p>To make life easier (shoutout to <a href="https://twitter.com/#!/alex_chrome">@alex_chrome</a> for the great idea) we also extended jQuery selector syntax:</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'@list @item @image'</span><span class="p">)</span>
+ <span class="p">.</span><span class="nx">mouseenter</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">rotateTo</span><span class="p">(</span><span class="mi">30</span><span class="p">,</span> <span class="mi">300</span><span class="p">)</span>
+ <span class="p">})</span>
+ <span class="p">.</span><span class="nx">mouseleave</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">rotateTo</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">300</span><span class="p">)</span>
+ <span class="p">});</span>
+</pre>
+</div>
+
+
+<p><code>$('@list @item @image')</code> is the same as <code>$('[role="list"] [role="item] [role="image"]')</code> and you can use "multirole": <code>$('@list@coupons')</code>.</p>
+
+<p>In addition to the jQuery plug-in, I also wrote a version that extends <code>querySelectorAll</code> of <a href="http://zeptojs.com/">Zepto.js</a> with a Role functionality.</p>
+
+<p>Using of 'role' in a query may work a bit slower compared to usual selectors, but it's neglectable even in a large number of queries.</p>
+
+<p>In addition to <code>role</code>, I sometimes use <code>id</code>, but only in very extraodinary cases — because if there is only single element on a page today, it may happen that there will be a few tomorrow, even if that wasn't planned.</p>
+
+<h2>Usage</h2>
+
+<h3>Using selectors</h3>
+
+<p>You can use shortcut <code>@</code> in jQuery selectors to find elements with roles.</p>
+
+<p>Will select all elements in document with <code>role="ajax-link"</code>:</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'@ajax-link'</span><span class="p">)</span>
+</pre>
+</div>
+
+
+<p>Also you can combinate roles:</p>
+
+<p><code>&lt;form role="form login_form"&gt;&lt;/form&gt;</code>:</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'@form@login_form'</span><span class="p">)</span>
+</pre>
+</div>
+
+
+<p>Will select all forms with "form" as role <code>&lt;form role="form login_form"&gt;&lt;/form&gt;&lt;form role="form registration_form"&gt;&lt;/form&gt;</code>:</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'@form'</span><span class="p">)</span>
+</pre>
+</div>
+
+
+<p>You can combine role with other selectors, but that is not recommended:</p>
+
+<p><code>&lt;form class="dark" role="login_form" method="post"&gt;&lt;/form&gt;</code>:</p>
+
+<div class="highlight">
+<pre><span class="nx">$</span><span class="p">(</span><span class="s1">'form.dark@login_form[method=post]'</span><span class="p">)</span>
+</pre>
+</div>
+
+
+<h2>Installation</h2>
+
+<p>Coming soon.</p>
+
+<h2>Changelog</h2>
+
+<h3>1.2.0 (April 19, 2012)</h3>
+
+<ul>
+<li>Total rewrite. jQuery versions 1.2-1.7 compatibility (<a href="https://github.com/rwz" class="user-mention">@rwz</a>)</li>
+</ul><h3>1.0.2 (March 14, 2012)</h3>
+
+<ul>
+<li>Fixes problem in Internet Explorer 8 in jquery.role.js and role.js (issue #11) (thanks <a href="https://github.com/igor-alexandrov" class="user-mention">@igor-alexandrov</a> for help)</li>
+</ul><h3>1.0.1 (January 27, 2012)</h3>
+
+<ul>
+<li>Fixes problem with multiple roles in Firefox 8 and later (issue #9)</li>
+</ul><h3>1.0.0 (December 26, 2011)</h3>
+
+<ul>
+<li>Remove depricated function</li>
+<li>Rewrite in CoffeeScript</li>
+</ul><h3>0.4.1 (December 8, 2011)</h3>
+
+<ul>
+<li>Fix issue #8</li>
+</ul><h3>0.4.0 (December 8, 2011)</h3>
+
+<ul>
+<li>Added specs for jQuery Role</li>
+<li>Selectors performance improvement for modern browsers (also covers #6)</li>
+<li>Role extension for querySelectorAll function (<code>src/role.coffee</code>)</li>
+</ul><h3>0.3.2 (June 2, 2011)</h3>
+
+<ul>
+<li>Reverted changes made in 0.3.1 because issue #6</li>
+</ul><h3>0.3.1 (May 24, 2011)</h3>
+
+<ul>
+<li>Selectors performance improvement for modern browsers</li>
+</ul><h3>0.3.0 (May 23, 2011)</h3>
+
+<ul>
+<li>Added native Sizzle selectors support (<code>$('@ajax_link')</code>)</li>
+</ul><h3>0.2.0 (May 20, 2011)</h3>
+
+<ul>
+<li>Added mechanism to pick roles by element id</li>
+</ul><h3>0.1.0 (May 05, 2011)</h3>
+
+<ul>
+<li>Initial release</li>
+</ul><h2>Contributors</h2>
+
+<p>Original idea by <a href="https://github.com/kossnocorp" class="user-mention">@kossnocorp</a> and <a href="https://github.com/ai" class="user-mention">@ai</a>.</p>
+
+<ul>
+<li><a href="https://github.com/kossnocorp" class="user-mention">@kossnocorp</a></li>
+<li><a href="https://github.com/chrome" class="user-mention">@chrome</a></li>
+<li><a href="https://github.com/rwz" class="user-mention">@rwz</a></li>
+<li><a href="https://github.com/yury" class="user-mention">@yury</a></li>
+</ul><p>Special thanks to <a href="https://github.com/skfd" class="user-mention">@skfd</a> and <a href="https://github.com/yaroslav" class="user-mention">@yaroslav</a> for helping with this README.</p>
+
+<h2>License</h2>
+
+<p>The MIT License</p>
+
+<p>Copyright (c) 2011 Sasha Koss</p>
+
+<p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
+
+<p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
+
+<p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
+ </section>
+ <footer>
+ <p>This project is maintained by <a href="https://github.com/kossnocorp">kossnocorp</a></p>
+ <p><small>Hosted on GitHub Pages &mdash; Theme by <a href="https://github.com/orderedlist">orderedlist</a></small></p>
+ </footer>
+ </div>
+ <script src="javascripts/scale.fix.js"></script>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ try {
+ var pageTracker = _gat._getTracker("UA-17373037-3");
+ pageTracker._trackPageview();
+ } catch(err) {}
+ </script>
+
+ </body>
+</html>
17 javascripts/scale.fix.js
@@ -0,0 +1,17 @@
+var metas = document.getElementsByTagName('meta');
+var i;
+if (navigator.userAgent.match(/iPhone/i)) {
+ for (i=0; i<metas.length; i++) {
+ if (metas[i].name == "viewport") {
+ metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
+ }
+ }
+ document.addEventListener("gesturestart", gestureStart, false);
+}
+function gestureStart() {
+ for (i=0; i<metas.length; i++) {
+ if (metas[i].name == "viewport") {
+ metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";
+ }
+ }
+}
1 params.json
@@ -0,0 +1 @@
+{"name":"Role","body":"# jquery.role — jQuery plugin to provide easy way to handle DOM elements by role attribute\r\n\r\nThis project uses [Semantic Versioning](http://semver.org/) for release numbering.\r\n\r\nSponsored by [Evil Martians](http://evilmartians.com/).\r\n\r\n## Downloads\r\n\r\n* [jquery.role.min.js](https://raw.github.com/kossnocorp/role/master/lib/jquery.role.min.js)\r\n* [role.min.js](https://raw.github.com/kossnocorp/role/master/lib/jquery.role.min.js)\r\n* [jquery.role.js](https://raw.github.com/kossnocorp/role/master/lib/jquery.role.js)\r\n* [role.js](https://raw.github.com/kossnocorp/role/master/lib/role.js)\r\n\r\nAlso you can add jquery.role.js and role.js by bundle `role-rails` gem. For futher details see *installation* section below.\r\n\r\n## Use `role` attribute FTW\r\n\r\n```\r\nUse cases for a role attribute for HTML5, include:\r\n\r\n* accessibility,\r\n* device adaptation,\r\n* server-side processing, and\r\n* complex data description.\r\n```\r\n\r\nThis is a quote from [W3C Specification on Role attribute](http://www.w3.org/wiki/PF/XTech/HTML5/RoleAttribute#A_Role_Attribute_for_HTML5).\r\n\r\nIn [Evil Martians](http://evilmartians.com/) we came up with a way to use this attribute for our own purposes.\r\n\r\nSay you have to update your website page design. HTML markup is done and you have to apply it to the existing site. Of course this marvelous page is crammed with Javascript code tied to an existing structure.\r\n\r\n``` javascript\r\n$('.list .item img')\r\n .mouseenter(function () {\r\n $(this).rotateTo(30, 300)\r\n })\r\n .mouseleave(function () {\r\n $(this).rotateTo(0, 300)\r\n });\r\n```\r\n\r\nObviously, you'll have to rewrite all the selectors for the new layout. And it would be nice if you had to fix only one (or even ten) of these selectors. In reality, most likely, there will be several dozen of them.\r\n\r\nAnother issue is that refactoring process requires you to change the names or a number of classes. You'll have to muddle through every JS file to find all classes you are going to change.\r\n\r\nAnd, of course, in both cases the end result is absolutely unpredictable, because layout alone is not enougn to figure out if a class is actualy used in JS.\r\n\r\nThe `.js-class_name` prefix use may seem like a good idea, except that someone will surely add styles to this class in a future... Let alone the difficulty to spot, among a large of number of classes, one with a prefix.\r\n\r\nIn order to avoid this problems, we can \"attach\" JS to DOM elements by a `role` attribute.\r\n\r\nIt's a lot safer then prefixes, beacause it's much harder to attach styles to `role` and it feals morally difficult to break the `role` use convention.\r\n\r\nWith the use of `role`, layout update becomes very straightforward: you just have to add roles to a new element, and if you are not tied to the \"magic numbers\" -- it will work with no further hassle.\r\n\r\nTo make life easier (shoutout to [@alex_chrome](https://twitter.com/#!/alex_chrome) for the great idea) we also extended jQuery selector syntax:\r\n\r\n``` javascript\r\n$('@list @item @image')\r\n .mouseenter(function () {\r\n $(this).rotateTo(30, 300)\r\n })\r\n .mouseleave(function () {\r\n $(this).rotateTo(0, 300)\r\n });\r\n```\r\n\r\n`$('@list @item @image')` is the same as `$('[role=\"list\"] [role=\"item] [role=\"image\"]')` and you can use \"multirole\": `$('@list@coupons')`.\r\n\r\nIn addition to the jQuery plug-in, I also wrote a version that extends `querySelectorAll` of [Zepto.js](http://zeptojs.com/) with a Role functionality.\r\n\r\nUsing of 'role' in a query may work a bit slower compared to usual selectors, but it's neglectable even in a large number of queries.\r\n\r\nIn addition to `role`, I sometimes use `id`, but only in very extraodinary cases — because if there is only single element on a page today, it may happen that there will be a few tomorrow, even if that wasn't planned.\r\n\r\n## Usage\r\n\r\n### Using selectors\r\n\r\nYou can use shortcut `@` in jQuery selectors to find elements with roles.\r\n\r\nWill select all elements in document with `role=\"ajax-link\"`:\r\n\r\n``` js\r\n$('@ajax-link')\r\n```\r\n\r\nAlso you can combinate roles:\r\n\r\n`<form role=\"form login_form\"></form>`:\r\n\r\n``` js\r\n$('@form@login_form')\r\n```\r\n\r\nWill select all forms with \"form\" as role `<form role=\"form login_form\"></form><form role=\"form registration_form\"></form>`:\r\n\r\n``` js\r\n$('@form')\r\n```\r\n\r\nYou can combine role with other selectors, but that is not recommended:\r\n\r\n`<form class=\"dark\" role=\"login_form\" method=\"post\"></form>`:\r\n\r\n``` js\r\n$('form.dark@login_form[method=post]')\r\n```\r\n\r\n## Installation\r\n\r\nComing soon.\r\n\r\n## Changelog\r\n\r\n### 1.2.0 (April 19, 2012)\r\n\r\n* Total rewrite. jQuery versions 1.2-1.7 compatibility (@rwz)\r\n\r\n### 1.0.2 (March 14, 2012)\r\n\r\n* Fixes problem in Internet Explorer 8 in jquery.role.js and role.js (issue #11) (thanks @igor-alexandrov for help)\r\n\r\n### 1.0.1 (January 27, 2012)\r\n\r\n* Fixes problem with multiple roles in Firefox 8 and later (issue #9)\r\n\r\n### 1.0.0 (December 26, 2011)\r\n\r\n* Remove depricated function\r\n* Rewrite in CoffeeScript\r\n\r\n### 0.4.1 (December 8, 2011)\r\n\r\n* Fix issue #8\r\n\r\n### 0.4.0 (December 8, 2011)\r\n\r\n* Added specs for jQuery Role\r\n* Selectors performance improvement for modern browsers (also covers #6)\r\n* Role extension for querySelectorAll function (`src/role.coffee`)\r\n\r\n### 0.3.2 (June 2, 2011)\r\n\r\n* Reverted changes made in 0.3.1 because issue #6\r\n\r\n### 0.3.1 (May 24, 2011)\r\n\r\n* Selectors performance improvement for modern browsers\r\n\r\n### 0.3.0 (May 23, 2011)\r\n\r\n* Added native Sizzle selectors support (`$('@ajax_link')`)\r\n\r\n### 0.2.0 (May 20, 2011)\r\n\r\n* Added mechanism to pick roles by element id\r\n\r\n### 0.1.0 (May 05, 2011)\r\n\r\n* Initial release\r\n\r\n## Contributors\r\n\r\nOriginal idea by @kossnocorp and @ai.\r\n\r\n* @kossnocorp\r\n* @chrome\r\n* @rwz\r\n* @yury\r\n\r\nSpecial thanks to @skfd and @yaroslav for helping with this README.\r\n\r\n## License\r\n\r\nThe MIT License\r\n\r\nCopyright (c) 2011 Sasha Koss\r\n\r\nPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\r\n\r\nThe above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\r\n","tagline":"jQuery plugin to provide easy way to handle DOM elements by role attribute","google":"UA-17373037-3","note":"Don't delete this file! It's used internally to help with page regeneration."}
69 stylesheets/pygment_trac.css
@@ -0,0 +1,69 @@
+.highlight { background: #ffffff; }
+.highlight .c { color: #999988; font-style: italic } /* Comment */
+.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.highlight .k { font-weight: bold } /* Keyword */
+.highlight .o { font-weight: bold } /* Operator */
+.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
+.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #aa0000 } /* Generic.Error */
+.highlight .gh { color: #999999 } /* Generic.Heading */
+.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
+.highlight .go { color: #888888 } /* Generic.Output */
+.highlight .gp { color: #555555 } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #800080; font-weight: bold; } /* Generic.Subheading */
+.highlight .gt { color: #aa0000 } /* Generic.Traceback */
+.highlight .kc { font-weight: bold } /* Keyword.Constant */
+.highlight .kd { font-weight: bold } /* Keyword.Declaration */
+.highlight .kn { font-weight: bold } /* Keyword.Namespace */
+.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
+.highlight .kr { font-weight: bold } /* Keyword.Reserved */
+.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.highlight .m { color: #009999 } /* Literal.Number */
+.highlight .s { color: #d14 } /* Literal.String */
+.highlight .na { color: #008080 } /* Name.Attribute */
+.highlight .nb { color: #0086B3 } /* Name.Builtin */
+.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+.highlight .no { color: #008080 } /* Name.Constant */
+.highlight .ni { color: #800080 } /* Name.Entity */
+.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+.highlight .nn { color: #555555 } /* Name.Namespace */
+.highlight .nt { color: #000080 } /* Name.Tag */
+.highlight .nv { color: #008080 } /* Name.Variable */
+.highlight .ow { font-weight: bold } /* Operator.Word */
+.highlight .w { color: #bbbbbb } /* Text.Whitespace */
+.highlight .mf { color: #009999 } /* Literal.Number.Float */
+.highlight .mh { color: #009999 } /* Literal.Number.Hex */
+.highlight .mi { color: #009999 } /* Literal.Number.Integer */
+.highlight .mo { color: #009999 } /* Literal.Number.Oct */
+.highlight .sb { color: #d14 } /* Literal.String.Backtick */
+.highlight .sc { color: #d14 } /* Literal.String.Char */
+.highlight .sd { color: #d14 } /* Literal.String.Doc */
+.highlight .s2 { color: #d14 } /* Literal.String.Double */
+.highlight .se { color: #d14 } /* Literal.String.Escape */
+.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
+.highlight .si { color: #d14 } /* Literal.String.Interpol */
+.highlight .sx { color: #d14 } /* Literal.String.Other */
+.highlight .sr { color: #009926 } /* Literal.String.Regex */
+.highlight .s1 { color: #d14 } /* Literal.String.Single */
+.highlight .ss { color: #990073 } /* Literal.String.Symbol */
+.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #008080 } /* Name.Variable.Class */
+.highlight .vg { color: #008080 } /* Name.Variable.Global */
+.highlight .vi { color: #008080 } /* Name.Variable.Instance */
+.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
+
+.type-csharp .highlight .k { color: #0000FF }
+.type-csharp .highlight .kt { color: #0000FF }
+.type-csharp .highlight .nf { color: #000000; font-weight: normal }
+.type-csharp .highlight .nc { color: #2B91AF }
+.type-csharp .highlight .nn { color: #000000 }
+.type-csharp .highlight .s { color: #A31515 }
+.type-csharp .highlight .sc { color: #A31515 }
255 stylesheets/styles.css
@@ -0,0 +1,255 @@
+@import url(https://fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700);
+
+body {
+ padding:50px;
+ font:14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
+ color:#777;
+ font-weight:300;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ color:#222;
+ margin:0 0 20px;
+}
+
+p, ul, ol, table, pre, dl {
+ margin:0 0 20px;
+}
+
+h1, h2, h3 {
+ line-height:1.1;
+}
+
+h1 {
+ font-size:28px;
+}
+
+h2 {
+ color:#393939;
+}
+
+h3, h4, h5, h6 {
+ color:#494949;
+}
+
+a {
+ color:#39c;
+ font-weight:400;
+ text-decoration:none;
+}
+
+a small {
+ font-size:11px;
+ color:#777;
+ margin-top:-0.6em;
+ display:block;
+}
+
+.wrapper {
+ width:860px;
+ margin:0 auto;
+}
+
+blockquote {
+ border-left:1px solid #e5e5e5;
+ margin:0;
+ padding:0 0 0 20px;
+ font-style:italic;
+}
+
+code, pre {
+ font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal;
+ color:#333;
+ font-size:12px;
+}
+
+pre {
+ padding:8px 15px;
+ background: #f8f8f8;
+ border-radius:5px;
+ border:1px solid #e5e5e5;
+ overflow-x: auto;
+}
+
+table {
+ width:100%;
+ border-collapse:collapse;
+}
+
+th, td {
+ text-align:left;
+ padding:5px 10px;
+ border-bottom:1px solid #e5e5e5;
+}
+
+dt {
+ color:#444;
+ font-weight:700;
+}
+
+th {
+ color:#444;
+}
+
+img {
+ max-width:100%;
+}
+
+header {
+ width:270px;
+ float:left;
+ position:fixed;
+}
+
+header ul {
+ list-style:none;
+ height:40px;
+
+ padding:0;
+
+ background: #eee;
+ background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
+ background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
+ background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
+ background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
+ background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
+
+ border-radius:5px;
+ border:1px solid #d2d2d2;
+ box-shadow:inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
+ width:270px;
+}
+
+header li {
+ width:89px;
+ float:left;
+ border-right:1px solid #d2d2d2;
+ height:40px;
+}
+
+header ul a {
+ line-height:1;
+ font-size:11px;
+ color:#999;
+ display:block;
+ text-align:center;
+ padding-top:6px;
+ height:40px;
+}
+
+strong {
+ color:#222;
+ font-weight:700;
+}
+
+header ul li + li {
+ width:88px;
+ border-left:1px solid #fff;
+}
+
+header ul li + li + li {
+ border-right:none;
+ width:89px;
+}
+
+header ul a strong {
+ font-size:14px;
+ display:block;
+ color:#222;
+}
+
+section {
+ width:500px;
+ float:right;
+ padding-bottom:50px;
+}
+
+small {
+ font-size:11px;
+}
+
+hr {
+ border:0;
+ background:#e5e5e5;
+ height:1px;
+ margin:0 0 20px;
+}
+
+footer {
+ width:270px;
+ float:left;
+ position:fixed;
+ bottom:50px;
+}
+
+@media print, screen and (max-width: 960px) {
+
+ div.wrapper {
+ width:auto;
+ margin:0;
+ }
+
+ header, section, footer {
+ float:none;
+ position:static;
+ width:auto;
+ }
+
+ header {
+ padding-right:320px;
+ }
+
+ section {
+ border:1px solid #e5e5e5;
+ border-width:1px 0;
+ padding:20px 0;
+ margin:0 0 20px;
+ }
+
+ header a small {
+ display:inline;
+ }
+
+ header ul {
+ position:absolute;
+ right:50px;
+ top:52px;
+ }
+}
+
+@media print, screen and (max-width: 720px) {
+ body {
+ word-wrap:break-word;
+ }
+
+ header {
+ padding:0;
+ }
+
+ header ul, header p.view {
+ position:static;
+ }
+
+ pre, code {
+ word-wrap:normal;
+ }
+}
+
+@media print, screen and (max-width: 480px) {
+ body {
+ padding:15px;
+ }
+
+ header ul {
+ display:none;
+ }
+}
+
+@media print {
+ body {
+ padding:0.4in;
+ font-size:12pt;
+ color:#444;
+ }
+}

0 comments on commit 0400551

Please sign in to comment.
Something went wrong with that request. Please try again.