From: Jouni Koivuviita Date: Fri, 22 May 2009 12:30:19 +0000 (+0000) Subject: Reindeer theme update: inline datefield now works on black background. X-Git-Tag: 6.7.0.beta1~2799 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=5647ae53d91ce3b5e0f1494b4e94d375a824f21c;p=vaadin-framework.git Reindeer theme update: inline datefield now works on black background. svn changeset:7960/svn branch:6.0 --- diff --git a/WebContent/VAADIN/themes/reindeer/button/button.css b/WebContent/VAADIN/themes/reindeer/button/button.css index 35973b057c..afe8fa4512 100644 --- a/WebContent/VAADIN/themes/reindeer/button/button.css +++ b/WebContent/VAADIN/themes/reindeer/button/button.css @@ -366,8 +366,7 @@ div > .v-button.v-button-link:active .v-button-caption, } /* Buttons on black background */ .v-ie6 .black .v-button { - border: 1px solid #505354; - border-bottom-color: #313435; + border: 1px solid #0d0e0f; background: #202224 url(img/black/right.png) no-repeat 0 -1px; color: #c9ccce; } diff --git a/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites-ie6.png index 297bb0add4..1f0bc9fdae 100644 Binary files a/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites-ie6.png and b/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites-ie6.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 index ffd2cc35e9..06b80e758d 100644 Binary files a/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites.png and b/WebContent/VAADIN/themes/reindeer/common/img/black-vertical-sprites.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/datefield.css b/WebContent/VAADIN/themes/reindeer/datefield/datefield.css index 8c39a34036..b6c507c17f 100644 --- a/WebContent/VAADIN/themes/reindeer/datefield/datefield.css +++ b/WebContent/VAADIN/themes/reindeer/datefield/datefield.css @@ -257,4 +257,87 @@ td.v-datefield-calendarpanel-nextyear { /* Small adjustment for IE6 */ .v-ie6 .v-datefield-popupcalendar .v-datefield-button { margin-top: 1px; +} + + +/*------------ +* on black background +*/ + +.black td.v-datefield-calendarpanel-month { + background-image: url(img/header-bg-black.png); /** sprite-ref: black-verticals; sprite-alignment: repeat */ + height: 21px; +} +.black span.v-datefield-calendarpanel-month { + border-left: 1px solid #333638; + border-right: 1px solid #232527; + text-shadow: #000 0 -1px 0; +} +.black .v-datefield-calendarpanel-prevyear button, +.black .v-datefield-calendarpanel-nextyear button, +.black .v-datefield-calendarpanel-prevmonth button, +.black .v-datefield-calendarpanel-nextmonth button { + background-image: url(img/year-prev-black.png); /** sprite-ref: black-verticals */ + height: 21px; +} +.black .v-datefield-calendarpanel-nextyear button { + background-image: url(img/year-next-black.png); /** sprite-ref: black-verticals */ +} +.black .v-datefield-calendarpanel-prevyear button:active, +.v-ie .black .v-datefield-calendarpanel-prevyear button.v-pressed { + background-image: url(img/year-prev-black-pressed.png); /** sprite-ref: black-verticals */ +} +.black .v-datefield-calendarpanel-nextyear button:active, +.v-ie .black .v-datefield-calendarpanel-nextyear button.v-pressed { + background-image: url(img/year-next-black-pressed.png); /** sprite-ref: black-verticals */ +} +.black .v-datefield-calendarpanel-prevmonth, +.black .v-datefield-calendarpanel-nextmonth { + background-image: url(img/header-bg-black.png); /** sprite-ref: black-verticals; sprite-alignment: repeat */ +} +.black .v-datefield-calendarpanel-prevmonth button, +.black .v-datefield-calendarpanel-nextmonth button { + border-left: 1px solid #333638; + border-right: 1px solid #232527; + background-image: url(img/month-prev-black.png); /** sprite-ref: black-verticals; sprite-alignment: center */ + margin-top: 0; +} +.black .v-datefield-calendarpanel-nextmonth button { + background-image: url(img/month-next-black.png); /** sprite-ref: black-verticals; sprite-alignment: center */ +} +.black .v-datefield-calendarpanel-prevmonth button:active, +.v-ie .black .v-datefield-calendarpanel-prevmonth button.v-pressed { + background-image: url(img/month-prev-black-pressed.png); /** sprite-ref: black-verticals; sprite-alignment: center */ +} +.black .v-datefield-calendarpanel-nextmonth button:active, +.v-ie .black .v-datefield-calendarpanel-nextmonth button.v-pressed { + background-image: url(img/month-next-black-pressed.png); /** sprite-ref: black-verticals; sprite-alignment: center */ +} +.v-ie .black .v-datefield-calendarpanel-prevmonth button, +.v-ie .black .v-datefield-calendarpanel-nextmonth button { + border: none; +} +.black .v-datefield-calendarpanel-weekdays td { + background-image: url(img/weekday-bg-black.png); /** sprite-ref: black-verticals; sprite-alignment: repeat; sprite-margin-bottom: 3px */ + color: #0a0b0b; + text-shadow: #5a5c5e 0 1px 0; +} +.black .v-datefield-calendarpanel-weekdays strong { + border-top-color: #1b1c1d; +} +.black .v-datefield-calendarpanel .v-first { + background-image: url(img/weekday-first-black.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 3px */ +} +.black .v-datefield-calendarpanel .v-last { + background-image: url(img/weekday-last-black.png); /** sprite-ref: black-verticals; sprite-alignment: right */ +} +/* IE fails to position backgrounds inside table element */ +.v-ie .black .v-datefield-calendarpanel-weekdays td { + background: url(img/weekday-bg-black.png) repeat-x; +} +.v-ie .black .v-datefield-calendarpanel .v-first { + background: url(img/weekday-first-black.png) no-repeat; +} +.v-ie .black .v-datefield-calendarpanel .v-last { + background: url(img/weekday-last-black.png) no-repeat right top; } \ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black-pressed.png b/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black-pressed.png new file mode 100644 index 0000000000..4da33f2113 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black.png new file mode 100644 index 0000000000..94517547c0 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/header-bg-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black-pressed.png b/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black-pressed.png new file mode 100644 index 0000000000..f4c54cd177 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black.png new file mode 100644 index 0000000000..37001e2794 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/month-next-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black-pressed.png b/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black-pressed.png new file mode 100644 index 0000000000..d57ed56a45 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black.png new file mode 100644 index 0000000000..2d525f5751 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/month-prev-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-bg-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-bg-black.png new file mode 100644 index 0000000000..f64cdafd5c Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-bg-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-first-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-first-black.png new file mode 100644 index 0000000000..ff6ee7ba1b Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-first-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-last-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-last-black.png new file mode 100644 index 0000000000..984d2c2129 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/weekday-last-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black-pressed.png b/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black-pressed.png new file mode 100644 index 0000000000..038f46149b Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black.png new file mode 100644 index 0000000000..45c762fbcd Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/year-next-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black-pressed.png b/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black-pressed.png new file mode 100644 index 0000000000..3df767e493 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black-pressed.png differ diff --git a/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black.png b/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black.png new file mode 100644 index 0000000000..05b7178722 Binary files /dev/null and b/WebContent/VAADIN/themes/reindeer/datefield/img/year-prev-black.png differ diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css index fd6107c3d1..3ce2f09d4e 100644 --- a/WebContent/VAADIN/themes/reindeer/styles.css +++ b/WebContent/VAADIN/themes/reindeer/styles.css @@ -2062,8 +2062,7 @@ div > .v-button.v-button-link:active .v-button-caption, } /* Buttons on black background */ .v-ie6 .black .v-button { - border: 1px solid #505354; - border-bottom-color: #313435; + border: 1px solid #0d0e0f; background: #202224 url(button/img/black/right.png) no-repeat 0 -1px; color: #c9ccce; } @@ -2508,6 +2507,115 @@ td.v-datefield-calendarpanel-nextyear { margin-top: 1px; } + +/*------------ +* on black background +*/ + +.black td.v-datefield-calendarpanel-month { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -46px; + height: 21px; +} +.black span.v-datefield-calendarpanel-month { + border-left: 1px solid #333638; + border-right: 1px solid #232527; + text-shadow: #000 0 -1px 0; +} +.black .v-datefield-calendarpanel-prevyear button, +.black .v-datefield-calendarpanel-nextyear button, +.black .v-datefield-calendarpanel-prevmonth button, +.black .v-datefield-calendarpanel-nextmonth button { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -67px; + height: 21px; +} +.black .v-datefield-calendarpanel-nextyear button { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -88px; +} +.black .v-datefield-calendarpanel-prevyear button:active, +.v-ie .black .v-datefield-calendarpanel-prevyear button.v-pressed { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -109px; +} +.black .v-datefield-calendarpanel-nextyear button:active, +.v-ie .black .v-datefield-calendarpanel-nextyear button.v-pressed { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -130px; +} +.black .v-datefield-calendarpanel-prevmonth, +.black .v-datefield-calendarpanel-nextmonth { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -151px; +} +.black .v-datefield-calendarpanel-prevmonth button, +.black .v-datefield-calendarpanel-nextmonth button { + border-left: 1px solid #333638; + border-right: 1px solid #232527; + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: center -172px; + margin-top: 0; +} +.black .v-datefield-calendarpanel-nextmonth button { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: center -193px; +} +.black .v-datefield-calendarpanel-prevmonth button:active, +.v-ie .black .v-datefield-calendarpanel-prevmonth button.v-pressed { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: center -214px; +} +.black .v-datefield-calendarpanel-nextmonth button:active, +.v-ie .black .v-datefield-calendarpanel-nextmonth button.v-pressed { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: center -235px; +} +.v-ie .black .v-datefield-calendarpanel-prevmonth button, +.v-ie .black .v-datefield-calendarpanel-nextmonth button { + border: none; +} +.black .v-datefield-calendarpanel-weekdays td { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -256px; + color: #0a0b0b; + text-shadow: #5a5c5e 0 1px 0; +} +.black .v-datefield-calendarpanel-weekdays strong { + border-top-color: #1b1c1d; +} +.black .v-datefield-calendarpanel .v-first { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: left -275px; +} +.black .v-datefield-calendarpanel .v-last { + background-image: url(common/img/black-vertical-sprites.png); + -background-image: url(common/img/black-vertical-sprites-ie6.png); + background-position: right -294px; +} +/* IE fails to position backgrounds inside table element */ +.v-ie .black .v-datefield-calendarpanel-weekdays td { + background: url(datefield/img/weekday-bg-black.png) repeat-x; +} +.v-ie .black .v-datefield-calendarpanel .v-first { + background: url(datefield/img/weekday-first-black.png) no-repeat; +} +.v-ie .black .v-datefield-calendarpanel .v-last { + background: url(datefield/img/weekday-last-black.png) no-repeat right top; +} + /* ./WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css */ .v-formlayout-cell .v-errorindicator { width: 13px; @@ -2942,7 +3050,7 @@ td.v-datefield-calendarpanel-nextyear { .black .v-filterselect { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -46px; + background-position: left -310px; } .v-app .black .v-filterselect-input, .v-window .black .v-filterselect-input, @@ -2950,37 +3058,37 @@ td.v-datefield-calendarpanel-nextyear { color: #c9ccce; background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -70px; + background-position: left -334px; } .black .v-filterselect-focus { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -94px; + background-position: left -358px; } .black .v-filterselect-focus .v-filterselect-input { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -118px; + background-position: left -382px; } .black .v-filterselect-button { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -142px; + background-position: left -406px; } .black .v-filterselect-button:hover { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -166px; + background-position: left -430px; } .black .v-filterselect-button:active { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -190px; + background-position: left -454px; } .black .v-filterselect-focus .v-filterselect-button { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -214px; + background-position: left -478px; } .black .v-filterselect-focus .v-filterselect-button:hover { background-image: url(common/img/vertical-sprites.png); @@ -2990,7 +3098,7 @@ td.v-datefield-calendarpanel-nextyear { .black .v-filterselect-focus .v-filterselect-button:active { background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -238px; + background-position: left -502px; } .black .v-disabled .v-filterselect-button:hover, .black .v-readonly .v-filterselect-button:hover { @@ -3474,7 +3582,7 @@ input.v-textfield-prompt { background: #1b1d1e; background-image: url(common/img/black-vertical-sprites.png); -background-image: url(common/img/black-vertical-sprites-ie6.png); - background-position: left -262px; + background-position: left -526px; color: #c9ccce; text-shadow: #000 0 0 1px; }