pwa
/
Lungo.js
зеркало из https://github.com/tapquo/Lungo.js.git


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
							<!DOCTYPE html>
<style type="text/css">
html, body {
	background: #CCC;
	font-size: 14px;
	margin: 0;
	height: 100%;
}
table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 50%;
	padding: 0;
	vertical-align: top;
}
#output, #style {
	width: 49%;
	min-height: 99%;
	display: inline-block;
	vertical-align: top;
}
#style {
	position: absolute;
	top: 0;
	height: 100%;
	left: 4px;
	width: 49%;
	background: #FFF;
	border: 1px solid #999;
	font: 14px monospace;
	white-space: pre-wrap;
}
#output {
	position: absolute;
	top: 0;
	min-height: 100%;
	right: 0;
	width: 50%;
	margin: 0;
	padding: 4px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	background: #333;
}

.rule {
	color: #8CB7D1;
}
.name {
	color: #D7AA69;
}
.value {
	color: #D7AA69;
}
.brace-open, .brace-close, .colon, .semicolon {
	color: #625035;
}
/*@import url("test/fixtures/dummy.css") screen, handheld;*/
@media screen, all {
	body {
		color: black;
	}
}
</style>

<textarea id="style">.rule {
  display: block;
}
.properties {
  display: block;
}</textarea>
<pre id="output"></pre>


<script type="text/javascript" src="lib/StyleSheet.js"></script>
<script type="text/javascript" src="lib/CSSStyleSheet.js"></script>
<script type="text/javascript" src="lib/MediaList.js"></script>
<script type="text/javascript" src="lib/CSSRule.js"></script>
<script type="text/javascript" src="lib/CSSStyleRule.js"></script>
<script type="text/javascript" src="lib/CSSMediaRule.js"></script>
<script type="text/javascript" src="lib/CSSStyleDeclaration.js"></script>
<script type="text/javascript" src="lib/parse.js"></script>
<script type="text/javascript" src="lib/parse.js"></script>
<script type="text/javascript" src="plugins/toHTML.js"></script>
<script type="text/javascript">
CSSStyleSheet.prototype.toHTML = toHTML;
window.onload = function(){
	var style = document.getElementById("style");
	var output = document.getElementById("output")

	function outputUpdated(){
		output.innerHTML = parse(style.value).toHTML();
	}

	style.onkeyup = outputUpdated;
	outputUpdated();
}
</script>