From: Jouni Koivuviita Date: Thu, 3 Jul 2008 09:05:47 +0000 (+0000) Subject: Shadow styles for default theme. X-Git-Tag: 6.7.0.beta1~4506 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=e88d4dface1faeee38f2ba9b65ee8d8052e71905;p=vaadin-framework.git Shadow styles for default theme. svn changeset:5017/svn branch:trunk --- diff --git a/WebContent/ITMILL/themes/default/common/common.css b/WebContent/ITMILL/themes/default/common/common.css index 443356fd27..dad8550ea8 100644 --- a/WebContent/ITMILL/themes/default/common/common.css +++ b/WebContent/ITMILL/themes/default/common/common.css @@ -108,8 +108,8 @@ input.i-modified, } .i-contextmenu .gwt-MenuBar { - border-right: 2px solid #c6cbcc; - border-bottom: 2px solid #c6cbcc; + border-right: 1px solid #c6cbcc; + border-bottom: 1px solid #c6cbcc; border-top: 1px solid #d0d4d5; border-left: 1px solid #d0d4d5; } diff --git a/WebContent/ITMILL/themes/default/formlayout/formlayout.css b/WebContent/ITMILL/themes/default/formlayout/formlayout.css index e5a27ade38..1a9040032b 100644 --- a/WebContent/ITMILL/themes/default/formlayout/formlayout.css +++ b/WebContent/ITMILL/themes/default/formlayout/formlayout.css @@ -49,4 +49,10 @@ * html .i-form-errormessage { height: 20px +} + +.i-form { + border: none; + margin: 0; + padding: 0; } \ No newline at end of file diff --git a/WebContent/ITMILL/themes/default/icons/32/document-edit.png b/WebContent/ITMILL/themes/default/icons/32/document-edit.png new file mode 100644 index 0000000000..1d17383ca7 Binary files /dev/null and b/WebContent/ITMILL/themes/default/icons/32/document-edit.png differ diff --git a/WebContent/ITMILL/themes/default/icons/64/document-edit.png b/WebContent/ITMILL/themes/default/icons/64/document-edit.png new file mode 100644 index 0000000000..6af96c9b77 Binary files /dev/null and b/WebContent/ITMILL/themes/default/icons/64/document-edit.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/bottom-left.png b/WebContent/ITMILL/themes/default/shadow/img/bottom-left.png new file mode 100644 index 0000000000..b119a13119 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/bottom-left.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/bottom-right.png b/WebContent/ITMILL/themes/default/shadow/img/bottom-right.png new file mode 100644 index 0000000000..50aaa3bedc Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/bottom-right.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/bottom.png b/WebContent/ITMILL/themes/default/shadow/img/bottom.png new file mode 100644 index 0000000000..96af859986 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/bottom.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/center.png b/WebContent/ITMILL/themes/default/shadow/img/center.png new file mode 100644 index 0000000000..d6fb99a889 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/center.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/left.png b/WebContent/ITMILL/themes/default/shadow/img/left.png new file mode 100644 index 0000000000..4c3611c842 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/left.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/right.png b/WebContent/ITMILL/themes/default/shadow/img/right.png new file mode 100644 index 0000000000..34a46e7b13 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/right.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/top-left.png b/WebContent/ITMILL/themes/default/shadow/img/top-left.png new file mode 100644 index 0000000000..27cf4d3f61 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/top-left.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/top-right.png b/WebContent/ITMILL/themes/default/shadow/img/top-right.png new file mode 100644 index 0000000000..7f187ca556 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/top-right.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/img/top.png b/WebContent/ITMILL/themes/default/shadow/img/top.png new file mode 100644 index 0000000000..b654d78da9 Binary files /dev/null and b/WebContent/ITMILL/themes/default/shadow/img/top.png differ diff --git a/WebContent/ITMILL/themes/default/shadow/shadow.css b/WebContent/ITMILL/themes/default/shadow/shadow.css new file mode 100644 index 0000000000..fb7395d4d9 --- /dev/null +++ b/WebContent/ITMILL/themes/default/shadow/shadow.css @@ -0,0 +1,145 @@ +.i-shadow { + position: absolute; + overflow: auto; +} + +.i-shadow .top-left { + position: absolute; overflow: hidden; + top: 0; left: 0; + width: 8px; height: 8px; + background: transparent url(img/top-left.png); +} + +.i-shadow .top { + position: absolute; overflow: hidden; + top: 0; left: 8px; + height: 8px; + right: 8px; + background: transparent url(img/top.png); +} + +.i-shadow .top-right { + position: absolute; overflow: hidden; + top: 0; right: 0; + width: 8px; height: 8px; + background: transparent url(img/top-right.png); +} + +.i-shadow .left { + position: absolute; overflow: hidden; + top: 8px; left: 0; + width: 8px; + bottom: 8px; + background: transparent url(img/left.png); +} + +.i-shadow .center { + position: absolute; overflow: hidden; + top: 8px; left: 8px; + bottom: 8px; right: 8px; + background: transparent url(img/center.png); +} + +.i-shadow .right { + position: absolute; overflow: hidden; + top: 8px; right: 0; + width: 8px; + bottom: 8px; + background: transparent url(img/right.png); +} + +.i-shadow .bottom-left { + position: absolute; overflow: hidden; + bottom: 0; left: 0; + width: 8px; height: 8px; + background: transparent url(img/bottom-left.png); +} + +.i-shadow .bottom { + position: absolute; overflow: hidden; + bottom: 0; left: 8px; + right: 8px; height: 8px; + background: transparent url(img/bottom.png); +} + +.i-shadow .bottom-right { + position: absolute; overflow: hidden; + bottom: 0; right: 0; + width: 8px; height: 8px; + background: transparent url(img/bottom-right.png); +} + + + + + +/* And all the same for IE6 (transparent png's) */ + +* html .i-shadow .top-left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); +} + +* html .i-shadow .top { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .top-right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); +} + +* html .i-shadow .left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); +} + +* html .i-shadow .center { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); +} + +* html .i-shadow .bottom-left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); +} + +* html .i-shadow .bottom { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .bottom-right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); +} \ No newline at end of file diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css index eacde80159..6067792ab4 100644 --- a/WebContent/ITMILL/themes/default/styles.css +++ b/WebContent/ITMILL/themes/default/styles.css @@ -51,6 +51,7 @@ /* fixes streched buttons in IE6 */ * html .i-button { + width: 1px; overflow: visible; padding-left: 10px; padding-right: 10px; @@ -62,6 +63,7 @@ padding-right: 10px; } + /* Disabled by default .i-checkbox-error { background:transparent; @@ -225,8 +227,8 @@ input.i-modified, } .i-contextmenu .gwt-MenuBar { - border-right: 2px solid #c6cbcc; - border-bottom: 2px solid #c6cbcc; + border-right: 1px solid #c6cbcc; + border-bottom: 1px solid #c6cbcc; border-top: 1px solid #d0d4d5; border-left: 1px solid #d0d4d5; } @@ -583,6 +585,12 @@ input.i-modified, * html .i-form-errormessage { height: 20px } + +.i-form { + border: none; + margin: 0; + padding: 0; +} .i-gridlayout-margin-top { padding-top: 15px; } @@ -1209,6 +1217,151 @@ input.i-modified, } +.i-shadow { + position: absolute; + overflow: auto; +} + +.i-shadow .top-left { + position: absolute; overflow: hidden; + top: 0; left: 0; + width: 8px; height: 8px; + background: transparent url(shadow/img/top-left.png); +} + +.i-shadow .top { + position: absolute; overflow: hidden; + top: 0; left: 8px; + height: 8px; + right: 8px; + background: transparent url(shadow/img/top.png); +} + +.i-shadow .top-right { + position: absolute; overflow: hidden; + top: 0; right: 0; + width: 8px; height: 8px; + background: transparent url(shadow/img/top-right.png); +} + +.i-shadow .left { + position: absolute; overflow: hidden; + top: 8px; left: 0; + width: 8px; + bottom: 8px; + background: transparent url(shadow/img/left.png); +} + +.i-shadow .center { + position: absolute; overflow: hidden; + top: 8px; left: 8px; + bottom: 8px; right: 8px; + background: transparent url(shadow/img/center.png); +} + +.i-shadow .right { + position: absolute; overflow: hidden; + top: 8px; right: 0; + width: 8px; + bottom: 8px; + background: transparent url(shadow/img/right.png); +} + +.i-shadow .bottom-left { + position: absolute; overflow: hidden; + bottom: 0; left: 0; + width: 8px; height: 8px; + background: transparent url(shadow/img/bottom-left.png); +} + +.i-shadow .bottom { + position: absolute; overflow: hidden; + bottom: 0; left: 8px; + right: 8px; height: 8px; + background: transparent url(shadow/img/bottom.png); +} + +.i-shadow .bottom-right { + position: absolute; overflow: hidden; + bottom: 0; right: 0; + width: 8px; height: 8px; + background: transparent url(shadow/img/bottom-right.png); +} + + + + + +/* And all the same for IE6 (transparent png's) */ + +* html .i-shadow .top-left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); +} + +* html .i-shadow .top { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .top-right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); +} + +* html .i-shadow .left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); +} + +* html .i-shadow .center { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); + height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); +} + +* html .i-shadow .bottom-left { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); +} + +* html .i-shadow .bottom { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); + width: expression(this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth); +} + +* html .i-shadow .bottom-right { + background: transparent; + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); +} /*-------------------------- Default (horizontal) styles --------------------------*/