mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-10-02 17:00:45 +00:00
Code Issues Releases Wiki Activity

Improved styles for JavaScript comments

Browse Source 
Because we all want skeuomorphic post-it note comments on our code
This commit is contained in:
Jeremy Ruston 2012-03-02 15:54:05 +00:00
parent 5f3c89e2bb
commit 5eab89d1f0
2 changed files with 25 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
js/JavaScriptParser.js
View File

@ -48,20 +48,25 @@ JavaScriptParser.prototype.parse = function(type,code) {
renderComment = function(comment) {
var text = comment.value,
element,
classes = [];
classes = ["javascript-comment"],
content = [];
renderWhitespace(comment.range[0]);
if(comment.type === "Block") {
element = "div";
classes.push("javascript-block-comment");
content.push(Renderer.TextNode("/*"));
} else {
element = "span";
classes.push("javascript-line-comment");
content.push(Renderer.TextNode("//"));
}
result.push(Renderer.ElementNode(element,{"class": classes},
self.store.parseText("text/x-tiddlywiki",text).tree));
if(comment.type === "Line") {
result.push(Renderer.TextNode("\n"));
content.push.apply(content,self.store.parseText("text/x-tiddlywiki",text).tree);
if(comment.type === "Block") {
content.push(Renderer.TextNode("*/"));
} else {
content.push(Renderer.TextNode("\n"));
}
result.push(Renderer.ElementNode(element,{"class": classes},content));
currPos = comment.range[1] + 1;
},
renderToken = function(token) {

17
tiddlywiki5/styles.css
View File

@ -301,14 +301,27 @@ a.tw-slider-label::after {
color: #388;
}
.javascript-source .javascript-comment {
padding: 4px 4px 4px 4px;
border: 1px solid #feed77;
background: #feed77;
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#dede80),color-stop(7%,#feed77),color-stop(92%,#feed77),color-stop(100%,#dede80));
background: -webkit-linear-gradient(72deg,rgba(255, 255, 255, 0.5) 8%,rgba(255, 255, 255, 0) 25%),-webkit-linear-gradient(top,#dede80 0,#feed77 7%,#feed77 92%,#dede80 100%);
background: -moz-linear-gradient(72deg,rgba(255, 255, 255, 0.5) 8%,rgba(255, 255, 255, 0) 25%), -moz-linear-gradient(top,#dede80 0,#feed77 7%,#feed77 92%,#dede80 100%);
background: -o-linear-gradient(72deg,rgba(255, 255, 255, 0.5) 8%,rgba(255, 255, 255, 0) 25%), -o-linear-gradient(top,#dede80 0,#feed77 7%,#feed77 92%,#dede80 100%);
background: -ms-linear-gradient(72deg,rgba(255, 255, 255, 0.5) 8%,rgba(255, 255, 255, 0) 25%), -ms-linear-gradient(top,#dede80 0,#feed77 7%,#feed77 92%,#dede80 100%);
background: linear-gradient(72deg,rgba(255, 255, 255, 0.5) 8%,rgba(255, 255, 255, 0) 25%), linear-gradient(top,#dede80 0,#feed77 7%,#feed77 92%,#dede80 100%);
-webkit-box-shadow: 1px 1px 6px rgba(0,0,0,0.4);
-moz-box-shadow: 1px 1px 6px rgba(0,0,0,0.4);
box-shadow: 1px 1px 6px rgba(0,0,0,0.4);
}
.javascript-source .javascript-block-comment {
font-family: Helvetica, Arial, sans-serif;
background: #fff;
}
.javascript-source .javascript-line-comment {
font-family: Helvetica, Arial, sans-serif;
background: #ff0;
}