pen-rails 0.0.2 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +3 -3
  3. data/lib/pen-rails/version.rb +1 -1
  4. metadata +5 -14
  5. data/vendor/assets/fonts/fontello.eot +0 -0
  6. data/vendor/assets/fonts/fontello.svg +0 -36
  7. data/vendor/assets/fonts/fontello.ttf +0 -0
  8. data/vendor/assets/fonts/fontello.woff +0 -0
  9. data/vendor/assets/javascripts/backbone-validation.js +0 -605
  10. data/vendor/assets/javascripts/markdown.js +0 -72
  11. data/vendor/assets/javascripts/pen.js +0 -368
  12. data/vendor/assets/stylesheets/pen.css +0 -658
data/vendor/assets/javascripts/markdown.js DELETED
@@ -1,72 +0,0 @@
1
- /*! Licensed under MIT, https://github.com/sofish/pen */
2
- (function() {
3
-
4
- // only works with Pen
5
- if(!this.Pen) return;
6
-
7
- // markdown covertor obj
8
- var covertor = {
9
- keymap: { '96': '`', '62': '>', '49': '1', '46': '.', '45': '-', '42': '*', '35': '#'},
10
- stack : []
11
- };
12
-
13
- // return valid markdown syntax
14
- covertor.valid = function(str) {
15
- var len = str.length;
16
-
17
- if(str.match(/[#]{1,6}/)) {
18
- return ['h' + len, len];
19
- } else if(str === '```') {
20
- return ['pre', len];
21
- } else if(str === '>') {
22
- return ['blockquote', len];
23
- } else if(str === '1.') {
24
- return ['insertorderedlist', len];
25
- } else if(str === '-' || str === '*') {
26
- return ['insertunorderedlist', len];
27
- } else if(str.match(/(?:\.|\*|\-){3,}/)) {
28
- return ['inserthorizontalrule', len];
29
- }
30
- };
31
-
32
- // parse command
33
- covertor.parse = function(e) {
34
- var code = e.keyCode || e.which;
35
-
36
- // when `space` is pressed
37
- if(code === 32) {
38
- var cmd = this.stack.join('');
39
- this.stack.length = 0;
40
- return this.valid(cmd);
41
- }
42
-
43
- // make cmd
44
- if(this.keymap[code]) this.stack.push(this.keymap[code]);
45
-
46
- return false;
47
- };
48
-
49
- // exec command
50
- covertor.action = function(pen, cmd) {
51
-
52
- // only apply effect at line start
53
- if(pen._sel.focusOffset > cmd[1]) return;
54
-
55
- var node = pen._sel.focusNode;
56
- node.textContent = node.textContent.slice(cmd[1]);
57
- pen._actions(cmd[0]);
58
- pen.nostyle();
59
- };
60
-
61
- // init covertor
62
- covertor.init = function(pen) {
63
- pen.config.editor.addEventListener('keypress', function(e) {
64
- var cmd = covertor.parse(e);
65
- if(cmd) return covertor.action(pen, cmd);
66
- });
67
- };
68
-
69
- // append to Pen
70
- window.Pen.prototype.markdown = covertor;
71
-
72
- }());
data/vendor/assets/javascripts/pen.js DELETED
@@ -1,368 +0,0 @@
1
- /*! Licensed under MIT, https://github.com/sofish/pen */
2
- /* jshint -W030, -W093, -W015 */
3
- (function(doc) {
4
-
5
- var Pen, FakePen, utils = {};
6
-
7
- // type detect
8
- utils.is = function(obj, type) {
9
- return Object.prototype.toString.call(obj).slice(8, -1) === type;
10
- };
11
-
12
- // copy props from a obj
13
- utils.copy = function(defaults, source) {
14
- for(var p in source) {
15
- if(source.hasOwnProperty(p)) {
16
- var val = source[p];
17
- defaults[p] = this.is(val, 'Object') ? this.copy({}, val) :
18
- this.is(val, 'Array') ? this.copy([], val) : val;
19
- }
20
- }
21
- return defaults;
22
- };
23
-
24
- // log
25
- utils.log = function(message, force) {
26
- if(window._pen_debug_mode_on || force) console.log('%cPEN DEBUGGER: %c' + message, 'font-family:arial,sans-serif;color:#1abf89;line-height:2em;', 'font-family:cursor,monospace;color:#333;');
27
- };
28
-
29
- // shift a function
30
- utils.shift = function(key, fn, time) {
31
- time = time || 50;
32
- var queue = this['_shift_fn' + key], timeout = 'shift_timeout' + key, current;
33
- queue ? queue.concat([fn, time]) : (queue = [[fn, time]]);
34
- current = queue.pop();
35
- clearTimeout(this[timeout]);
36
- this[timeout] = setTimeout(function() {
37
- current[0]();
38
- }, time);
39
- };
40
-
41
- // merge: make it easy to have a fallback
42
- utils.merge = function(config) {
43
-
44
- // default settings
45
- var defaults = {
46
- class: 'pen',
47
- debug: false,
48
- stay: config.stay || !config.debug,
49
- textarea: '<textarea name="content"></textarea>',
50
- list: [
51
- 'blockquote', 'h2', 'h3', 'p', 'insertorderedlist', 'insertunorderedlist', 'inserthorizontalrule',
52
- 'indent', 'outdent', 'bold', 'italic', 'underline', 'createlink'
53
- ]
54
- };
55
-
56
- // user-friendly config
57
- if(config.nodeType === 1) {
58
- defaults.editor = config;
59
- } else if(config.match && config.match(/^#[\S]+$/)) {
60
- defaults.editor = document.getElementById(config.slice(1));
61
- } else {
62
- defaults = utils.copy(defaults, config);
63
- }
64
-
65
- return defaults;
66
- };
67
-
68
- Pen = function(config) {
69
-
70
- if(!config) return utils.log('can\'t find config', true);
71
-
72
- // merge user config
73
- var defaults = utils.merge(config);
74
-
75
- if(defaults.editor.nodeType !== 1) return utils.log('can\'t find editor');
76
- if(defaults.debug) window._pen_debug_mode_on = true;
77
-
78
- var editor = defaults.editor;
79
-
80
- // set default class
81
- editor.classList.add(defaults.class);
82
-
83
- // set contenteditable
84
- var editable = editor.getAttribute('contenteditable');
85
- if(!editable) editor.setAttribute('contenteditable', 'true');
86
-
87
- // assign config
88
- this.config = defaults;
89
-
90
- // save the selection obj
91
- this._sel = doc.getSelection();
92
-
93
- // map actions
94
- this.actions();
95
-
96
- // enable toolbar
97
- this.toolbar();
98
-
99
- // enable markdown covert
100
- this.markdown && this.markdown.init(this);
101
-
102
- // stay on the page
103
- this.config.stay && this.stay();
104
- };
105
-
106
- // node effects
107
- Pen.prototype._effectNode = function(el, returnAsNodeName) {
108
- var nodes = [];
109
- while(el !== this.config.editor) {
110
- if(el.nodeName.match(/(?:[pubia]|h[1-6]|blockquote|[uo]l|li)/i)) {
111
- nodes.push(returnAsNodeName ? el.nodeName.toLowerCase() : el);
112
- }
113
- el = el.parentNode;
114
- }
115
- return nodes;
116
- };
117
-
118
- // remove style attr
119
- Pen.prototype.nostyle = function() {
120
- var els = this.config.editor.querySelectorAll('[style]');
121
- [].slice.call(els).forEach(function(item) {
122
- item.removeAttribute('style');
123
- });
124
- return this;
125
- };
126
-
127
- Pen.prototype.toolbar = function() {
128
-
129
- var that = this, icons = '';
130
-
131
- for(var i = 0, list = this.config.list; i < list.length; i++) {
132
- var name = list[i], klass = 'pen-icon icon-' + name;
133
- icons += '<i class="' + klass + '" data-action="' + name + '">' + (name.match(/^h[1-6]|p$/i) ? name.toUpperCase() : '') + '</i>';
134
- if((name === 'createlink')) icons += '<input class="pen-input" placeholder="http://" />';
135
- }
136
-
137
- var menu = doc.createElement('div');
138
- menu.setAttribute('class', this.config.class + '-menu pen-menu');
139
- menu.innerHTML = icons;
140
- menu.style.display = 'none';
141
-
142
- doc.body.appendChild((this._menu = menu));
143
-
144
- var setpos = function() {
145
- if(menu.style.display === 'block') that.menu();
146
- };
147
-
148
- // change menu offset when window resize / scroll
149
- window.addEventListener('resize', setpos);
150
- window.addEventListener('scroll', setpos);
151
-
152
- var editor = this.config.editor;
153
- var toggle = function() {
154
-
155
- if(that._isDestroyed) return;
156
-
157
- utils.shift('toggle_menu', function() {
158
- var range = that._sel;
159
- if(!range.isCollapsed) {
160
- //show menu
161
- that._range = range.getRangeAt(0);
162
- that.menu().highlight();
163
- } else {
164
- //hide menu
165
- that._menu.style.display = 'none';
166
- }
167
- }, 200);
168
- };
169
-
170
- // toggle toolbar on mouse select
171
- editor.addEventListener('mouseup', toggle);
172
-
173
- // toggle toolbar on key select
174
- editor.addEventListener('keyup', toggle);
175
-
176
- // toggle toolbar on key select
177
- menu.addEventListener('click', function(e) {
178
- var action = e.target.getAttribute('data-action');
179
-
180
- if(!action) return;
181
-
182
- var apply = function(value) {
183
- that._sel.removeAllRanges();
184
- that._sel.addRange(that._range);
185
- that._actions(action, value);
186
- that._range = that._sel.getRangeAt(0);
187
- that.highlight().nostyle().menu();
188
- };
189
-
190
- // create link
191
- if(action === 'createlink') {
192
- var input = menu.getElementsByTagName('input')[0], createlink;
193
-
194
- input.style.display = 'block';
195
- input.focus();
196
-
197
- createlink = function(input) {
198
- input.style.display = 'none';
199
- if(input.value) return apply(input.value.replace(/(^\s+)|(\s+$)/g, '').replace(/^(?!http:\/\/|https:\/\/)(.*)$/, 'http://$1'));
200
- action = 'unlink';
201
- apply();
202
- };
203
-
204
- return input.onkeypress = function(e) {
205
- if(e.which === 13) return createlink(e.target);
206
- };
207
- }
208
-
209
- apply();
210
- });
211
-
212
- return this;
213
- };
214
-
215
- // highlight menu
216
- Pen.prototype.highlight = function() {
217
- var node = this._sel.focusNode
218
- , effects = this._effectNode(node)
219
- , menu = this._menu
220
- , linkInput = menu.querySelector('input')
221
- , highlight;
222
-
223
- // remove all highlights
224
- [].slice.call(menu.querySelectorAll('.active')).forEach(function(el) {
225
- el.classList.remove('active');
226
- });
227
-
228
- // display link input if createlink enabled
229
- if (linkInput) linkInput.style.display = 'none';
230
-
231
- highlight = function(str) {
232
- var selector = '.icon-' + str
233
- , el = menu.querySelector(selector);
234
- return el && el.classList.add('active');
235
- };
236
-
237
- effects.forEach(function(item) {
238
- var tag = item.nodeName.toLowerCase();
239
- switch(tag) {
240
- case 'a': return (menu.querySelector('input').value = item.href), highlight('createlink');
241
- case 'i': return highlight('italic');
242
- case 'u': return highlight('underline');
243
- case 'b': return highlight('bold');
244
- case 'ul': return highlight('insertunorderedlist');
245
- case 'ol': return highlight('insertorderedlist');
246
- case 'ol': return highlight('insertorderedlist');
247
- case 'li': return highlight('indent');
248
- default : highlight(tag);
249
- }
250
- });
251
-
252
- return this;
253
- };
254
-
255
- Pen.prototype.actions = function() {
256
- var that = this, reg, block, overall, insert;
257
-
258
- // allow command list
259
- reg = {
260
- block: /^(?:p|h[1-6]|blockquote|pre)$/,
261
- inline: /^(?:bold|italic|underline|insertorderedlist|insertunorderedlist|indent|outdent)$/,
262
- source: /^(?:insertimage|createlink|unlink)$/,
263
- insert: /^(?:inserthorizontalrule|insert)$/
264
- };
265
-
266
- overall = function(cmd, val) {
267
- var message = ' to exec 「' + cmd + '」 command' + (val ? (' with value: ' + val) : '');
268
- if(document.execCommand(cmd, false, val) && that.config.debug) {
269
- utils.log('success' + message);
270
- } else {
271
- utils.log('fail' + message);
272
- }
273
- };
274
-
275
- insert = function(name) {
276
- var range = that._sel.getRangeAt(0)
277
- , node = range.startContainer;
278
-
279
- while(node.nodeType !== 1) {
280
- node = node.parentNode;
281
- }
282
-
283
- range.selectNode(node);
284
- range.collapse(false);
285
- return overall(name);
286
- };
287
-
288
- block = function(name) {
289
- if(that._effectNode(that._sel.getRangeAt(0).startContainer, true).indexOf(name) !== -1) {
290
- if(name === 'blockquote') return document.execCommand('outdent', false, null);
291
- name = 'p';
292
- }
293
- return overall('formatblock', name);
294
- };
295
-
296
- this._actions = function(name, value) {
297
- if(name.match(reg.block)) {
298
- block(name);
299
- } else if(name.match(reg.inline) || name.match(reg.source)) {
300
- overall(name, value);
301
- } else if(name.match(reg.insert)) {
302
- insert(name);
303
- } else {
304
- if(this.config.debug) utils.log('can not find command function for name: ' + name + (value ? (', value: ' + value) : ''));
305
- }
306
- };
307
-
308
- return this;
309
- };
310
-
311
- // show menu
312
- Pen.prototype.menu = function() {
313
-
314
- var offset = this._range.getBoundingClientRect()
315
- , top = offset.top - 10
316
- , left = offset.left + (offset.width / 2)
317
- , menu = this._menu;
318
-
319
- // display block to caculate it's width & height
320
- menu.style.display = 'block';
321
- menu.style.top = top - menu.clientHeight + 'px';
322
- menu.style.left = left - (menu.clientWidth/2) + 'px';
323
-
324
- return this;
325
- };
326
-
327
- Pen.prototype.stay = function() {
328
- var that = this;
329
- !window.onbeforeunload && (window.onbeforeunload = function() {
330
- if(!that._isDestroyed) return 'Are you going to leave here?';
331
- });
332
- };
333
-
334
- Pen.prototype.destroy = function(isAJoke) {
335
- var destroy = isAJoke ? false : true
336
- , attr = isAJoke ? 'setAttribute' : 'removeAttribute';
337
-
338
- if(!isAJoke) {
339
- this._sel.removeAllRanges();
340
- this._menu.style.display = 'none';
341
- }
342
- this._isDestroyed = destroy;
343
- this.config.editor[attr]('contenteditable', '');
344
-
345
- return this;
346
- };
347
-
348
- Pen.prototype.rebuild = function() {
349
- return this.destroy('it\'s a joke');
350
- };
351
-
352
- // a fallback for old browers
353
- FakePen = function(config) {
354
- if(!config) return utils.log('can\'t find config', true);
355
-
356
- var defaults = utils.merge(config)
357
- , klass = defaults.editor.getAttribute('class');
358
-
359
- klass = klass ? klass.replace(/\bpen\b/g, '') + ' pen-textarea ' + defaults.class : 'pen pen-textarea';
360
- defaults.editor.setAttribute('class', klass);
361
- defaults.editor.innerHTML = defaults.textarea;
362
- return defaults.editor;
363
- };
364
-
365
- // make it accessible
366
- this.Pen = doc.getSelection ? Pen : FakePen;
367
-
368
- }(document));
data/vendor/assets/stylesheets/pen.css DELETED
@@ -1,658 +0,0 @@
1
-
2
-
3
-
4
-
5
-
6
- <!DOCTYPE html>
7
- <html>
8
- <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# object: http://ogp.me/ns/object# article: http://ogp.me/ns/article# profile: http://ogp.me/ns/profile#">
9
- <meta charset='utf-8'>
10
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
11
- <title>pen/src/pen.css at master · sofish/pen · GitHub</title>
12
- <link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="GitHub" />
13
- <link rel="fluid-icon" href="https://github.com/fluidicon.png" title="GitHub" />
14
- <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-114.png" />
15
- <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114.png" />
16
- <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-144.png" />
17
- <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144.png" />
18
- <link rel="logo" type="image/svg" href="https://github-media-downloads.s3.amazonaws.com/github-logo.svg" />
19
- <meta property="fb:app_id" content="1401488693436528"/>
20
- <meta content="@github" name="twitter:site" /><meta content="summary" name="twitter:card" /><meta content="sofish/pen" name="twitter:title" /><meta content="pen - enjoy live editing (+markdown)" name="twitter:description" /><meta content="https://1.gravatar.com/avatar/713d89c43a5897bd68824fe74f8e7677?d=https%3A%2F%2Fidenticons.github.com%2F2a2082392dfb32b984e6f20663604707.png&amp;r=x&amp;s=400" name="twitter:image:src" />
21
- <meta content="GitHub" property="og:site_name" /><meta content="object" property="og:type" /><meta content="https://1.gravatar.com/avatar/713d89c43a5897bd68824fe74f8e7677?d=https%3A%2F%2Fidenticons.github.com%2F2a2082392dfb32b984e6f20663604707.png&amp;r=x&amp;s=400" property="og:image" /><meta content="sofish/pen" property="og:title" /><meta content="https://github.com/sofish/pen" property="og:url" /><meta content="pen - enjoy live editing (+markdown)" property="og:description" />
22
-
23
- <meta name="hostname" content="github-fe128-cp1-prd.iad.github.net">
24
- <meta name="ruby" content="ruby 2.1.0p0-github-tcmalloc (60139581e1) [x86_64-linux]">
25
- <link rel="assets" href="https://github.global.ssl.fastly.net/">
26
- <link rel="conduit-xhr" href="https://ghconduit.com:25035/">
27
- <link rel="xhr-socket" href="/_sockets" />
28
-
29
-
30
-
31
- <meta name="msapplication-TileImage" content="/windows-tile.png" />
32
- <meta name="msapplication-TileColor" content="#ffffff" />
33
- <meta name="selected-link" value="repo_source" data-pjax-transient />
34
- <meta content="collector.githubapp.com" name="octolytics-host" /><meta content="collector-cdn.github.com" name="octolytics-script-host" /><meta content="github" name="octolytics-app-id" /><meta content="7B9EAC38:60F5:70EA7B4:52E35434" name="octolytics-dimension-request_id" />
35
-
36
-
37
-
38
-
39
- <link rel="icon" type="image/x-icon" href="/favicon.ico" />
40
-
41
- <meta content="authenticity_token" name="csrf-param" />
42
- <meta content="n37zREjZ3w68oNUCmzixPfr/d0NikHikjkrWwP+ZLcY=" name="csrf-token" />
43
-
44
- <link href="https://github.global.ssl.fastly.net/assets/github-960ac8d7e9aa944b5db837f22d370249be81f6c3.css" media="all" rel="stylesheet" type="text/css" />
45
- <link href="https://github.global.ssl.fastly.net/assets/github2-50d34ba98a0e848baeea02822c5a73e9cd6fc35c.css" media="all" rel="stylesheet" type="text/css" />
46
-
47
-
48
-
49
- <script src="https://github.global.ssl.fastly.net/assets/frameworks-9cbac03425d4357e382e314714edc0965d30cf57.js" type="text/javascript"></script>
50
- <script async="async" defer="defer" src="https://github.global.ssl.fastly.net/assets/github-2ba3fb4d3ba5647e0f21c27da0b612a29e1e387c.js" type="text/javascript"></script>
51
-
52
- <meta http-equiv="x-pjax-version" content="5622baad0eb34a0b5958544a2ec7311a">
53
-
54
- <link data-pjax-transient rel='permalink' href='/sofish/pen/blob/cf1b9fc9f8900a2737b886dbbc5db7fee91810f3/src/pen.css'>
55
-
56
- <meta name="description" content="pen - enjoy live editing (+markdown)" />
57
-
58
- <meta content="153183" name="octolytics-dimension-user_id" /><meta content="sofish" name="octolytics-dimension-user_login" /><meta content="12464962" name="octolytics-dimension-repository_id" /><meta content="sofish/pen" name="octolytics-dimension-repository_nwo" /><meta content="true" name="octolytics-dimension-repository_public" /><meta content="false" name="octolytics-dimension-repository_is_fork" /><meta content="12464962" name="octolytics-dimension-repository_network_root_id" /><meta content="sofish/pen" name="octolytics-dimension-repository_network_root_nwo" />
59
- <link href="https://github.com/sofish/pen/commits/master.atom" rel="alternate" title="Recent Commits to pen:master" type="application/atom+xml" />
60
-
61
- </head>
62
-
63
-
64
- <body class="logged_out env-production vis-public page-blob">
65
- <div class="wrapper">
66
-
67
-
68
-
69
-
70
-
71
-
72
-
73
- <div class="header header-logged-out">
74
- <div class="container clearfix">
75
-
76
- <a class="header-logo-wordmark" href="https://github.com/">
77
- <span class="mega-octicon octicon-logo-github"></span>
78
- </a>
79
-
80
- <div class="header-actions">
81
- <a class="button primary" href="/join">Sign up</a>
82
- <a class="button signin" href="/login?return_to=%2Fsofish%2Fpen%2Fblob%2Fmaster%2Fsrc%2Fpen.css">Sign in</a>
83
- </div>
84
-
85
- <div class="command-bar js-command-bar in-repository">
86
-
87
- <ul class="top-nav">
88
- <li class="explore"><a href="/explore">Explore</a></li>
89
- <li class="features"><a href="/features">Features</a></li>
90
- <li class="enterprise"><a href="https://enterprise.github.com/">Enterprise</a></li>
91
- <li class="blog"><a href="/blog">Blog</a></li>
92
- </ul>
93
- <form accept-charset="UTF-8" action="/search" class="command-bar-form" id="top_search_form" method="get">
94
-
95
- <input type="text" data-hotkey="/ s" name="q" id="js-command-bar-field" placeholder="Search or type a command" tabindex="1" autocapitalize="off"
96
-
97
-
98
- data-repo="sofish/pen"
99
- data-branch="master"
100
- data-sha="5d5af01442f58f1799992fc1c63dba1611beec3c"
101
- >
102
-
103
- <input type="hidden" name="nwo" value="sofish/pen" />
104
-
105
- <div class="select-menu js-menu-container js-select-menu search-context-select-menu">
106
- <span class="minibutton select-menu-button js-menu-target">
107
- <span class="js-select-button">This repository</span>
108
- </span>
109
-
110
- <div class="select-menu-modal-holder js-menu-content js-navigation-container">
111
- <div class="select-menu-modal">
112
-
113
- <div class="select-menu-item js-navigation-item js-this-repository-navigation-item selected">
114
- <span class="select-menu-item-icon octicon octicon-check"></span>
115
- <input type="radio" class="js-search-this-repository" name="search_target" value="repository" checked="checked" />
116
- <div class="select-menu-item-text js-select-button-text">This repository</div>
117
- </div> <!-- /.select-menu-item -->
118
-
119
- <div class="select-menu-item js-navigation-item js-all-repositories-navigation-item">
120
- <span class="select-menu-item-icon octicon octicon-check"></span>
121
- <input type="radio" name="search_target" value="global" />
122
- <div class="select-menu-item-text js-select-button-text">All repositories</div>
123
- </div> <!-- /.select-menu-item -->
124
-
125
- </div>
126
- </div>
127
- </div>
128
-
129
- <span class="octicon help tooltipped downwards" title="Show command bar help">
130
- <span class="octicon octicon-question"></span>
131
- </span>
132
-
133
-
134
- <input type="hidden" name="ref" value="cmdform">
135
-
136
- </form>
137
- </div>
138
-
139
- </div>
140
- </div>
141
-
142
-
143
-
144
-
145
-
146
- <div class="site" itemscope itemtype="http://schema.org/WebPage">
147
-
148
- <div class="pagehead repohead instapaper_ignore readability-menu">
149
- <div class="container">
150
-
151
-
152
- <ul class="pagehead-actions">
153
-
154
-
155
- <li>
156
- <a href="/login?return_to=%2Fsofish%2Fpen"
157
- class="minibutton with-count js-toggler-target star-button tooltipped upwards"
158
- title="You must be signed in to use this feature" rel="nofollow">
159
- <span class="octicon octicon-star"></span>Star
160
- </a>
161
-
162
- <a class="social-count js-social-count" href="/sofish/pen/stargazers">
163
- 1,703
164
- </a>
165
-
166
- </li>
167
-
168
- <li>
169
- <a href="/login?return_to=%2Fsofish%2Fpen"
170
- class="minibutton with-count js-toggler-target fork-button tooltipped upwards"
171
- title="You must be signed in to fork a repository" rel="nofollow">
172
- <span class="octicon octicon-git-branch"></span>Fork
173
- </a>
174
- <a href="/sofish/pen/network" class="social-count">
175
- 144
176
- </a>
177
- </li>
178
- </ul>
179
-
180
- <h1 itemscope itemtype="http://data-vocabulary.org/Breadcrumb" class="entry-title public">
181
- <span class="repo-label"><span>public</span></span>
182
- <span class="mega-octicon octicon-repo"></span>
183
- <span class="author">
184
- <a href="/sofish" class="url fn" itemprop="url" rel="author"><span itemprop="title">sofish</span></a>
185
- </span>
186
- <span class="repohead-name-divider">/</span>
187
- <strong><a href="/sofish/pen" class="js-current-repository js-repo-home-link">pen</a></strong>
188
-
189
- <span class="page-context-loader">
190
- <img alt="Octocat-spinner-32" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
191
- </span>
192
-
193
- </h1>
194
- </div><!-- /.container -->
195
- </div><!-- /.repohead -->
196
-
197
- <div class="container">
198
-
199
-
200
- <div class="repository-with-sidebar repo-container ">
201
-
202
- <div class="repository-sidebar">
203
-
204
-
205
- <div class="sunken-menu vertical-right repo-nav js-repo-nav js-repository-container-pjax js-octicon-loaders">
206
- <div class="sunken-menu-contents">
207
- <ul class="sunken-menu-group">
208
- <li class="tooltipped leftwards" title="Code">
209
- <a href="/sofish/pen" aria-label="Code" class="selected js-selected-navigation-item sunken-menu-item" data-gotokey="c" data-pjax="true" data-selected-links="repo_source repo_downloads repo_commits repo_tags repo_branches /sofish/pen">
210
- <span class="octicon octicon-code"></span> <span class="full-word">Code</span>
211
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
212
- </a> </li>
213
-
214
- <li class="tooltipped leftwards" title="Issues">
215
- <a href="/sofish/pen/issues" aria-label="Issues" class="js-selected-navigation-item sunken-menu-item js-disable-pjax" data-gotokey="i" data-selected-links="repo_issues /sofish/pen/issues">
216
- <span class="octicon octicon-issue-opened"></span> <span class="full-word">Issues</span>
217
- <span class='counter'>31</span>
218
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
219
- </a> </li>
220
-
221
- <li class="tooltipped leftwards" title="Pull Requests">
222
- <a href="/sofish/pen/pulls" aria-label="Pull Requests" class="js-selected-navigation-item sunken-menu-item js-disable-pjax" data-gotokey="p" data-selected-links="repo_pulls /sofish/pen/pulls">
223
- <span class="octicon octicon-git-pull-request"></span> <span class="full-word">Pull Requests</span>
224
- <span class='counter'>5</span>
225
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
226
- </a> </li>
227
-
228
-
229
- </ul>
230
- <div class="sunken-menu-separator"></div>
231
- <ul class="sunken-menu-group">
232
-
233
- <li class="tooltipped leftwards" title="Pulse">
234
- <a href="/sofish/pen/pulse" aria-label="Pulse" class="js-selected-navigation-item sunken-menu-item" data-pjax="true" data-selected-links="pulse /sofish/pen/pulse">
235
- <span class="octicon octicon-pulse"></span> <span class="full-word">Pulse</span>
236
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
237
- </a> </li>
238
-
239
- <li class="tooltipped leftwards" title="Graphs">
240
- <a href="/sofish/pen/graphs" aria-label="Graphs" class="js-selected-navigation-item sunken-menu-item" data-pjax="true" data-selected-links="repo_graphs repo_contributors /sofish/pen/graphs">
241
- <span class="octicon octicon-graph"></span> <span class="full-word">Graphs</span>
242
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
243
- </a> </li>
244
-
245
- <li class="tooltipped leftwards" title="Network">
246
- <a href="/sofish/pen/network" aria-label="Network" class="js-selected-navigation-item sunken-menu-item js-disable-pjax" data-selected-links="repo_network /sofish/pen/network">
247
- <span class="octicon octicon-git-branch"></span> <span class="full-word">Network</span>
248
- <img alt="Octocat-spinner-32" class="mini-loader" height="16" src="https://github.global.ssl.fastly.net/images/spinners/octocat-spinner-32.gif" width="16" />
249
- </a> </li>
250
- </ul>
251
-
252
-
253
- </div>
254
- </div>
255
-
256
- <div class="only-with-full-nav">
257
-
258
-
259
-
260
-
261
- <div class="clone-url open"
262
- data-protocol-type="http"
263
- data-url="/users/set_protocol?protocol_selector=http&amp;protocol_type=clone">
264
- <h3><strong>HTTPS</strong> clone URL</h3>
265
- <div class="clone-url-box">
266
- <input type="text" class="clone js-url-field"
267
- value="https://github.com/sofish/pen.git" readonly="readonly">
268
-
269
- <span class="js-zeroclipboard url-box-clippy minibutton zeroclipboard-button" data-clipboard-text="https://github.com/sofish/pen.git" data-copied-hint="copied!" title="copy to clipboard"><span class="octicon octicon-clippy"></span></span>
270
- </div>
271
- </div>
272
-
273
-
274
-
275
- <div class="clone-url "
276
- data-protocol-type="subversion"
277
- data-url="/users/set_protocol?protocol_selector=subversion&amp;protocol_type=clone">
278
- <h3><strong>Subversion</strong> checkout URL</h3>
279
- <div class="clone-url-box">
280
- <input type="text" class="clone js-url-field"
281
- value="https://github.com/sofish/pen" readonly="readonly">
282
-
283
- <span class="js-zeroclipboard url-box-clippy minibutton zeroclipboard-button" data-clipboard-text="https://github.com/sofish/pen" data-copied-hint="copied!" title="copy to clipboard"><span class="octicon octicon-clippy"></span></span>
284
- </div>
285
- </div>
286
-
287
-
288
- <p class="clone-options">You can clone with
289
- <a href="#" class="js-clone-selector" data-protocol="http">HTTPS</a>,
290
- or <a href="#" class="js-clone-selector" data-protocol="subversion">Subversion</a>.
291
- <span class="octicon help tooltipped upwards" title="Get help on which URL is right for you.">
292
- <a href="https://help.github.com/articles/which-remote-url-should-i-use">
293
- <span class="octicon octicon-question"></span>
294
- </a>
295
- </span>
296
- </p>
297
-
298
-
299
-
300
- <a href="/sofish/pen/archive/master.zip"
301
- class="minibutton sidebar-button"
302
- title="Download this repository as a zip file"
303
- rel="nofollow">
304
- <span class="octicon octicon-cloud-download"></span>
305
- Download ZIP
306
- </a>
307
- </div>
308
- </div><!-- /.repository-sidebar -->
309
-
310
- <div id="js-repo-pjax-container" class="repository-content context-loader-container" data-pjax-container>
311
-
312
-
313
-
314
- <!-- blob contrib key: blob_contributors:v21:9219040c9c2ec3058ae45f4586b035e7 -->
315
-
316
- <p title="This is a placeholder element" class="js-history-link-replace hidden"></p>
317
-
318
- <a href="/sofish/pen/find/master" data-pjax data-hotkey="t" class="js-show-file-finder" style="display:none">Show File Finder</a>
319
-
320
- <div class="file-navigation">
321
-
322
-
323
- <div class="select-menu js-menu-container js-select-menu" >
324
- <span class="minibutton select-menu-button js-menu-target" data-hotkey="w"
325
- data-master-branch="master"
326
- data-ref="master"
327
- role="button" aria-label="Switch branches or tags" tabindex="0">
328
- <span class="octicon octicon-git-branch"></span>
329
- <i>branch:</i>
330
- <span class="js-select-button">master</span>
331
- </span>
332
-
333
- <div class="select-menu-modal-holder js-menu-content js-navigation-container" data-pjax>
334
-
335
- <div class="select-menu-modal">
336
- <div class="select-menu-header">
337
- <span class="select-menu-title">Switch branches/tags</span>
338
- <span class="octicon octicon-remove-close js-menu-close"></span>
339
- </div> <!-- /.select-menu-header -->
340
-
341
- <div class="select-menu-filters">
342
- <div class="select-menu-text-filter">
343
- <input type="text" aria-label="Filter branches/tags" id="context-commitish-filter-field" class="js-filterable-field js-navigation-enable" placeholder="Filter branches/tags">
344
- </div>
345
- <div class="select-menu-tabs">
346
- <ul>
347
- <li class="select-menu-tab">
348
- <a href="#" data-tab-filter="branches" class="js-select-menu-tab">Branches</a>
349
- </li>
350
- <li class="select-menu-tab">
351
- <a href="#" data-tab-filter="tags" class="js-select-menu-tab">Tags</a>
352
- </li>
353
- </ul>
354
- </div><!-- /.select-menu-tabs -->
355
- </div><!-- /.select-menu-filters -->
356
-
357
- <div class="select-menu-list select-menu-tab-bucket js-select-menu-tab-bucket" data-tab-filter="branches">
358
-
359
- <div data-filterable-for="context-commitish-filter-field" data-filterable-type="substring">
360
-
361
-
362
- <div class="select-menu-item js-navigation-item ">
363
- <span class="select-menu-item-icon octicon octicon-check"></span>
364
- <a href="/sofish/pen/blob/gh-pages/src/pen.css"
365
- data-name="gh-pages"
366
- data-skip-pjax="true"
367
- rel="nofollow"
368
- class="js-navigation-open select-menu-item-text js-select-button-text css-truncate-target"
369
- title="gh-pages">gh-pages</a>
370
- </div> <!-- /.select-menu-item -->
371
- <div class="select-menu-item js-navigation-item selected">
372
- <span class="select-menu-item-icon octicon octicon-check"></span>
373
- <a href="/sofish/pen/blob/master/src/pen.css"
374
- data-name="master"
375
- data-skip-pjax="true"
376
- rel="nofollow"
377
- class="js-navigation-open select-menu-item-text js-select-button-text css-truncate-target"
378
- title="master">master</a>
379
- </div> <!-- /.select-menu-item -->
380
- </div>
381
-
382
- <div class="select-menu-no-results">Nothing to show</div>
383
- </div> <!-- /.select-menu-list -->
384
-
385
- <div class="select-menu-list select-menu-tab-bucket js-select-menu-tab-bucket" data-tab-filter="tags">
386
- <div data-filterable-for="context-commitish-filter-field" data-filterable-type="substring">
387
-
388
-
389
- <div class="select-menu-item js-navigation-item ">
390
- <span class="select-menu-item-icon octicon octicon-check"></span>
391
- <a href="/sofish/pen/tree/0.0.1/src/pen.css"
392
- data-name="0.0.1"
393
- data-skip-pjax="true"
394
- rel="nofollow"
395
- class="js-navigation-open select-menu-item-text js-select-button-text css-truncate-target"
396
- title="0.0.1">0.0.1</a>
397
- </div> <!-- /.select-menu-item -->
398
- </div>
399
-
400
- <div class="select-menu-no-results">Nothing to show</div>
401
- </div> <!-- /.select-menu-list -->
402
-
403
- </div> <!-- /.select-menu-modal -->
404
- </div> <!-- /.select-menu-modal-holder -->
405
- </div> <!-- /.select-menu -->
406
-
407
- <div class="breadcrumb">
408
- <span class='repo-root js-repo-root'><span itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/sofish/pen" data-branch="master" data-direction="back" data-pjax="true" itemscope="url"><span itemprop="title">pen</span></a></span></span><span class="separator"> / </span><span itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/sofish/pen/tree/master/src" data-branch="master" data-direction="back" data-pjax="true" itemscope="url"><span itemprop="title">src</span></a></span><span class="separator"> / </span><strong class="final-path">pen.css</strong> <span class="js-zeroclipboard minibutton zeroclipboard-button" data-clipboard-text="src/pen.css" data-copied-hint="copied!" title="copy to clipboard"><span class="octicon octicon-clippy"></span></span>
409
- </div>
410
- </div>
411
-
412
-
413
-
414
- <div class="commit file-history-tease">
415
- <img class="main-avatar" height="24" src="https://1.gravatar.com/avatar/713d89c43a5897bd68824fe74f8e7677?d=https%3A%2F%2Fidenticons.github.com%2F2a2082392dfb32b984e6f20663604707.png&amp;r=x&amp;s=140" width="24" />
416
- <span class="author"><a href="/sofish" rel="author">sofish</a></span>
417
- <time class="js-relative-date" datetime="2013-09-15T00:01:39-07:00" title="2013-09-15 00:01:39">September 15, 2013</time>
418
- <div class="commit-title">
419
- <a href="/sofish/pen/commit/a605648c5a22387ddbf56360056a60b2d675963c" class="message" data-pjax="true" title="add a high z-index to toolbar">add a high z-index to toolbar</a>
420
- </div>
421
-
422
- <div class="participation">
423
- <p class="quickstat"><a href="#blob_contributors_box" rel="facebox"><strong>1</strong> contributor</a></p>
424
-
425
- </div>
426
- <div id="blob_contributors_box" style="display:none">
427
- <h2 class="facebox-header">Users who have contributed to this file</h2>
428
- <ul class="facebox-user-list">
429
- <li class="facebox-user-list-item">
430
- <img height="24" src="https://1.gravatar.com/avatar/713d89c43a5897bd68824fe74f8e7677?d=https%3A%2F%2Fidenticons.github.com%2F2a2082392dfb32b984e6f20663604707.png&amp;r=x&amp;s=140" width="24" />
431
- <a href="/sofish">sofish</a>
432
- </li>
433
- </ul>
434
- </div>
435
- </div>
436
-
437
- <div id="files" class="bubble">
438
- <div class="file">
439
- <div class="meta">
440
- <div class="info">
441
- <span class="icon"><b class="octicon octicon-file-text"></b></span>
442
- <span class="mode" title="File Mode">file</span>
443
- <span>104 lines (95 sloc)</span>
444
- <span>5.493 kb</span>
445
- </div>
446
- <div class="actions">
447
- <div class="button-group">
448
- <a class="minibutton disabled tooltipped leftwards" href="#"
449
- title="You must be signed in to make or propose changes">Edit</a>
450
- <a href="/sofish/pen/raw/master/src/pen.css" class="button minibutton " id="raw-url">Raw</a>
451
- <a href="/sofish/pen/blame/master/src/pen.css" class="button minibutton ">Blame</a>
452
- <a href="/sofish/pen/commits/master/src/pen.css" class="button minibutton " rel="nofollow">History</a>
453
- </div><!-- /.button-group -->
454
- <a class="minibutton danger disabled empty-icon tooltipped leftwards" href="#"
455
- title="You must be signed in to make or propose changes">
456
- Delete
457
- </a>
458
- </div><!-- /.actions -->
459
-
460
- </div>
461
- <div class="blob-wrapper data type-css js-blob-data">
462
- <table class="file-code file-diff">
463
- <tr class="file-code-line">
464
- <td class="blob-line-nums">
465
- <span id="L1" rel="#L1">1</span>
466
- <span id="L2" rel="#L2">2</span>
467
- <span id="L3" rel="#L3">3</span>
468
- <span id="L4" rel="#L4">4</span>
469
- <span id="L5" rel="#L5">5</span>
470
- <span id="L6" rel="#L6">6</span>
471
- <span id="L7" rel="#L7">7</span>
472
- <span id="L8" rel="#L8">8</span>
473
- <span id="L9" rel="#L9">9</span>
474
- <span id="L10" rel="#L10">10</span>
475
- <span id="L11" rel="#L11">11</span>
476
- <span id="L12" rel="#L12">12</span>
477
- <span id="L13" rel="#L13">13</span>
478
- <span id="L14" rel="#L14">14</span>
479
- <span id="L15" rel="#L15">15</span>
480
- <span id="L16" rel="#L16">16</span>
481
- <span id="L17" rel="#L17">17</span>
482
- <span id="L18" rel="#L18">18</span>
483
- <span id="L19" rel="#L19">19</span>
484
- <span id="L20" rel="#L20">20</span>
485
- <span id="L21" rel="#L21">21</span>
486
- <span id="L22" rel="#L22">22</span>
487
- <span id="L23" rel="#L23">23</span>
488
- <span id="L24" rel="#L24">24</span>
489
- <span id="L25" rel="#L25">25</span>
490
- <span id="L26" rel="#L26">26</span>
491
- <span id="L27" rel="#L27">27</span>
492
- <span id="L28" rel="#L28">28</span>
493
- <span id="L29" rel="#L29">29</span>
494
- <span id="L30" rel="#L30">30</span>
495
- <span id="L31" rel="#L31">31</span>
496
- <span id="L32" rel="#L32">32</span>
497
- <span id="L33" rel="#L33">33</span>
498
- <span id="L34" rel="#L34">34</span>
499
- <span id="L35" rel="#L35">35</span>
500
- <span id="L36" rel="#L36">36</span>
501
- <span id="L37" rel="#L37">37</span>
502
- <span id="L38" rel="#L38">38</span>
503
- <span id="L39" rel="#L39">39</span>
504
- <span id="L40" rel="#L40">40</span>
505
- <span id="L41" rel="#L41">41</span>
506
- <span id="L42" rel="#L42">42</span>
507
- <span id="L43" rel="#L43">43</span>
508
- <span id="L44" rel="#L44">44</span>
509
- <span id="L45" rel="#L45">45</span>
510
- <span id="L46" rel="#L46">46</span>
511
- <span id="L47" rel="#L47">47</span>
512
- <span id="L48" rel="#L48">48</span>
513
- <span id="L49" rel="#L49">49</span>
514
- <span id="L50" rel="#L50">50</span>
515
- <span id="L51" rel="#L51">51</span>
516
- <span id="L52" rel="#L52">52</span>
517
- <span id="L53" rel="#L53">53</span>
518
- <span id="L54" rel="#L54">54</span>
519
- <span id="L55" rel="#L55">55</span>
520
- <span id="L56" rel="#L56">56</span>
521
- <span id="L57" rel="#L57">57</span>
522
- <span id="L58" rel="#L58">58</span>
523
- <span id="L59" rel="#L59">59</span>
524
- <span id="L60" rel="#L60">60</span>
525
- <span id="L61" rel="#L61">61</span>
526
- <span id="L62" rel="#L62">62</span>
527
- <span id="L63" rel="#L63">63</span>
528
- <span id="L64" rel="#L64">64</span>
529
- <span id="L65" rel="#L65">65</span>
530
- <span id="L66" rel="#L66">66</span>
531
- <span id="L67" rel="#L67">67</span>
532
- <span id="L68" rel="#L68">68</span>
533
- <span id="L69" rel="#L69">69</span>
534
- <span id="L70" rel="#L70">70</span>
535
- <span id="L71" rel="#L71">71</span>
536
- <span id="L72" rel="#L72">72</span>
537
- <span id="L73" rel="#L73">73</span>
538
- <span id="L74" rel="#L74">74</span>
539
- <span id="L75" rel="#L75">75</span>
540
- <span id="L76" rel="#L76">76</span>
541
- <span id="L77" rel="#L77">77</span>
542
- <span id="L78" rel="#L78">78</span>
543
- <span id="L79" rel="#L79">79</span>
544
- <span id="L80" rel="#L80">80</span>
545
- <span id="L81" rel="#L81">81</span>
546
- <span id="L82" rel="#L82">82</span>
547
- <span id="L83" rel="#L83">83</span>
548
- <span id="L84" rel="#L84">84</span>
549
- <span id="L85" rel="#L85">85</span>
550
- <span id="L86" rel="#L86">86</span>
551
- <span id="L87" rel="#L87">87</span>
552
- <span id="L88" rel="#L88">88</span>
553
- <span id="L89" rel="#L89">89</span>
554
- <span id="L90" rel="#L90">90</span>
555
- <span id="L91" rel="#L91">91</span>
556
- <span id="L92" rel="#L92">92</span>
557
- <span id="L93" rel="#L93">93</span>
558
- <span id="L94" rel="#L94">94</span>
559
- <span id="L95" rel="#L95">95</span>
560
- <span id="L96" rel="#L96">96</span>
561
- <span id="L97" rel="#L97">97</span>
562
- <span id="L98" rel="#L98">98</span>
563
- <span id="L99" rel="#L99">99</span>
564
- <span id="L100" rel="#L100">100</span>
565
- <span id="L101" rel="#L101">101</span>
566
- <span id="L102" rel="#L102">102</span>
567
- <span id="L103" rel="#L103">103</span>
568
- <span id="L104" rel="#L104">104</span>
569
-
570
- </td>
571
- <td class="blob-line-code">
572
- <div class="code-body highlight"><pre><div class='line' id='LC1'><span class="c">/*! Licensed under MIT, https://github.com/sofish/pen */</span></div><div class='line' id='LC2'><br/></div><div class='line' id='LC3'><span class="c">/* basic reset */</span></div><div class='line' id='LC4'><span class="nc">.pen</span><span class="o">,</span> <span class="nc">.pen-menu</span><span class="o">,</span> <span class="nc">.pen-input</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">textarea</span><span class="p">{</span><span class="k">font</span><span class="o">:</span><span class="m">400</span> <span class="m">1.16em</span><span class="o">/</span><span class="m">1</span><span class="o">.</span><span class="m">45</span> <span class="n">Palatino</span><span class="o">,</span> <span class="n">Optima</span><span class="o">,</span> <span class="n">Georgia</span><span class="o">,</span> <span class="k">serif</span><span class="p">;</span><span class="k">color</span><span class="o">:</span><span class="m">#331</span><span class="p">;}</span></div><div class='line' id='LC5'><span class="nc">.pen</span><span class="nd">:focus</span><span class="p">{</span><span class="k">outline</span><span class="o">:</span><span class="k">none</span><span class="p">;}</span></div><div class='line' id='LC6'><span class="nc">.pen</span> <span class="nt">fieldset</span><span class="o">,</span> <span class="nt">img</span> <span class="p">{</span><span class="k">border</span><span class="o">:</span> <span class="m">0</span><span class="p">;}</span></div><div class='line' id='LC7'><span class="nc">.pen</span> <span class="nt">blockquote</span><span class="p">{</span><span class="k">padding-left</span><span class="o">:</span><span class="m">10px</span><span class="p">;</span><span class="k">margin-left</span><span class="o">:-</span><span class="m">14px</span><span class="p">;</span><span class="k">border-left</span><span class="o">:</span><span class="m">4px</span> <span class="k">solid</span> <span class="m">#1abf89</span><span class="p">;}</span></div><div class='line' id='LC8'><span class="nc">.pen</span> <span class="nt">a</span><span class="p">{</span><span class="k">color</span><span class="o">:</span><span class="m">#1abf89</span><span class="p">;}</span></div><div class='line' id='LC9'><span class="nc">.pen</span> <span class="nt">del</span><span class="p">{</span><span class="k">text-decoration</span><span class="o">:</span><span class="k">line-through</span><span class="p">;}</span></div><div class='line' id='LC10'><span class="nc">.pen</span> <span class="nt">sub</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">sup</span> <span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">75</span><span class="o">%</span><span class="p">;</span><span class="k">position</span><span class="o">:</span><span class="k">relative</span><span class="p">;</span><span class="k">vertical-align</span><span class="o">:</span><span class="k">text</span><span class="o">-</span><span class="k">top</span><span class="err">\</span><span class="m">9</span><span class="p">;}</span></div><div class='line' id='LC11'><span class="nd">:root</span> <span class="nc">.pen</span> <span class="nt">sub</span><span class="o">,</span> <span class="nd">:root</span> <span class="nc">.pen</span> <span class="nt">sup</span><span class="p">{</span><span class="k">vertical-align</span><span class="o">:</span><span class="k">baseline</span><span class="p">;</span> <span class="c">/* for ie9 and other mordern browsers */</span><span class="p">}</span></div><div class='line' id='LC12'><span class="nc">.pen</span> <span class="nt">sup</span> <span class="p">{</span><span class="k">top</span><span class="o">:-</span><span class="m">0.5em</span><span class="p">;}</span></div><div class='line' id='LC13'><span class="nc">.pen</span> <span class="nt">sub</span> <span class="p">{</span><span class="k">bottom</span><span class="o">:-</span><span class="m">0.25em</span><span class="p">;}</span></div><div class='line' id='LC14'><span class="nc">.pen</span> <span class="nt">hr</span><span class="p">{</span><span class="k">border</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">border-bottom</span><span class="o">:</span><span class="m">1px</span> <span class="k">solid</span> <span class="m">#cfcfcf</span><span class="p">;</span><span class="k">margin-bottom</span><span class="o">:</span><span class="m">25px</span><span class="p">;</span><span class="o">*</span><span class="k">color</span><span class="o">:</span><span class="nb">pink</span><span class="p">;</span><span class="o">*</span><span class="n">filter</span><span class="o">:</span><span class="n">chroma</span><span class="p">(</span><span class="k">color</span><span class="o">=</span><span class="nb">pink</span><span class="p">);</span><span class="k">height</span><span class="o">:</span><span class="m">10px</span><span class="p">;</span><span class="o">*</span><span class="k">margin</span><span class="o">:-</span><span class="m">7px</span> <span class="m">0</span> <span class="m">15px</span><span class="p">;}</span></div><div class='line' id='LC15'><span class="nc">.pen</span> <span class="nt">small</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">0.8em</span><span class="p">;</span><span class="k">color</span><span class="o">:</span><span class="m">#888</span><span class="p">;}</span></div><div class='line' id='LC16'><span class="nc">.pen</span> <span class="nt">em</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">b</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">strong</span><span class="p">{</span><span class="k">font-weight</span><span class="o">:</span><span class="m">700</span><span class="p">;}</span></div><div class='line' id='LC17'><span class="nc">.pen</span> <span class="nt">pre</span><span class="p">{</span><span class="k">white-space</span><span class="o">:</span><span class="n">pre</span><span class="o">-</span><span class="n">wrap</span><span class="p">;</span><span class="k">padding</span><span class="o">:</span><span class="m">0.85em</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="m">#f8f8f8</span><span class="p">;}</span></div><div class='line' id='LC18'><br/></div><div class='line' id='LC19'><span class="c">/* block-level element margin */</span></div><div class='line' id='LC20'><span class="nc">.pen</span> <span class="nt">p</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">pre</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">ol</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">dl</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">form</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">table</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">blockquote</span><span class="p">{</span><span class="k">margin-bottom</span><span class="o">:</span><span class="m">16px</span><span class="p">;}</span></div><div class='line' id='LC21'><br/></div><div class='line' id='LC22'><span class="c">/* headers */</span></div><div class='line' id='LC23'><span class="nc">.pen</span> <span class="nt">h1</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h2</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h3</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h4</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h5</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h6</span><span class="p">{</span><span class="k">margin-bottom</span><span class="o">:</span><span class="m">16px</span><span class="p">;</span><span class="k">font-weight</span><span class="o">:</span><span class="m">700</span><span class="p">;</span><span class="k">line-height</span><span class="o">:</span><span class="m">1</span><span class="o">.</span><span class="m">2</span><span class="p">;}</span></div><div class='line' id='LC24'><span class="nc">.pen</span> <span class="nt">h1</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">2em</span><span class="p">;}</span></div><div class='line' id='LC25'><span class="nc">.pen</span> <span class="nt">h2</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">1.8em</span><span class="p">;}</span></div><div class='line' id='LC26'><span class="nc">.pen</span> <span class="nt">h3</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">1.6em</span><span class="p">;}</span></div><div class='line' id='LC27'><span class="nc">.pen</span> <span class="nt">h4</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">1.4em</span><span class="p">;}</span></div><div class='line' id='LC28'><span class="nc">.pen</span> <span class="nt">h5</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">h6</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">1.2em</span><span class="p">;}</span></div><div class='line' id='LC29'><br/></div><div class='line' id='LC30'><span class="c">/* list */</span></div><div class='line' id='LC31'><span class="nc">.pen</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">ol</span><span class="p">{</span><span class="k">margin-left</span><span class="o">:</span><span class="m">1.2em</span><span class="p">;}</span></div><div class='line' id='LC32'><span class="nc">.pen</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen-ul</span><span class="p">{</span><span class="k">list-style</span><span class="o">:</span><span class="k">disc</span><span class="p">;}</span></div><div class='line' id='LC33'><span class="nc">.pen</span> <span class="nt">ol</span><span class="o">,</span> <span class="nc">.pen-ol</span><span class="p">{</span><span class="k">list-style</span><span class="o">:</span><span class="k">decimal</span><span class="p">;}</span></div><div class='line' id='LC34'><span class="nc">.pen</span> <span class="nt">li</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen</span> <span class="nt">li</span> <span class="nt">ol</span><span class="o">,</span> <span class="nc">.pen-ul</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen-ul</span> <span class="nt">ol</span><span class="o">,</span> <span class="nc">.pen-ol</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen-ol</span> <span class="nt">ol</span><span class="p">{</span><span class="k">margin</span><span class="o">:</span><span class="m">0</span> <span class="m">2em</span> <span class="m">0</span> <span class="m">1.2em</span><span class="p">;}</span></div><div class='line' id='LC35'><span class="nc">.pen</span> <span class="nt">li</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen-ul</span> <span class="nt">ul</span><span class="o">,</span> <span class="nc">.pen-ol</span> <span class="nt">ul</span><span class="p">{</span><span class="k">list-style</span><span class="o">:</span> <span class="k">circle</span><span class="p">;}</span></div><div class='line' id='LC36'><br/></div><div class='line' id='LC37'><span class="c">/* pen menu */</span></div><div class='line' id='LC38'><span class="nc">.pen-menu</span><span class="o">,</span> <span class="nc">.pen-input</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">14px</span><span class="p">;</span><span class="k">line-height</span><span class="o">:</span><span class="m">1</span><span class="p">;}</span></div><div class='line' id='LC39'><span class="nc">.pen-menu</span><span class="p">{</span><span class="k">white-space</span><span class="o">:</span><span class="k">nowrap</span><span class="p">;</span><span class="n">box</span><span class="o">-</span><span class="n">shadow</span><span class="o">:</span><span class="m">1px</span> <span class="m">2px</span> <span class="m">3px</span> <span class="m">-2px</span> <span class="m">#222</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="m">#333</span><span class="p">;</span><span class="k">background-image</span><span class="o">:</span><span class="n">linear</span><span class="o">-</span><span class="n">gradient</span><span class="p">(</span><span class="n">to</span> <span class="k">bottom</span><span class="o">,</span> <span class="m">#222</span><span class="o">,</span> <span class="m">#333</span><span class="p">);</span><span class="k">opacity</span><span class="o">:</span><span class="m">0</span><span class="o">.</span><span class="m">9</span><span class="p">;</span><span class="k">position</span><span class="o">:</span><span class="k">fixed</span><span class="p">;</span><span class="k">height</span><span class="o">:</span><span class="m">36px</span><span class="p">;</span><span class="k">border</span><span class="o">:</span><span class="m">1px</span> <span class="k">solid</span> <span class="m">#333</span><span class="p">;</span><span class="k">border</span><span class="o">-</span><span class="n">radius</span><span class="o">:</span><span class="m">3px</span><span class="p">;</span><span class="k">display</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">z-index</span><span class="o">:</span><span class="m">1000</span><span class="p">;}</span></div><div class='line' id='LC40'><span class="nc">.pen-menu</span><span class="nd">:after</span> <span class="p">{</span><span class="k">top</span><span class="o">:</span><span class="m">100</span><span class="o">%</span><span class="p">;</span><span class="k">border</span><span class="o">:</span><span class="k">solid</span> <span class="k">transparent</span><span class="p">;</span><span class="k">content</span><span class="o">:</span><span class="s2">&quot; &quot;</span><span class="p">;</span><span class="k">height</span><span class="o">:</span><span class="m">0</span><span class="p">;</span><span class="k">width</span><span class="o">:</span><span class="m">0</span><span class="p">;</span><span class="k">position</span><span class="o">:</span><span class="k">absolute</span><span class="p">;</span><span class="k">pointer</span><span class="o">-</span><span class="n">events</span><span class="o">:</span><span class="k">none</span><span class="p">;}</span></div><div class='line' id='LC41'><span class="nc">.pen-menu</span><span class="nd">:after</span> <span class="p">{</span><span class="k">border-color</span><span class="o">:</span><span class="n">rgba</span><span class="p">(</span><span class="m">51</span><span class="o">,</span> <span class="m">51</span><span class="o">,</span> <span class="m">51</span><span class="o">,</span> <span class="m">0</span><span class="p">);</span><span class="k">border-top-color</span><span class="o">:</span><span class="m">#333</span><span class="p">;</span><span class="k">border-width</span><span class="o">:</span><span class="m">6px</span><span class="p">;</span><span class="k">left</span><span class="o">:</span><span class="m">50</span><span class="o">%</span><span class="p">;</span><span class="k">margin-left</span><span class="o">:-</span><span class="m">6px</span><span class="p">;}</span></div><div class='line' id='LC42'><span class="nc">.pen-icon</span><span class="p">{</span><span class="k">font</span><span class="o">:</span><span class="k">normal</span> <span class="m">900</span> <span class="m">16px</span><span class="o">/</span><span class="m">40px</span> <span class="n">Georgia</span> <span class="k">serif</span><span class="p">;</span><span class="k">min-width</span><span class="o">:</span><span class="m">20px</span><span class="p">;</span><span class="k">display</span><span class="o">:</span><span class="k">inline</span><span class="o">-</span><span class="k">block</span><span class="p">;</span><span class="k">padding</span><span class="o">:</span><span class="m">0</span> <span class="m">10px</span><span class="p">;</span><span class="k">height</span><span class="o">:</span><span class="m">36px</span><span class="p">;</span><span class="k">overflow</span><span class="o">:</span><span class="k">hidden</span><span class="p">;</span><span class="k">color</span><span class="o">:</span><span class="m">#fff</span><span class="p">;</span><span class="k">text-align</span><span class="o">:</span><span class="k">center</span><span class="p">;</span><span class="k">cursor</span><span class="o">:</span><span class="k">pointer</span><span class="p">;</span><span class="o">-</span><span class="n">moz</span><span class="o">-</span><span class="n">user</span><span class="o">-</span><span class="n">select</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="o">-</span><span class="n">webkit</span><span class="o">-</span><span class="n">user</span><span class="o">-</span><span class="n">select</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="o">-</span><span class="n">ms</span><span class="o">-</span><span class="n">user</span><span class="o">-</span><span class="n">select</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="n">user</span><span class="o">-</span><span class="n">select</span><span class="o">:</span><span class="k">none</span><span class="p">;}</span></div><div class='line' id='LC43'><span class="nc">.pen-icon</span><span class="nd">:first-of-type</span><span class="p">{</span><span class="k">border-top</span><span class="o">-</span><span class="k">left</span><span class="o">-</span><span class="n">radius</span><span class="o">:</span><span class="m">3px</span><span class="p">;</span><span class="k">border-bottom</span><span class="o">-</span><span class="k">left</span><span class="o">-</span><span class="n">radius</span><span class="o">:</span><span class="m">3px</span><span class="p">;}</span></div><div class='line' id='LC44'><span class="nc">.pen-icon</span><span class="nd">:last-of-type</span><span class="p">{</span><span class="k">border-top</span><span class="o">-</span><span class="k">right</span><span class="o">-</span><span class="n">radius</span><span class="o">:</span><span class="m">3px</span><span class="p">;</span><span class="k">border-bottom</span><span class="o">-</span><span class="k">right</span><span class="o">-</span><span class="n">radius</span><span class="o">:</span><span class="m">3px</span><span class="p">;}</span></div><div class='line' id='LC45'><span class="nc">.pen-icon</span><span class="nd">:hover</span><span class="p">{</span><span class="k">background</span><span class="o">:</span><span class="m">#000</span><span class="p">;}</span></div><div class='line' id='LC46'><span class="nc">.pen-icon.active</span><span class="p">{</span><span class="k">color</span><span class="o">:</span><span class="m">#1abf89</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="m">#000</span><span class="p">;</span><span class="n">box</span><span class="o">-</span><span class="n">shadow</span><span class="o">:</span><span class="k">inset</span> <span class="m">2px</span> <span class="m">2px</span> <span class="m">4px</span> <span class="m">#000</span><span class="p">;}</span></div><div class='line' id='LC47'><span class="nc">.pen-input</span><span class="p">{</span><span class="k">position</span><span class="o">:</span><span class="k">absolute</span><span class="p">;</span><span class="k">width</span><span class="o">:</span><span class="m">100</span><span class="o">%</span><span class="p">;</span><span class="k">left</span><span class="o">:</span><span class="m">0</span><span class="p">;</span><span class="k">top</span><span class="o">:</span><span class="m">0</span><span class="p">;</span><span class="k">height</span><span class="o">:</span><span class="m">36px</span><span class="p">;</span><span class="k">line-height</span><span class="o">:</span><span class="m">20px</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="m">#333</span><span class="p">;</span><span class="k">color</span><span class="o">:</span><span class="m">#fff</span><span class="p">;</span><span class="k">border</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">text-align</span><span class="o">:</span><span class="k">center</span><span class="p">;</span><span class="k">display</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">font-family</span><span class="o">:</span><span class="n">arial</span><span class="o">,</span> <span class="k">sans-serif</span><span class="p">;}</span></div><div class='line' id='LC48'><span class="nc">.pen-input</span><span class="nd">:focus</span><span class="p">{</span><span class="k">outline</span><span class="o">:</span><span class="k">none</span><span class="p">;}</span></div><div class='line' id='LC49'><br/></div><div class='line' id='LC50'><span class="nc">.pen-textarea</span><span class="p">{</span><span class="k">display</span><span class="o">:</span><span class="k">block</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="m">#f8f8f8</span><span class="p">;</span><span class="k">padding</span><span class="o">:</span><span class="m">20px</span><span class="p">;}</span></div><div class='line' id='LC51'><span class="nc">.pen</span> <span class="nt">textarea</span><span class="p">{</span><span class="k">font-size</span><span class="o">:</span><span class="m">14px</span><span class="p">;</span><span class="k">border</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">background</span><span class="o">:</span><span class="k">none</span><span class="p">;</span><span class="k">width</span><span class="o">:</span><span class="m">100</span><span class="o">%</span><span class="p">;</span><span class="n">_height</span><span class="o">:</span><span class="m">200px</span><span class="p">;</span><span class="k">min-height</span><span class="o">:</span><span class="m">200px</span><span class="p">;</span><span class="n">resize</span><span class="o">:</span><span class="k">none</span><span class="p">;}</span></div><div class='line' id='LC52'><br/></div><div class='line' id='LC53'><span class="k">@font-face</span> <span class="p">{</span></div><div class='line' id='LC54'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">font-family</span><span class="o">:</span> <span class="s1">&#39;pen&#39;</span><span class="o">;</span></div><div class='line' id='LC55'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">src</span><span class="o">:</span> <span class="nt">url</span><span class="o">(</span><span class="s1">&#39;font/fontello.eot?370dad08&#39;</span><span class="o">);</span></div><div class='line' id='LC56'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">src</span><span class="o">:</span> <span class="nt">url</span><span class="o">(</span><span class="s1">&#39;font/fontello.eot?370dad08#iefix&#39;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s1">&#39;embedded-opentype&#39;</span><span class="o">),</span></div><div class='line' id='LC57'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">url</span><span class="o">(</span><span class="s1">&#39;font/fontello.woff?370dad08&#39;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s1">&#39;woff&#39;</span><span class="o">),</span></div><div class='line' id='LC58'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">url</span><span class="o">(</span><span class="s1">&#39;font/fontello.ttf?370dad08&#39;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s1">&#39;truetype&#39;</span><span class="o">),</span></div><div class='line' id='LC59'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">url</span><span class="o">(</span><span class="s1">&#39;font/fontello.svg?370dad08#fontello&#39;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s1">&#39;svg&#39;</span><span class="o">);</span></div><div class='line' id='LC60'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">font-weight</span><span class="o">:</span> <span class="nt">normal</span><span class="o">;</span></div><div class='line' id='LC61'>&nbsp;&nbsp;&nbsp;&nbsp;<span class="nt">font-style</span><span class="o">:</span> <span class="nt">normal</span><span class="o">;</span></div><div class='line' id='LC62'><span class="p">}</span></div><div class='line' id='LC63'><br/></div><div class='line' id='LC64'><span class="nc">.pen-menu</span> <span class="o">[</span><span class="nt">class</span><span class="o">^=</span><span class="s2">&quot;icon-&quot;</span><span class="o">]</span><span class="nd">:before</span><span class="o">,</span> <span class="nc">.pen-menu</span> <span class="o">[</span><span class="nt">class</span><span class="o">*=</span><span class="s2">&quot; icon-&quot;</span><span class="o">]</span><span class="nd">:before</span> <span class="p">{</span></div><div class='line' id='LC65'>&nbsp;&nbsp;<span class="k">font-family</span><span class="o">:</span> <span class="s2">&quot;pen&quot;</span><span class="p">;</span></div><div class='line' id='LC66'>&nbsp;&nbsp;<span class="k">font-style</span><span class="o">:</span> <span class="k">normal</span><span class="p">;</span></div><div class='line' id='LC67'>&nbsp;&nbsp;<span class="k">font-weight</span><span class="o">:</span> <span class="k">normal</span><span class="p">;</span></div><div class='line' id='LC68'>&nbsp;&nbsp;<span class="k">speak</span><span class="o">:</span> <span class="k">none</span><span class="p">;</span></div><div class='line' id='LC69'>&nbsp;&nbsp;<span class="k">display</span><span class="o">:</span> <span class="k">inline</span><span class="o">-</span><span class="k">block</span><span class="p">;</span></div><div class='line' id='LC70'>&nbsp;&nbsp;<span class="k">text-decoration</span><span class="o">:</span> <span class="k">inherit</span><span class="p">;</span></div><div class='line' id='LC71'>&nbsp;&nbsp;<span class="k">width</span><span class="o">:</span> <span class="m">1em</span><span class="p">;</span></div><div class='line' id='LC72'>&nbsp;&nbsp;<span class="k">margin-right</span><span class="o">:</span> <span class="m">.2em</span><span class="p">;</span></div><div class='line' id='LC73'>&nbsp;&nbsp;<span class="k">text-align</span><span class="o">:</span> <span class="k">center</span><span class="p">;</span></div><div class='line' id='LC74'>&nbsp;&nbsp;<span class="k">font-variant</span><span class="o">:</span> <span class="k">normal</span><span class="p">;</span></div><div class='line' id='LC75'>&nbsp;&nbsp;<span class="k">text-transform</span><span class="o">:</span> <span class="k">none</span><span class="p">;</span></div><div class='line' id='LC76'>&nbsp;&nbsp;<span class="k">line-height</span><span class="o">:</span> <span class="m">1em</span><span class="p">;</span></div><div class='line' id='LC77'>&nbsp;&nbsp;<span class="k">margin-left</span><span class="o">:</span> <span class="m">.2em</span><span class="p">;</span></div><div class='line' id='LC78'><span class="p">}</span></div><div class='line' id='LC79'>&nbsp;</div><div class='line' id='LC80'><span class="nc">.pen-menu</span> <span class="nc">.icon-location</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e815&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC81'><span class="nc">.pen-menu</span> <span class="nc">.icon-fit</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80f&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC82'><span class="nc">.pen-menu</span> <span class="nc">.icon-bold</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e805&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC83'><span class="nc">.pen-menu</span> <span class="nc">.icon-italic</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e806&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC84'><span class="nc">.pen-menu</span> <span class="nc">.icon-justifyleft</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80a&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC85'><span class="nc">.pen-menu</span> <span class="nc">.icon-justifycenter</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80b&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC86'><span class="nc">.pen-menu</span> <span class="nc">.icon-justifyright</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80c&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC87'><span class="nc">.pen-menu</span> <span class="nc">.icon-justifyfull</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80d&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC88'><span class="nc">.pen-menu</span> <span class="nc">.icon-outdent</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e800&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC89'><span class="nc">.pen-menu</span> <span class="nc">.icon-indent</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e801&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC90'><span class="nc">.pen-menu</span> <span class="nc">.icon-mode</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e813&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC91'><span class="nc">.pen-menu</span> <span class="nc">.icon-fullscreen</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e80e&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC92'><span class="nc">.pen-menu</span> <span class="nc">.icon-insertunorderedlist</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e802&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC93'><span class="nc">.pen-menu</span> <span class="nc">.icon-insertorderedlist</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e803&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC94'><span class="nc">.pen-menu</span> <span class="nc">.icon-strikethrough</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e807&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC95'><span class="nc">.pen-menu</span> <span class="nc">.icon-underline</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e804&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC96'><span class="nc">.pen-menu</span> <span class="nc">.icon-blockquote</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e814&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC97'><span class="nc">.pen-menu</span> <span class="nc">.icon-undo</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e817&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC98'><span class="nc">.pen-menu</span> <span class="nc">.icon-pre</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e816&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC99'><span class="nc">.pen-menu</span> <span class="nc">.icon-unlink</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e811&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC100'><span class="nc">.pen-menu</span> <span class="nc">.icon-superscript</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e808&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC101'><span class="nc">.pen-menu</span> <span class="nc">.icon-subscript</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e809&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC102'><span class="nc">.pen-menu</span> <span class="nc">.icon-inserthorizontalrule</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e818&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC103'><span class="nc">.pen-menu</span> <span class="nc">.icon-pin</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e812&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div><div class='line' id='LC104'><span class="nc">.pen-menu</span> <span class="nc">.icon-createlink</span><span class="nd">:before</span> <span class="p">{</span> <span class="k">content</span><span class="o">:</span> <span class="s1">&#39;\e810&#39;</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* &#39;&#39; */</span></div></pre></div>
573
- </td>
574
- </tr>
575
- </table>
576
- </div>
577
-
578
- </div>
579
- </div>
580
-
581
- <a href="#jump-to-line" rel="facebox[.linejump]" data-hotkey="l" class="js-jump-to-line" style="display:none">Jump to Line</a>
582
- <div id="jump-to-line" style="display:none">
583
- <form accept-charset="UTF-8" class="js-jump-to-line-form">
584
- <input class="linejump-input js-jump-to-line-field" type="text" placeholder="Jump to line&hellip;" autofocus>
585
- <button type="submit" class="button">Go</button>
586
- </form>
587
- </div>
588
-
589
- </div>
590
-
591
- </div><!-- /.repo-container -->
592
- <div class="modal-backdrop"></div>
593
- </div><!-- /.container -->
594
- </div><!-- /.site -->
595
-
596
-
597
- </div><!-- /.wrapper -->
598
-
599
- <div class="container">
600
- <div class="site-footer">
601
- <ul class="site-footer-links right">
602
- <li><a href="https://status.github.com/">Status</a></li>
603
- <li><a href="http://developer.github.com">API</a></li>
604
- <li><a href="http://training.github.com">Training</a></li>
605
- <li><a href="http://shop.github.com">Shop</a></li>
606
- <li><a href="/blog">Blog</a></li>
607
- <li><a href="/about">About</a></li>
608
-
609
- </ul>
610
-
611
- <a href="/">
612
- <span class="mega-octicon octicon-mark-github" title="GitHub"></span>
613
- </a>
614
-
615
- <ul class="site-footer-links">
616
- <li>&copy; 2014 <span title="0.02269s from github-fe128-cp1-prd.iad.github.net">GitHub</span>, Inc.</li>
617
- <li><a href="/site/terms">Terms</a></li>
618
- <li><a href="/site/privacy">Privacy</a></li>
619
- <li><a href="/security">Security</a></li>
620
- <li><a href="/contact">Contact</a></li>
621
- </ul>
622
- </div><!-- /.site-footer -->
623
- </div><!-- /.container -->
624
-
625
-
626
- <div class="fullscreen-overlay js-fullscreen-overlay" id="fullscreen_overlay">
627
- <div class="fullscreen-container js-fullscreen-container">
628
- <div class="textarea-wrap">
629
- <textarea name="fullscreen-contents" id="fullscreen-contents" class="js-fullscreen-contents" placeholder="" data-suggester="fullscreen_suggester"></textarea>
630
- <div class="suggester-container">
631
- <div class="suggester fullscreen-suggester js-navigation-container" id="fullscreen_suggester"
632
- data-url="/sofish/pen/suggestions/commit">
633
- </div>
634
- </div>
635
- </div>
636
- </div>
637
- <div class="fullscreen-sidebar">
638
- <a href="#" class="exit-fullscreen js-exit-fullscreen tooltipped leftwards" title="Exit Zen Mode">
639
- <span class="mega-octicon octicon-screen-normal"></span>
640
- </a>
641
- <a href="#" class="theme-switcher js-theme-switcher tooltipped leftwards"
642
- title="Switch themes">
643
- <span class="octicon octicon-color-mode"></span>
644
- </a>
645
- </div>
646
- </div>
647
-
648
-
649
-
650
- <div id="ajax-error-message" class="flash flash-error">
651
- <span class="octicon octicon-alert"></span>
652
- <a href="#" class="octicon octicon-remove-close close js-ajax-error-dismiss"></a>
653
- Something went wrong with that request. Please try again.
654
- </div>
655
-
656
- </body>
657
- </html>
658
-