diff options
Diffstat (limited to 'data')
| -rw-r--r-- | data/css/style.css | 82 | ||||
| -rw-r--r-- | data/js/script.js | 17 |
2 files changed, 61 insertions, 38 deletions
diff --git a/data/css/style.css b/data/css/style.css index ce8052142..454d7f9ea 100644 --- a/data/css/style.css +++ b/data/css/style.css @@ -54,7 +54,53 @@ code, pre, textarea { margin-right: 20px; } -.content .numbers > pre, .content .highlight > pre { +.code pre { + counter-reset: line-numbering; +} + +.code {display: table; margin: 0;} +.code .table-row {display: table-row;} +.code .table-cell {display: table-cell;} + +.code pre a.linenumber { + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.code pre a.linenumber::before { + content: counter(line-numbering); + counter-increment: line-numbering; +} + +.code pre a.linenumber { + padding: 0 6px; /* space after numbers */ + text-align: right; + + background: #ececec; + border-right: 1px solid #ddd; + text-align: right; + margin-left: -2px; + color: #aaa; + word-break: normal; +} + +.code pre :last-child a { + padding-bottom: 10px; +} + +.code pre :first-child a { + padding-top: 10px; +} + +.code pre .table-row .line { + padding-left: 10px; +} + +.content .highlight > pre { background-color: transparent; border: 0; border-radius: 0; @@ -62,41 +108,23 @@ code, pre, textarea { padding: 0; font-size: 12px; line-height: 1.4; - white-space: pre; - word-break: normal; + white-space: pre-wrap; + word-break: break-all; word-wrap: normal; } -.content .numbers { - background: #ececec; - border-right: 1px solid #ddd; - text-align: right; - padding: 10px 6px; - vertical-align: top; -} -.content .numbers a { - color: #aaa; -} -.content .code { +.code { width: 100%; - vertical-align: top; - padding-top: 10px; + padding-top: 0; } -.content .code > .highlight { +.code .highlight { position: relative; - padding-left: 10px; + padding-left: 0; } -.content .code > .highlight > pre { +.code .highlight pre { position: relative; - z-index: 2; } -#highlight_line { +.highlight_line { background: #ffffcc; - position: absolute; - left: 0; - right: 0; - width: 100%; - height: 16px; - z-index: 1; } #file-info { display: none; diff --git a/data/js/script.js b/data/js/script.js index ffa036280..7d84eb9a1 100644 --- a/data/js/script.js +++ b/data/js/script.js @@ -9,17 +9,14 @@ function fixedEncodeURIComponent (str) { $(window).bind('hashchange', function(e) { var hash = window.location.hash; - $('#highlight_line').remove(); + $('.highlight_line').removeClass("highlight_line"); if (hash.match(/^#n\d+$/) === null) { return; } - var link = $(hash); - - $('<div id="highlight_line" />').prependTo('.highlight').css({ - top: link.get(0).offsetTop - 10 + parseInt(link.css("padding-top")) + 'px' - }); + var line = $(hash).parent().parent(); + line.addClass("highlight_line"); }); $(window).trigger('hashchange'); @@ -59,14 +56,12 @@ function fixedEncodeURIComponent (str) { return this; }); - window.lines_wrapped = false; + window.lines_wrapped = true; $('#linewrap').click(function() { if (window.lines_wrapped == true) { - $(".content .numbers").show(); - $(".content .code > .highlight > pre").css("white-space", "pre"); + $(".highlight > pre").css("white-space", "pre"); } else { - $(".content .numbers").hide(); - $(".content .code > .highlight > pre").css("white-space", "pre-wrap"); + $(".highlight > pre").css("white-space", "pre-wrap"); } window.lines_wrapped = !window.lines_wrapped; }); |