ダミーのタブに背景画像を付けるように

git-svn-id: http://www.cozmixng.org/repos/piro/treestyletab/trunk@4681 599a83e7-65a4-db11-8015-0010dcdd6dc2

content/treestyletab/group.xul

@@ -3,7 +3,12 @@
 <page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
 	onclick="onClick(event)"
 	ondblclick="onDblClick(event)">
-<hbox>
+<stack flex="1">
+	<box class="background-image-container">
+		<image class="icon background-image"/>
+	</box>
+	<vbox class="content" flex="1">
+		<hbox>
 			<deck id="deck" flex="1">
 				<hbox align="center">
 					<image class="icon"/>
@@ -18,7 +23,9 @@
 						onkeypress="onKeyPress(event)"/>
 				</hbox>
 			</deck>
-</hbox>
+		</hbox>
+	</vbox>
+</stack>
 <link xmlns="http://www.w3.org/1999/xhtml" rel="icon"
 	href="chrome://treestyletab/skin/group-icon"/>
 <script type="application/x-javascript"><![CDATA[

skin/classic/treestyletab/group.css

@@ -1,7 +1,12 @@
-page {
+:root {
 	background: -moz-dialog;
-	margin: 1em;
 	-moz-appearance: window;
+	margin: 0;
+	padding: 0;
+}
+
+.content {
+	padding: 1em;
 }
 
 #label {
@@ -18,3 +23,28 @@ page {
 	-moz-image-region: rect(0, 32px, 16px, 16px);
 */
 }
+
+.background-image {
+	width: 320px;
+	max-width: 320px;
+	height: 320px;
+	max-height: 320px;
+	position: fixed;
+	top: auto;
+	right: 0;
+	bottom: 0;
+	left: auto;
+	opacity: 0.3;
+	image-rendering: -moz-crisp-edges;
+	margin: 0 -0.3em -0.3em 0;
+	transform: rotate(8deg);
+	-moz-transform: rotate(8deg);
+}
+
+.background-image-container {
+	position: fixed;
+	top: auto;
+	right: 0;
+	bottom: 0;
+	left: auto;
+}