diff --git a/editable-samples-2/css/editable.css b/editable-samples-2/css/editable.css
index 0e874029..85095d2a 100644
--- a/editable-samples-2/css/editable.css
+++ b/editable-samples-2/css/editable.css
@@ -3,7 +3,7 @@
}
body {
- background-color: #EAEFF2;
+ background-color: #eaeff2;
padding: 0;
margin: 0;
}
@@ -13,7 +13,7 @@ body {
height: 200px;
background-color: white;
padding: 1em 0;
- box-shadow: 0px 2px 5px -2px rgba(0,0,0,0.1);
+ box-shadow: 0px 2px 5px -2px rgba(0, 0, 0, 0.1);
}
#example-element {
@@ -29,12 +29,12 @@ body {
#example-element {
display: block;
- color: #C13832;
+ color: #c13832;
}
.example-choice {
font-size: 14px;
- transition: background-color .2s ease-out;
+ transition: background-color 0.2s ease-out;
cursor: pointer;
padding: 0.25em;
display: inline-block;
@@ -48,12 +48,12 @@ body {
.example-choice.selected {
background-color: white;
- transition: background-color .2s ease-in;
- box-shadow: inset 0px 2px 2px -2px rgba(0,0,0,0.2);
+ transition: background-color 0.2s ease-in;
+ box-shadow: inset 0px 2px 2px -2px rgba(0, 0, 0, 0.2);
cursor: text;
}
-.example-choice>code {
+.example-choice > code {
width: 90%;
display: inline-block;
}
@@ -61,18 +61,18 @@ body {
.reset {
display: none;
position: absolute;
- top: .75em;
+ top: 0.75em;
right: 1em;
}
-.example-choice.selected>.reset {
+.example-choice.selected > .reset {
display: unset;
}
.error {
max-height: 1em;
position: absolute;
- top: .75em;
+ top: 0.75em;
right: 5.5em;
cursor: pointer;
}
diff --git a/editable-samples-2/css/prism.css b/editable-samples-2/css/prism.css
index 0960a0d9..ba6b8c8b 100644
--- a/editable-samples-2/css/prism.css
+++ b/editable-samples-2/css/prism.css
@@ -7,39 +7,39 @@
code[class*="language-"],
pre[class*="language-"] {
- color: black;
- background: none;
- text-shadow: 0 1px white;
- font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
- text-align: left;
- white-space: pre;
- word-spacing: normal;
- word-break: normal;
- word-wrap: normal;
- line-height: 1.5;
-
- -moz-tab-size: 4;
- -o-tab-size: 4;
- tab-size: 4;
-
- -webkit-hyphens: none;
- -moz-hyphens: none;
- -ms-hyphens: none;
- hyphens: none;
+ color: black;
+ background: none;
+ text-shadow: 0 1px white;
+ font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
+ text-align: left;
+ white-space: pre;
+ word-spacing: normal;
+ word-break: normal;
+ word-wrap: normal;
+ line-height: 1.5;
+
+ -moz-tab-size: 4;
+ -o-tab-size: 4;
+ tab-size: 4;
+
+ -webkit-hyphens: none;
+ -moz-hyphens: none;
+ -ms-hyphens: none;
+ hyphens: none;
}
@media print {
- code[class*="language-"],
- pre[class*="language-"] {
- text-shadow: none;
- }
+ code[class*="language-"],
+ pre[class*="language-"] {
+ text-shadow: none;
+ }
}
/* Code blocks */
pre[class*="language-"] {
- padding: 1em;
- margin: .5em 0;
- overflow: auto;
+ padding: 1em;
+ margin: 0.5em 0;
+ overflow: auto;
}
:not(pre) > code[class*="language-"],
@@ -48,24 +48,24 @@ pre[class*="language-"] {
/* Inline code */
:not(pre) > code[class*="language-"] {
- padding: .1em;
- border-radius: .3em;
- white-space: normal;
+ padding: 0.1em;
+ border-radius: 0.3em;
+ white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
- color: slategray;
+ color: slategray;
}
.token.punctuation {
- color: #999;
+ color: #999;
}
.namespace {
- opacity: .7;
+ opacity: 0.7;
}
.token.property,
@@ -75,7 +75,7 @@ pre[class*="language-"] {
.token.constant,
.token.symbol,
.token.deleted {
- color: #905;
+ color: #905;
}
.token.selector,
@@ -84,7 +84,7 @@ pre[class*="language-"] {
.token.char,
.token.builtin,
.token.inserted {
- color: #690;
+ color: #690;
}
.token.operator,
@@ -92,33 +92,33 @@ pre[class*="language-"] {
.token.url,
.language-css .token.string,
.style .token.string {
- color: #a67f59;
+ color: #a67f59;
}
.token.atrule,
.token.attr-value,
.token.keyword {
- color: #07a;
+ color: #07a;
}
.token.function {
- color: #DD4A68;
+ color: #dd4a68;
}
.token.regex,
.token.important,
.token.variable {
- color: #e90;
+ color: #e90;
}
.token.important,
.token.bold {
- font-weight: bold;
+ font-weight: bold;
}
.token.italic {
- font-style: italic;
+ font-style: italic;
}
.token.entity {
- cursor: help;
+ cursor: help;
}
diff --git a/editable-samples-2/js/editable.js b/editable-samples-2/js/editable.js
index 6e2b8ee3..d92e7f1b 100644
--- a/editable-samples-2/js/editable.js
+++ b/editable-samples-2/js/editable.js
@@ -34,8 +34,11 @@ function choose(choice) {
function onChoose(e) {
// highlght the code we are leaving
var selected = document.querySelector(".selected");
- if (selected && (e.currentTarget != selected)) {
- var highlighted = Prism.highlight(selected.firstChild.textContent, Prism.languages.css);
+ if (selected && e.currentTarget != selected) {
+ var highlighted = Prism.highlight(
+ selected.firstChild.textContent,
+ Prism.languages.css,
+ );
selected.firstChild.innerHTML = highlighted;
}
if (selected) {
@@ -51,22 +54,21 @@ function onChoose(e) {
}
function onEdit(e) {
- applyCode(e.currentTarget.textContent, e.currentTarget.parentNode);
+ applyCode(e.currentTarget.textContent, e.currentTarget.parentNode);
}
-
function copyTextOnly(e) {
var selection = window.getSelection();
var range = selection.getRangeAt(0);
- e.clipboardData.setData('text/plain', range.toString());
- e.clipboardData.setData('text/html', range.toString());
+ e.clipboardData.setData("text/plain", range.toString());
+ e.clipboardData.setData("text/html", range.toString());
e.preventDefault();
e.stopPropagation();
}
-document.addEventListener('cut', copyTextOnly);
-document.addEventListener('copy', copyTextOnly);
+document.addEventListener("cut", copyTextOnly);
+document.addEventListener("copy", copyTextOnly);
for (exampleChoice of exampleChoices) {
originalChoices.push(exampleChoice.textContent);
@@ -75,7 +77,7 @@ for (exampleChoice of exampleChoices) {
}
exampleChoice.addEventListener("click", onChoose);
exampleChoice.firstChild.addEventListener("keyup", onEdit);
- exampleChoice.querySelector(".reset").addEventListener("click", function(e) {
+ exampleChoice.querySelector(".reset").addEventListener("click", function (e) {
var choice = e.target.parentNode;
var replacementText = originalChoices[indexOf(exampleChoices, choice)];
var highlighted = Prism.highlight(replacementText, Prism.languages.css);
diff --git a/editable-samples-2/pages/border-top-color/index.html b/editable-samples-2/pages/border-top-color/index.html
index 689ce4ea..72d9a32d 100644
--- a/editable-samples-2/pages/border-top-color/index.html
+++ b/editable-samples-2/pages/border-top-color/index.html
@@ -1,30 +1,29 @@
-
+
-
-
-
+
+
-
-
This is a box with a border around it.
- Note which side of the box is
- red.
+
+ This is a box with a border around it. Note which side of the box is
+ red.
+
-
+
Try editing the selected example, or select a different example:
-
-
border-top-color: red;
border-top-color: rgb(255, 128, 0);
border-top-color: hsla(240, 50%, 25%, 0.75);
border-top-color: #ffbb00;
border-top-color: currentColor;
border-top-color: transparent;
+
+
border-top-color: red;
border-top-color: rgb(255, 128, 0);
border-top-color: hsla(240, 50%, 25%, 0.75);
border-top-color: #ffbb00;
border-top-color: currentColor;
border-top-color: transparent;
-
-
diff --git a/editable-samples-2/pages/filter/index.html b/editable-samples-2/pages/filter/index.html
index 443cf702..21d3a5cf 100644
--- a/editable-samples-2/pages/filter/index.html
+++ b/editable-samples-2/pages/filter/index.html
@@ -1,16 +1,14 @@
-
+
-
-
-
+
+
-
-
+
@@ -24,13 +22,11 @@
-
-

-
+
+

+
-
-
diff --git a/editable-samples-2/pages/font/css/element.css b/editable-samples-2/pages/font/css/element.css
index 4ee7b799..86430e7e 100644
--- a/editable-samples-2/pages/font/css/element.css
+++ b/editable-samples-2/pages/font/css/element.css
@@ -4,5 +4,5 @@
#example-element {
display: block;
- color: #C13832;
+ color: #c13832;
}
diff --git a/editable-samples-2/pages/font/index.html b/editable-samples-2/pages/font/index.html
index 36457bcc..4f9fdfba 100644
--- a/editable-samples-2/pages/font/index.html
+++ b/editable-samples-2/pages/font/index.html
@@ -1,17 +1,15 @@
-
+
-
-
-
-
+
+
+
-
-
+
@@ -19,12 +17,26 @@
- London. Michaelmas term lately over, and the Lord Chancellor sitting in Lincoln's Inn Hall. Implacable November weather. As much mud in the streets as if the waters had but newly retired from the face of the earth, and it would not be wonderful to meet a Megalosaurus, forty feet long or so, waddling like an elephantine lizard up Holborn Hill. Smoke lowering down from chimney-pots, making a soft black drizzle, with flakes of soot in it as big as full-grown snowflakes—gone into mourning, one might imagine, for the death of the sun. Dogs, undistinguishable in mire. Horses, scarcely better; splashed to their very blinkers. Foot passengers, jostling one another's umbrellas in a general infection of ill temper, and losing their foot-hold at street-corners, where tens of thousands of other foot passengers have been slipping and sliding since the day broke (if this day ever broke), adding new deposits to the crust upon crust of mud, sticking at those points tenaciously to the pavement, and accumulating at compound interest.
+ London. Michaelmas term lately over, and the Lord Chancellor sitting in
+ Lincoln's Inn Hall. Implacable November weather. As much mud in the
+ streets as if the waters had but newly retired from the face of the
+ earth, and it would not be wonderful to meet a Megalosaurus, forty feet
+ long or so, waddling like an elephantine lizard up Holborn Hill. Smoke
+ lowering down from chimney-pots, making a soft black drizzle, with
+ flakes of soot in it as big as full-grown snowflakes—gone into mourning,
+ one might imagine, for the death of the sun. Dogs, undistinguishable in
+ mire. Horses, scarcely better; splashed to their very blinkers. Foot
+ passengers, jostling one another's umbrellas in a general infection of
+ ill temper, and losing their foot-hold at street-corners, where tens of
+ thousands of other foot passengers have been slipping and sliding since
+ the day broke (if this day ever broke), adding new deposits to the crust
+ upon crust of mud, sticking at those points tenaciously to the pavement,
+ and accumulating at compound interest.
-
-
diff --git a/editable-samples-2/pages/transform/index.html b/editable-samples-2/pages/transform/index.html
index c66f5486..82df5bc3 100644
--- a/editable-samples-2/pages/transform/index.html
+++ b/editable-samples-2/pages/transform/index.html
@@ -1,17 +1,16 @@
-
+
-
-
-
-
+
+
+
-
-
+
transform: matrix3d(1, 2, 3, 1, 2, 3, 3, 2, 1, 1, 2, 3, 3, 2, 1, 1);

@@ -33,14 +32,11 @@
-
-
-

-
+
+

+
-
-
diff --git a/editable-samples/codemirror/mode/css/gss.html b/editable-samples/codemirror/mode/css/gss.html
index 71e22370..232fe8c1 100644
--- a/editable-samples/codemirror/mode/css/gss.html
+++ b/editable-samples/codemirror/mode/css/gss.html
@@ -1,4 +1,4 @@
-
+
CodeMirror: Closure Stylesheets (GSS) mode
diff --git a/editable-samples/codemirror/mode/css/index.html b/editable-samples/codemirror/mode/css/index.html
index 3886c796..2d2b9b07 100644
--- a/editable-samples/codemirror/mode/css/index.html
+++ b/editable-samples/codemirror/mode/css/index.html
@@ -1,4 +1,4 @@
-
+
CodeMirror: CSS mode
diff --git a/editable-samples/codemirror/mode/css/less.html b/editable-samples/codemirror/mode/css/less.html
index 6fd7d855..46f9585a 100644
--- a/editable-samples/codemirror/mode/css/less.html
+++ b/editable-samples/codemirror/mode/css/less.html
@@ -1,4 +1,4 @@
-
+
CodeMirror: LESS mode
@@ -111,7 +111,7 @@ LESS mode
border-top-width: 0;
background-color: darken(@medium, 10%);
ul {
- padding: 0px;
+ padding: 0px;
}
li {
font-size: 14px;
@@ -121,9 +121,9 @@ LESS mode
border: 0;
a {
display: block;
- padding: 0px 15px;
+ padding: 0px 15px;
text-decoration: none;
- color: white;
+ color: white;
&:hover {
background-color: darken(@medium, 15%);
text-decoration: none;
diff --git a/editable-samples/codemirror/mode/css/scss.html b/editable-samples/codemirror/mode/css/scss.html
index caaf3d1a..f8e4d373 100644
--- a/editable-samples/codemirror/mode/css/scss.html
+++ b/editable-samples/codemirror/mode/css/scss.html
@@ -1,4 +1,4 @@
-
+
CodeMirror: SCSS mode
diff --git a/editable-samples/css/editable-old.css b/editable-samples/css/editable-old.css
index 083d99c8..6ae9e23e 100644
--- a/editable-samples/css/editable-old.css
+++ b/editable-samples/css/editable-old.css
@@ -1,5 +1,5 @@
body {
- background-color: #EAEFF2;
+ background-color: #eaeff2;
padding: 0;
margin: 0;
}
diff --git a/editable-samples/css/editable.css b/editable-samples/css/editable.css
index 6122e6c1..eaeb94da 100644
--- a/editable-samples/css/editable.css
+++ b/editable-samples/css/editable.css
@@ -3,7 +3,7 @@
}
body {
- background-color: #EAEFF2;
+ background-color: #eaeff2;
padding: 0;
margin: 0;
}
@@ -13,10 +13,10 @@ body {
}
.CodeMirror {
- box-shadow: inset 0px 2px 2px -2px rgba(0,0,0,0.2);
- border: 1px solid rgba(0,0,0,0.2);
- border-top: 1px solid rgba(0,0,0,0.3);
- border-bottom: 1px solid rgba(0,0,0,0.1);
+ box-shadow: inset 0px 2px 2px -2px rgba(0, 0, 0, 0.2);
+ border: 1px solid rgba(0, 0, 0, 0.2);
+ border-top: 1px solid rgba(0, 0, 0, 0.3);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#editor {
@@ -24,14 +24,14 @@ body {
margin-bottom: 1em;
}
-#editor>input {
+#editor > input {
position: absolute;
z-index: 10;
top: 10px;
right: 10px;
}
-#editor>input.hidden {
+#editor > input.hidden {
display: none;
}
@@ -41,5 +41,5 @@ body {
background-color: white;
padding: 1em;
box-sizing: border-box;
- box-shadow: 0px 2px 5px -2px rgba(0,0,0,0.1);
+ box-shadow: 0px 2px 5px -2px rgba(0, 0, 0, 0.1);
}
diff --git a/editable-samples/js/editable-old.js b/editable-samples/js/editable-old.js
index f4d23852..911973b6 100644
--- a/editable-samples/js/editable-old.js
+++ b/editable-samples/js/editable-old.js
@@ -5,18 +5,18 @@ var edit = document.getElementById("edit");
var cmOptions = {
mode: "css",
- theme: "mdn-like"
-}
+ theme: "mdn-like",
+};
var cmEditor = CodeMirror(document.body, cmOptions);
cmEditor.setSize("100%", 50);
cmEditor.doc.setValue(cmInitContent);
-CodeMirror.hint.css = function(cm) {
- var inner = {from: cm.getCursor(), to: cm.getCursor(), list: []};
-
+CodeMirror.hint.css = function (cm) {
+ var inner = { from: cm.getCursor(), to: cm.getCursor(), list: [] };
+
var currentPos = cm.getCursor();
- var preceding = cm.getRange({line: currentPos.line, ch: 0}, currentPos);
+ var preceding = cm.getRange({ line: currentPos.line, ch: 0 }, currentPos);
if (preceding == cmMatchToShowCompletions) {
inner.list = cmCompletionChoices;
}
@@ -27,7 +27,7 @@ function applyCode() {
element.style.cssText = cmEditor.doc.getValue();
}
-reset.addEventListener("click", function() {
+reset.addEventListener("click", function () {
cmEditor.doc.setValue(cmInitContent);
applyCode();
});
@@ -35,21 +35,19 @@ reset.addEventListener("click", function() {
function selectValue() {
var value = cmEditor.doc.getValue();
var start = value.indexOf(":") + 1;
- if ((value.length > start) && (value[start] === " ")) {
+ if (value.length > start && value[start] === " ") {
start++;
}
var end = value.length - 1;
- if ((value.length > 0) && (value[end-1] === ";")) {
+ if (value.length > 0 && value[end - 1] === ";") {
end--;
}
- cmEditor.doc.setSelection(
- {line: 0, ch: start},
- {line: 0, ch: end});
+ cmEditor.doc.setSelection({ line: 0, ch: start }, { line: 0, ch: end });
}
-edit.addEventListener("click", function() {
+edit.addEventListener("click", function () {
cmEditor.focus();
selectValue();
});
@@ -59,20 +57,23 @@ window.addEventListener("load", applyCode);
function showCompletions(cm, event) {
var popupKeyCodes = {
- "9": "tab",
- "13": "enter",
- "27": "escape",
- "33": "pageup",
- "34": "pagedown",
- "35": "end",
- "36": "home",
- "38": "up",
- "40": "down"
- }
+ 9: "tab",
+ 13: "enter",
+ 27: "escape",
+ 33: "pageup",
+ 34: "pagedown",
+ 35: "end",
+ 36: "home",
+ 38: "up",
+ 40: "down",
+ };
-if(!popupKeyCodes[(event.keyCode || event.which).toString()]) {
- CodeMirror.showHint(cm, CodeMirror.hint.css, {completeSingle: false, closeOnUnfocus:false});
- }
+ if (!popupKeyCodes[(event.keyCode || event.which).toString()]) {
+ CodeMirror.showHint(cm, CodeMirror.hint.css, {
+ completeSingle: false,
+ closeOnUnfocus: false,
+ });
+ }
}
cmEditor.on("keyup", showCompletions);
diff --git a/editable-samples/js/editable.js b/editable-samples/js/editable.js
index 9417f3cd..1cb355d7 100644
--- a/editable-samples/js/editable.js
+++ b/editable-samples/js/editable.js
@@ -8,29 +8,29 @@ var cmOptions = {
mode: "css",
theme: "eclipse",
lineNumbers: true,
- showCursorWhenSelecting: true
-}
+ showCursorWhenSelecting: true,
+};
var cmEditor = CodeMirror.fromTextArea(editorContent, cmOptions);
cmEditor.setSize("100%", 50);
cmEditor.focus();
-cmEditor.doc.setCursor({line:0, pos: -1});
+cmEditor.doc.setCursor({ line: 0, pos: -1 });
function applyCode() {
element.style.cssText = cmEditor.doc.getValue();
}
-reset.addEventListener("click", function() {
+reset.addEventListener("click", function () {
cmEditor.doc.setValue(cmInitContent);
applyCode();
reset.classList.add("hidden");
});
-cmEditor.on("change", function() {
+cmEditor.on("change", function () {
reset.classList.remove("hidden");
applyCode();
});
-window.addEventListener("load", function() {
+window.addEventListener("load", function () {
applyCode();
});
diff --git a/editable-samples/pages/border-top-color/index-old.html b/editable-samples/pages/border-top-color/index-old.html
index 3d6f8278..16a60f2d 100644
--- a/editable-samples/pages/border-top-color/index-old.html
+++ b/editable-samples/pages/border-top-color/index-old.html
@@ -1,4 +1,4 @@
-
+
@@ -15,9 +15,10 @@
-
This is a box with a border around it.
- Note which side of the box is
- red.
+
+ This is a box with a border around it. Note which side of the box is
+ red.
+
@@ -33,7 +34,5 @@
-
-
-
+
diff --git a/editable-samples/pages/border-top-color/index.html b/editable-samples/pages/border-top-color/index.html
index bc810347..4fdb613f 100644
--- a/editable-samples/pages/border-top-color/index.html
+++ b/editable-samples/pages/border-top-color/index.html
@@ -1,4 +1,4 @@
-
+
@@ -13,16 +13,16 @@
-
-
This is a box with a border around it.
- Note which side of the box is
- red.
+
+ This is a box with a border around it. Note which side of the box is
+ red.
+
@@ -33,7 +33,5 @@
-
-
-
+