From: Jouni Koivuviita Date: Thu, 21 May 2009 12:42:15 +0000 (+0000) Subject: reindeer theme update: black style for layout, textfield and buttons. X-Git-Tag: 6.7.0.beta1~2811 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=48a1592cbb865222e482f4ec8aa773f68f6274db;p=vaadin-framework.git reindeer theme update: black style for layout, textfield and buttons. svn changeset:7935/svn branch:6.0 --- diff --git a/WebContent/VAADIN/themes/base/formlayout/formlayout.css b/WebContent/VAADIN/themes/base/formlayout/formlayout.css index dd5e8d6662..47ae45df52 100644 --- a/WebContent/VAADIN/themes/base/formlayout/formlayout.css +++ b/WebContent/VAADIN/themes/base/formlayout/formlayout.css @@ -1,6 +1,10 @@ .v-formlayout-cell .v-errorindicator { display: block; } +.v-formlayout-error-indicator { + /* fix width so layout is not jumpy when error disappears */ + width: 12px; +} .v-formlayout-captioncell { text-align:right; white-space: nowrap; diff --git a/WebContent/VAADIN/themes/base/styles.css b/WebContent/VAADIN/themes/base/styles.css index 6f8c895eb0..28e9f5a996 100644 --- a/WebContent/VAADIN/themes/base/styles.css +++ b/WebContent/VAADIN/themes/base/styles.css @@ -438,6 +438,10 @@ .v-formlayout-cell .v-errorindicator { display: block; } +.v-formlayout-error-indicator { + /* fix width so layout is not jumpy when error disappears */ + width: 12px; +} .v-formlayout-captioncell { text-align:right; white-space: nowrap; diff --git a/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css b/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css index fe459e92d7..2b3eeb2a7a 100644 --- a/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css +++ b/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css @@ -4,8 +4,11 @@ /** sprite: verticals; sprite-image: url(../common/img/vertical-sprites.png); sprite-layout: vertical */ /** sprite: horizontals; sprite-image: url(../common/img/horizontal-sprites.png); sprite-layout: horizontal */ +/** sprite: black-verticals; sprite-image: url(../common/img/black-vertical-sprites.png); sprite-layout: vertical */ +/** sprite: black-horizontals; sprite-image: url(../common/img/black-horizontal-sprites.png); sprite-layout: horizontal */ + /*------------ * Buttons * -----------*/ /** sprite: buttons; sprite-image: url(../button/img/button-sprites.png); sprite-layout: vertical */ -/** sprite: buttons-black; sprite-image: url(../button/img/button-black-sprites.png); sprite-layout: vertical */ \ No newline at end of file +/** sprite: black-buttons; sprite-image: url(../button/img/black-button-sprites.png); sprite-layout: vertical */ \ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/button/button.css b/WebContent/VAADIN/themes/reindeer/button/button.css index 3917dad575..16cb529904 100644 --- a/WebContent/VAADIN/themes/reindeer/button/button.css +++ b/WebContent/VAADIN/themes/reindeer/button/button.css @@ -234,6 +234,93 @@ div > .v-button-small .v-button-caption, background-image: url(img/small-right-pressed.png); /** sprite-ref: buttons; sprite-alignment: right */ } +/*------------ +* Black buttons +*------------*/ +.black div > .v-button, +.black .v-ie7 .v-button { + background-image: url(img/black/left.png); /** sprite-ref: black-buttons */ +} +.black div > .v-button .v-button-caption, +.black .v-ie7 .v-button .v-button-caption { + background-image: url(img/black/right.png); /** sprite-ref: black-buttons; sprite-alignment: right */ + color: #c9ccce; + text-shadow: #000 0 1px 0; + font-weight: normal; +} +.black .v-button:focus { + background-image: url(img/black/left-focus.png); /** sprite-ref: black-buttons */ +} +.black .v-button:focus .v-button-caption { + background-image: url(img/black/right-focus.png); /** sprite-ref: black-buttons; sprite-alignment: right */ +} +.black .v-button:active, +.black .v-ie7 .v-button.v-pressed { + background-image: url(img/black/left-pressed.png); /** sprite-ref: black-buttons */ +} +.black .v-button:active .v-button-caption, +.black .v-ie7 .v-button.v-pressed .v-button-caption { + background-image: url(img/black/right-pressed.png); /** sprite-ref: black-buttons; sprite-alignment: right */ +} + +/* + * Primary-style ---------------------------- + */ +.black div > .v-button-primary, +.black .v-ie7 .v-button-primary { + background-image: url(img/black/primary-left.png); /** sprite-ref: black-buttons */ +} +.black div > .v-button-primary .v-button-caption, +.black .v-ie7 .v-button-primary .v-button-caption { + background-image: url(img/black/primary-right.png); /** sprite-ref: black-buttons; sprite-alignment: right */ + text-shadow: #26282a 0 1px 0; +} +.black .v-button-primary:focus { + background-image: url(img/black/primary-left-focus.png); /** sprite-ref: black-buttons */ +} +.black .v-button-primary:focus .v-button-caption { + background-image: url(img/black/primary-right-focus.png); /** sprite-ref: black-buttons; sprite-alignment: right */ + color: #eaf4fb; +} +.black .v-button-primary:active, +.black .v-ie7 .v-button-primary.v-pressed { + background-image: url(img/black/primary-left-pressed.png); /** sprite-ref: black-buttons */ +} +.black .v-button-primary:active .v-button-caption, +.black .v-ie7 .v-button-primary.v-pressed .v-button-caption { + background-image: url(img/black/primary-right-pressed.png); /** sprite-ref: black-buttons; sprite-alignment: right */ +} + +/* + * Small-style -------------------------- + */ +.black div > .v-button-small, +.black .v-ie7 .v-button-small { + background-image: url(img/black/small-left.png); /** sprite-ref: black-buttons */ +} +.black div > .v-button-small .v-button-caption, +.black .v-ie7 .v-button-small .v-button-caption { + background-image: url(img/black/small-right.png); /** sprite-ref: black-buttons; sprite-alignment: right */ + text-shadow: #000 0 -1px 0; +} +.black .v-button-small:focus { + background-image: url(img/black/small-left-focus.png); /** sprite-ref: black-buttons */ +} +.black .v-button-small:focus .v-button-caption { + background-image: url(img/black/small-right-focus.png); /** sprite-ref: black-buttons; sprite-alignment: right */ +} +.black .v-button-small:active, +.black .v-ie7 .v-button-small.v-pressed { + background-image: url(img/black/small-left-pressed.png); /** sprite-ref: black-buttons */ +} +.black .v-button-small:active .v-button-caption, +.black .v-ie7 .v-button-small.v-pressed .v-button-caption { + background-image: url(img/black/small-right-pressed.png); /** sprite-ref: black-buttons; sprite-alignment: right */ +} + + + + /** * IE6 buttons -------------------------- */ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites-ie6.png new file mode 100644 index 0000000000..295237a5fd Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites-ie6.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites.png b/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites.png new file mode 100644 index 0000000000..197b9b5d21 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black-button-sprites.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/left-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/left-focus.png new file mode 100644 index 0000000000..4361800079 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/left-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/left-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/left-pressed.png new file mode 100644 index 0000000000..ab0d245b15 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/left-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/left.png b/WebContent/VAADIN/themes/reindeer/button/img/black/left.png new file mode 100644 index 0000000000..e77900abc5 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/left.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-focus.png new file mode 100644 index 0000000000..47bfc36a5b Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-pressed.png new file mode 100644 index 0000000000..d20fa467f8 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left.png new file mode 100644 index 0000000000..e05e8cf8ae Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-left.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-focus.png new file mode 100644 index 0000000000..ecc06c52ab Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-pressed.png new file mode 100644 index 0000000000..b71eecc3d8 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right.png b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right.png new file mode 100644 index 0000000000..94d5e93f85 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/primary-right.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/right-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/right-focus.png new file mode 100644 index 0000000000..43e6edb2b9 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/right-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/right-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/right-pressed.png new file mode 100644 index 0000000000..2612f6869d Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/right-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/right.png b/WebContent/VAADIN/themes/reindeer/button/img/black/right.png new file mode 100644 index 0000000000..bfeafb779e Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/right.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-focus.png new file mode 100644 index 0000000000..55e76701b8 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-pressed.png new file mode 100644 index 0000000000..01eea1ea58 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-left.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left.png new file mode 100644 index 0000000000..28aca63243 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-left.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-focus.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-focus.png new file mode 100644 index 0000000000..4415262cb6 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-pressed.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-pressed.png new file mode 100644 index 0000000000..7095241499 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/button/img/black/small-right.png b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right.png new file mode 100644 index 0000000000..1be4b2c327 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/button/img/black/small-right.png differ diff --git a/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites.png b/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites.png new file mode 100644 index 0000000000..887eca49ac Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites.png differ diff --git a/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css b/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css new file mode 100644 index 0000000000..4bc4098fe8 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css @@ -0,0 +1,53 @@ +.v-formlayout-cell .v-errorindicator { + width: 13px; + height: 16px; + background: transparent url(../common/icons/error.png) no-repeat 50%; +} +.v-ie6 .v-formlayout-cell .v-errorindicator { + background-image: url(../common/icons/error-ie6.png); +} +.v-formlayout-captioncell { + text-align: right; + white-space: nowrap; +} +.v-formlayout-spacing .v-formlayout-row .v-formlayout-captioncell, +.v-formlayout-spacing .v-formlayout-row .v-formlayout-contentcell, +.v-formlayout-spacing .v-formlayout-row .v-formlayout-errorcell { + padding-top: 8px; +} +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-captioncell, +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-contentcell, +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-errorcell { + padding-top: 15px; +} +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-captioncell, +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-contentcell, +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-errorcell { + padding-bottom: 15px; +} +.v-formlayout-margin-left .v-formlayout-captioncell { + padding-left: 18px; +} +.v-formlayout-margin-right .v-formlayout-contentcell { + padding-right: 18px; +} +/* form */ +.v-form-errormessage { + background: transparent url(../icons/16/error.png) no-repeat top left; + padding-left: 20px; + margin-bottom: 5px; + margin-top: 5px; + min-height: 20px; +} +.v-ie6 .v-form-errormessage { + height: 20px +} +.v-form fieldset { + border: none; + border-top: 1px solid #babfc0; +} +.v-form legend { + margin: 0; + padding: 0 4px 0.3em 4px; + font-weight: bold; +} \ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/layouts/img/black-bg.png b/WebContent/VAADIN/themes/reindeer/layouts/img/black-bg.png new file mode 100644 index 0000000000..124b13f7c3 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/layouts/img/black-bg.png differ diff --git a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css b/WebContent/VAADIN/themes/reindeer/layouts/layouts.css index a668e76433..1d2c485580 100644 --- a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css +++ b/WebContent/VAADIN/themes/reindeer/layouts/layouts.css @@ -29,4 +29,12 @@ .v-horizontallayout-blue, .v-orderedlayout-blue { background-color: #bcd3de; +} +/* Black background */ +.v-verticallayout-black, +.v-horizontallayout-black, +.v-orderedlayout-black { + background: #16181a url(img/black-bg.png) repeat-x; + color: #c9ccce; + text-shadow: #000 0 0 1px; } \ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css index 19d60487de..5980634744 100644 --- a/WebContent/VAADIN/themes/reindeer/styles.css +++ b/WebContent/VAADIN/themes/reindeer/styles.css @@ -438,6 +438,10 @@ .v-formlayout-cell .v-errorindicator { display: block; } +.v-formlayout-error-indicator { + /* fix width so layout is not jumpy when error disappears */ + width: 12px; +} .v-formlayout-captioncell { text-align:right; white-space: nowrap; @@ -1562,6 +1566,7 @@ div.v-window-header { * General vertical and horizontal sprites * -----------*/ + /*------------ * Buttons * -----------*/ @@ -1890,6 +1895,129 @@ div > .v-button-small .v-button-caption, background-position: right -412px; } +/*------------ +* Black buttons +*------------*/ +.black div > .v-button, +.black .v-ie7 .v-button { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -0px; +} +.black div > .v-button .v-button-caption, +.black .v-ie7 .v-button .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -26px; + color: #c9ccce; + text-shadow: #000 0 1px 0; + font-weight: normal; +} +.black .v-button:focus { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -52px; +} +.black .v-button:focus .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -78px; +} +.black .v-button:active, +.black .v-ie7 .v-button.v-pressed { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -104px; +} +.black .v-button:active .v-button-caption, +.black .v-ie7 .v-button.v-pressed .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -130px; +} + +/* + * Primary-style ---------------------------- + */ +.black div > .v-button-primary, +.black .v-ie7 .v-button-primary { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -156px; +} +.black div > .v-button-primary .v-button-caption, +.black .v-ie7 .v-button-primary .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -182px; + text-shadow: #26282a 0 1px 0; +} +.black .v-button-primary:focus { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -208px; +} +.black .v-button-primary:focus .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -234px; + color: #eaf4fb; +} +.black .v-button-primary:active, +.black .v-ie7 .v-button-primary.v-pressed { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -260px; +} +.black .v-button-primary:active .v-button-caption, +.black .v-ie7 .v-button-primary.v-pressed .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -286px; +} + +/* + * Small-style -------------------------- + */ +.black div > .v-button-small, +.black .v-ie7 .v-button-small { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -312px; +} +.black div > .v-button-small .v-button-caption, +.black .v-ie7 .v-button-small .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -332px; + text-shadow: #000 0 -1px 0; +} +.black .v-button-small:focus { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -352px; +} +.black .v-button-small:focus .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -372px; +} +.black .v-button-small:active, +.black .v-ie7 .v-button-small.v-pressed { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: left -392px; +} +.black .v-button-small:active .v-button-caption, +.black .v-ie7 .v-button-small.v-pressed .v-button-caption { + background-image: url(button/img/black-button-sprites.png); + -background-image: url(button/img/black-button-sprites-ie6.png); + background-position: right -412px; +} + + + + /** * IE6 buttons -------------------------- */ @@ -2338,6 +2466,61 @@ td.v-datefield-calendarpanel-nextyear { background-position: left -357px; } +/* ./WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css */ +.v-formlayout-cell .v-errorindicator { + width: 13px; + height: 16px; + background: transparent url(common/icons/error.png) no-repeat 50%; +} +.v-ie6 .v-formlayout-cell .v-errorindicator { + background-image: url(common/icons/error-ie6.png); +} +.v-formlayout-captioncell { + text-align: right; + white-space: nowrap; +} +.v-formlayout-spacing .v-formlayout-row .v-formlayout-captioncell, +.v-formlayout-spacing .v-formlayout-row .v-formlayout-contentcell, +.v-formlayout-spacing .v-formlayout-row .v-formlayout-errorcell { + padding-top: 8px; +} +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-captioncell, +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-contentcell, +.v-formlayout-margin-top .v-formlayout-firstrow .v-formlayout-errorcell { + padding-top: 15px; +} +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-captioncell, +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-contentcell, +.v-formlayout-margin-bottom .v-formlayout-lastrow .v-formlayout-errorcell { + padding-bottom: 15px; +} +.v-formlayout-margin-left .v-formlayout-captioncell { + padding-left: 18px; +} +.v-formlayout-margin-right .v-formlayout-contentcell { + padding-right: 18px; +} +/* form */ +.v-form-errormessage { + background: transparent url(icons/16/error.png) no-repeat top left; + padding-left: 20px; + margin-bottom: 5px; + margin-top: 5px; + min-height: 20px; +} +.v-ie6 .v-form-errormessage { + height: 20px +} +.v-form fieldset { + border: none; + border-top: 1px solid #babfc0; +} +.v-form legend { + margin: 0; + padding: 0 4px 0.3em 4px; + font-weight: bold; +} + /* ./WebContent/VAADIN/themes/reindeer/label/label.css */ .v-label { line-height: 18px; @@ -2399,6 +2582,14 @@ td.v-datefield-calendarpanel-nextyear { .v-orderedlayout-blue { background-color: #bcd3de; } +/* Black background */ +.v-verticallayout-black, +.v-horizontallayout-black, +.v-orderedlayout-black { + background: #16181a url(layouts/img/black-bg.png) repeat-x; + color: #c9ccce; + text-shadow: #000 0 0 1px; +} /* ./WebContent/VAADIN/themes/reindeer/notification/notification.css */ .v-Notification { @@ -3128,6 +3319,37 @@ input.v-textfield-prompt { .v-ie .v-table input.v-textfield { padding-top: 1px; } +/* Textfield on black background */ +.black .v-textfield { + border-color: #343536; + border-top-color: #2a2a2b; + border-bottom-color: #3a3b3c; + background: #1b1d1e; + background-image: url(common/img/black-vertical-sprites.png); + background-position: left -0px; + color: #c9ccce; + text-shadow: #000 0 0 1px; +} +.v-app .black .v-textfield-focus, +.v-window .black .v-textfield-focus, +.v-popupview-popup .black .v-textfield-focus { + border-color: #4e6a80; + border-top-color: #3a5163; + border-bottom-color: #557086; +} +/* Capable browsers get fancier border images */ +.v-sa .black input.v-textfield, +.v-ff35 .black input.v-textfield { + -webkit-border-image: url(textfield/img/bg-border-image-black.png) 0 3 0 3 stretch stretch; + -moz-border-image: url(textfield/img/bg-border-image-black.png) 0 3 0 3 stretch stretch; + -o-border-image: url(textfield/img/bg-border-image-black.png) 0 3 0 3 stretch stretch; +} +.v-sa .black input.v-textfield-focus, +.v-ff35 .black input.v-textfield-focus { + -webkit-border-image: url(textfield/img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; + -moz-border-image: url(textfield/img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; + -o-border-image: url(textfield/img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; +} /* ./WebContent/VAADIN/themes/reindeer/tree/tree.css */ .v-tree-node { diff --git a/WebContent/VAADIN/themes/reindeer/textfield/img/bg-black.png b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-black.png new file mode 100644 index 0000000000..ed00223de9 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black-focus.png b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black-focus.png new file mode 100644 index 0000000000..5c992745ec Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black-focus.png differ diff --git a/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black.png b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black.png new file mode 100644 index 0000000000..c88b3d31ad Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/textfield/img/bg-border-image-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/textfield/textfield.css b/WebContent/VAADIN/themes/reindeer/textfield/textfield.css index 20f898ac98..e4a0425e87 100644 --- a/WebContent/VAADIN/themes/reindeer/textfield/textfield.css +++ b/WebContent/VAADIN/themes/reindeer/textfield/textfield.css @@ -70,4 +70,34 @@ input.v-textfield-prompt { } .v-ie .v-table input.v-textfield { padding-top: 1px; +} +/* Textfield on black background */ +.black .v-textfield { + border-color: #343536; + border-top-color: #2a2a2b; + border-bottom-color: #3a3b3c; + background: #1b1d1e; + background-image: url(img/bg-black.png); /** sprite-ref: black-verticals; sprite-alignment: repeat; sprite-margin-bottom: 22px */ + color: #c9ccce; + text-shadow: #000 0 0 1px; +} +.v-app .black .v-textfield-focus, +.v-window .black .v-textfield-focus, +.v-popupview-popup .black .v-textfield-focus { + border-color: #4e6a80; + border-top-color: #3a5163; + border-bottom-color: #557086; +} +/* Capable browsers get fancier border images */ +.v-sa .black input.v-textfield, +.v-ff35 .black input.v-textfield { + -webkit-border-image: url(img/bg-border-image-black.png) 0 3 0 3 stretch stretch; + -moz-border-image: url(img/bg-border-image-black.png) 0 3 0 3 stretch stretch; + -o-border-image: url(img/bg-border-image-black.png) 0 3 0 3 stretch stretch; +} +.v-sa .black input.v-textfield-focus, +.v-ff35 .black input.v-textfield-focus { + -webkit-border-image: url(img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; + -moz-border-image: url(img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; + -o-border-image: url(img/bg-border-image-black-focus.png) 0 3 0 3 stretch stretch; } \ No newline at end of file diff --git a/WebContent/VAADIN/themes/runo/formlayout/formlayout.css b/WebContent/VAADIN/themes/runo/formlayout/formlayout.css index 86e66a841d..4c773b2e6e 100644 --- a/WebContent/VAADIN/themes/runo/formlayout/formlayout.css +++ b/WebContent/VAADIN/themes/runo/formlayout/formlayout.css @@ -7,10 +7,6 @@ text-align:right; white-space: nowrap; } -.v-formlayout-error-indicator { - /* fix width so layout is not jumpy when error disapear */ - width: 12px; -} .v-formlayout-spacing .v-formlayout-row .v-formlayout-captioncell, .v-formlayout-spacing .v-formlayout-row .v-formlayout-contentcell, .v-formlayout-spacing .v-formlayout-row .v-formlayout-errorcell { diff --git a/WebContent/VAADIN/themes/runo/styles.css b/WebContent/VAADIN/themes/runo/styles.css index de8355f01e..6268d7f1bf 100644 --- a/WebContent/VAADIN/themes/runo/styles.css +++ b/WebContent/VAADIN/themes/runo/styles.css @@ -438,6 +438,10 @@ .v-formlayout-cell .v-errorindicator { display: block; } +.v-formlayout-error-indicator { + /* fix width so layout is not jumpy when error disappears */ + width: 12px; +} .v-formlayout-captioncell { text-align:right; white-space: nowrap; @@ -1892,10 +1896,6 @@ div.v-window-header { text-align:right; white-space: nowrap; } -.v-formlayout-error-indicator { - /* fix width so layout is not jumpy when error disapear */ - width: 12px; -} .v-formlayout-spacing .v-formlayout-row .v-formlayout-captioncell, .v-formlayout-spacing .v-formlayout-row .v-formlayout-contentcell, .v-formlayout-spacing .v-formlayout-row .v-formlayout-errorcell {