pen-rails 0.0.2 → 0.0.3

Sign up to get free protection for your applications and to get access to all the features.
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
-