From c3f21df003e628eddf630ec20009bdb363d7d977 Mon Sep 17 00:00:00 2001 From: Klaus Silveira Date: Fri, 6 Jul 2012 10:57:37 -0300 Subject: [PATCH] The highlighter now uses a
 instead of a 
+        
{{ blob }}
{% endif %} diff --git a/web/css/style.css b/web/css/style.css index fbe7d25..78d4a0e 100644 --- a/web/css/style.css +++ b/web/css/style.css @@ -272,7 +272,7 @@ table .span24{float:none;width:1884px;margin-left:0;} .repository{margin-bottom:18px;border:1px solid #d7d7d7;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.repository .repository-header{border-bottom:1px solid #d7d7d7;text-shadow:1px 1px 1px #ffffff;padding:8px;font-weight:700;font-size:14px;} .repository .repository-body{padding:8px;background-color:#f7f7f7;}.repository .repository-body p{margin:0;} .readme-view{width:100%;margin-bottom:18px;border:1px solid #cacaca;}.readme-view .readme-header{padding:8px;line-height:18px;text-align:left;vertical-align:bottom;background-color:#f4f4f4;background-image:-moz-linear-gradient(top, #fafafa, #eaeaea);background-image:-ms-linear-gradient(top, #fafafa, #eaeaea);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#fafafa), to(#eaeaea));background-image:-webkit-linear-gradient(top, #fafafa, #eaeaea);background-image:-o-linear-gradient(top, #fafafa, #eaeaea);background-image:linear-gradient(top, #fafafa, #eaeaea);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fafafa', endColorstr='#eaeaea', GradientType=0);border-bottom:1px solid #d7d7d7;font-weight:bold;color:#555555;text-shadow:1px 1px 1px #ffffff;height:28px;}.readme-view .readme-header .meta{float:left;padding:4px 0;font-size:14px;} -.readme-view #readme-content{padding:30px;color:#000;} +.readme-view #readme-content{padding:30px;color:#000000;} .rss{display:inline-block;width:16px;height:16px;*margin-right:.3em;line-height:16px;vertical-align:text-top;background-image:url("../img/feed.png");background-position:0 0;background-repeat:no-repeat;}.rss:last-child{*margin-left:0;} [class^="icon-"],[class*=" icon-"]{display:inline-block;width:14px;height:14px;*margin-right:.3em;line-height:14px;vertical-align:text-top;background-image:url("../img/glyphicons-halflings.png");background-position:14px 14px;background-repeat:no-repeat;}[class^="icon-"]:last-child,[class*=" icon-"]:last-child{*margin-left:0;} .icon-white{background-image:url("../img/glyphicons-halflings-white.png");} @@ -744,11 +744,17 @@ a.label:hover,a.badge:hover{color:#ffffff;text-decoration:none;cursor:pointer;} .invisible{visibility:hidden;} .space-right{padding:0 8px 0 0;} .space-left{padding:0 0 0 8px;} -.CodeMirror{line-height:1em;font-family:Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;} -.CodeMirror-scroll{overflow:auto;height:500px;position:relative;outline:none;} +.CodeMirror{line-height:1em;font-family:Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;position:relative;overflow:hidden;} +.CodeMirror-scroll{overflow-x:auto;overflow-y:hidden;height:500px;position:relative;outline:none;} +.CodeMirror-scrollbar{float:right;overflow-x:hidden;overflow-y:scroll;margin-left:-1px;} +.CodeMirror-scrollbar-inner{width:1px;} +.CodeMirror-scrollbar.cm-sb-overlap{position:absolute;z-index:1;float:none;right:0;min-width:12px;} +.CodeMirror-scrollbar.cm-sb-nonoverlap{min-width:12px;} +.CodeMirror-scrollbar.cm-sb-ie7{min-width:18px;} .CodeMirror-gutter{position:absolute;left:0;top:0;z-index:10;background-color:#f7f7f7;border-right:1px solid #eee;min-width:2em;height:100%;} .CodeMirror-gutter-text{color:#aaa;text-align:right;padding:.4em .2em .4em .4em;white-space:pre !important;} -.CodeMirror-lines{padding:.4em;white-space:pre;} +.CodeMirror-lines{padding:.4em;white-space:pre;cursor:text;} +.CodeMirror-lines *{pointer-events:none;} .CodeMirror pre{-moz-border-radius:0;-webkit-border-radius:0;-o-border-radius:0;border-radius:0;border-width:0;margin:0;padding:0;background:transparent;font-family:inherit;font-size:inherit;padding:0;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;} .CodeMirror-wrap pre{word-wrap:break-word;white-space:pre-wrap;word-break:normal;} .CodeMirror-wrap .CodeMirror-scroll{overflow-x:hidden;} diff --git a/web/js/main.js b/web/js/main.js index d9c6a7d..d625d70 100755 --- a/web/js/main.js +++ b/web/js/main.js @@ -2,18 +2,23 @@ $(function () { $('.dropdown-toggle').dropdown(); if ($('#sourcecode').length) { - var mode = $('#sourcecode').attr('language'); - CodeMirror.fromTextArea(document.getElementById("sourcecode"), { - lineNumbers: true, - matchBrackets: true, - lineWrapping: true, - readOnly: true, - mode: mode - }); - }; + var value = $('#sourcecode').text(); + var mode = $('#sourcecode').attr('language'); + var pre = $('#sourcecode').get(0); + var viewer = CodeMirror(function(elt) { + pre.parentNode.replaceChild(elt, pre); + }, { + value: value, + lineNumbers: true, + matchBrackets: true, + lineWrapping: true, + readOnly: true, + mode: mode + }); + }; - if ($('#readme-content').length) { - var converter = new Showdown.converter(); - $('#readme-content').html(converter.makeHtml($('#readme-content').text())); - } + if ($('#readme-content').length) { + var converter = new Showdown.converter(); + $('#readme-content').html(converter.makeHtml($('#readme-content').text())); + } }); \ No newline at end of file diff --git a/web/less/codemirror.less b/web/less/codemirror.less index bde1093..5d9a5d2 100644 --- a/web/less/codemirror.less +++ b/web/less/codemirror.less @@ -1,10 +1,16 @@ .CodeMirror { line-height: 1em; font-family: Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace; + + /* Necessary so the scrollbar can be absolutely positioned within the wrapper on Lion. */ + position: relative; + /* This prevents unwanted scrollbars from showing up on the body and wrapper in IE. */ + overflow: hidden; } .CodeMirror-scroll { - overflow: auto; + overflow-x: auto; + overflow-y: hidden; height: 500px; /* This is needed to prevent an IE[67] bug where the scrolled content is visible outside of the scrolling box. */ @@ -12,6 +18,37 @@ outline: none; } +/* Vertical scrollbar */ +.CodeMirror-scrollbar { + float: right; + overflow-x: hidden; + overflow-y: scroll; + + /* This corrects for the 1px gap introduced to the left of the scrollbar + by the rule for .CodeMirror-scrollbar-inner. */ + margin-left: -1px; +} +.CodeMirror-scrollbar-inner { + /* This needs to have a nonzero width in order for the scrollbar to appear + in Firefox and IE9. */ + width: 1px; +} +.CodeMirror-scrollbar.cm-sb-overlap { + /* Ensure that the scrollbar appears in Lion, and that it overlaps the content + rather than sitting to the right of it. */ + position: absolute; + z-index: 1; + float: none; + right: 0; + min-width: 12px; +} +.CodeMirror-scrollbar.cm-sb-nonoverlap { + min-width: 12px; +} +.CodeMirror-scrollbar.cm-sb-ie7 { + min-width: 18px; +} + .CodeMirror-gutter { position: absolute; left: 0; top: 0; z-index: 10; @@ -29,6 +66,11 @@ .CodeMirror-lines { padding: .4em; white-space: pre; + cursor: text; +} +.CodeMirror-lines * { + /* Necessary for throw-scrolling to decelerate properly on Safari. */ + pointer-events: none; } .CodeMirror pre { @@ -122,4 +164,4 @@ span.cm-emstrong {font-style: italic; font-weight: bold;} span.cm-link {text-decoration: underline;} div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;} -div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;} \ No newline at end of file +div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}