1 files changed, 110 insertions, 0 deletions
diff --git a/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/test/CSS_1.html b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/test/CSS_1.html
new file mode 100644
index 0000000000..c49016803d
--- /dev/null
+++ b/webapps/qooxdoo-0.6.3-sdk/frontend/demo/source/html/test/CSS_1.html
@@ -0,0 +1,110 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>qooxdoo &raquo; Demo</title>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
+  <!--[if IE]>
+  <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
+  <![endif]-->
+  <script type="text/javascript" src="../../script/qx.js"></script>
+	
+	<style type="text/css">
+	
+	.box {
+		position: absolute;
+		width: 100px;
+		height: 100px;
+		left: 30px;
+		top: 40px;
+		color: white;
+		padding: 5px;
+	}
+	
+	#box1 {
+		background-color: red;
+	}
+	
+	#box2 {
+		background-color: blue;
+		top: 200px;
+		left: 100px;
+	}
+	
+	</style>
+	
+</head>
+<body>
+  <script type="text/javascript" src="../../script/layout.js"></script>
+
+  <div id="demoDescription">
+    <p>Some tests of qx.dom.StyleSheet</p>
+  </div>
+
+
+	<div id="box1" class="box">
+		Box 1	
+	</div>
+	
+	<div id="box2" class="box">
+		Box 2
+	</div>
+	
+  <div style="display:none" id="control">
+    <p>
+			<h3>Box 1</h3>
+      <a href="javascript://" onclick="qx.dom.StyleSheet.addRule(sheet, '#box1', 'background-color:green !important');">qx.dom.StyleSheet.addRule(style, '#box1', 'background-color:green !important')</a> <br>
+      <a href="javascript://" onclick="qx.dom.StyleSheet.removeRule(sheet, '#box1');">qx.dom.StyleSheet.removeRule(sheet, '#box1')</a> <br>
+    </p>
+			<h3>Box 1</h3>
+      <a href="javascript://" onclick="qx.dom.StyleSheet.addRule(sheet, '#box2', 'background-color:yellow !important');">qx.dom.StyleSheet.addRule(style, '#box2', 'background-color:yellow !important')</a> <br>
+      <a href="javascript://" onclick="qx.dom.StyleSheet.removeRule(sheet, '#box2');">qx.dom.StyleSheet.removeRule(sheet, '#box2')</a> <br>
+		<p>  
+			<h3>All</h3>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.removeAllRules(sheet)">qx.dom.StyleSheet.removeAllRules(sheet)</a> <br>
+    </p>
+		<p>  
+			<h3>Import</h3>
+			add Import <br>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.addImport(sheet, 'bigFont.css')">qx.dom.StyleSheet.addImport(sheet, 'bigFont.css')</a> <br>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.addImport(sheet, 'boldFont.css')">qx.dom.StyleSheet.addImport(sheet, 'boldFont.css')</a> <br>
+			remove Import<br>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.removeImport(sheet, 'bigFont.css')">qx.dom.StyleSheet.removeImport(sheet, 'bigFont.css')</a> <br>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.removeImport(sheet, 'boldFont.css')">qx.dom.StyleSheet.removeImport(sheet, 'boldFont.css')</a> <br>		
+    	remove all Imports<br>
+			<a href="javascript://" onclick="qx.dom.StyleSheet.removeAllImports(sheet)">qx.dom.StyleSheet.removeAllImports(sheet)</a> <br>			
+		</p>
+		
+  </div>
+
+  <script type="text/javascript">
+
+	var sheet = qx.dom.StyleSheet.createElement();
+
+  qx.core.Init.getInstance().defineMain(function()
+  {
+    var d = qx.ui.core.ClientDocument.getInstance();
+
+		var ct1 = new qx.ui.basic.Label(document.getElementById("control").innerHTML);
+
+    with(ct1)
+    {
+      setWidth(450);
+      setRight(335);
+
+      setHeight(null);
+      setTop(48);
+      setBottom(48);
+
+      setOverflow("auto");
+
+      setBackgroundColor(new qx.renderer.color.Color("white"));
+      setBorder(qx.renderer.border.BorderPresets.getInstance().groove);
+      setPadding(10);
+    };
+
+    d.add(ct1);
+  });
+	
+  </script>
+</body>
+</html>