From: Jouni Koivuviita Date: Thu, 28 May 2009 07:21:46 +0000 (+0000) Subject: Reindeer theme: tabsheet default style changed to previous "framed" style, and previo... X-Git-Tag: 6.7.0.beta1~2752 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=b58225788c70eb2972bdf6dbae763bb249e04fae;p=vaadin-framework.git Reindeer theme: tabsheet default style changed to previous "framed" style, and previous default named to style "minimal". svn changeset:8041/svn branch:6.0 --- diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png index a65612cf3f..028218a6ab 100644 Binary files a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png and b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png differ diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png index 04cc05ea9d..b68e51aca4 100644 Binary files a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png and b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png differ diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css index 6a2dc2e988..1803e6d2f4 100644 --- a/WebContent/VAADIN/themes/reindeer/styles.css +++ b/WebContent/VAADIN/themes/reindeer/styles.css @@ -3749,66 +3749,120 @@ td.v-datefield-calendarpanel-nextyear { } /* ./WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css */ -.v-tabsheet-spacertd div { - border-color: #bfbfbf; - border-left: none; +.v-tabsheet-tabitemcell, +.v-tabsheet-spacertd { + height: 32px; } -.v-tabsheet-tabitem { +.v-tabsheet-tabitemcell { + background: no-repeat; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1208px; + padding-left: 3px; +} +.v-tabsheet-tabitemcell-first { + padding-left: 10px; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1240px; +} +.v-tabsheet-tabitem, +.v-tabsheet-spacertd div { border: none; - border-bottom: 1px solid #bfbfbf; - color: #4d748f; + height: 32px; + background: transparent repeat-x; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1272px; padding: 0; + color: #222; + text-shadow: #fff 0 1px 0; } .v-tabsheet-tabitem .v-caption { - padding: 5px 16px; + border: none; + height: 23px; + background: no-repeat right top; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: right -1304px; + padding: 9px 8px 0 6px; +} +.v-tabsheet-tabitem .v-captiontext { + height: 16px; + line-height: 16px; +} +.v-tabsheet-tabitemcell-selected { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1336px; +} +.v-tabsheet-tabitemcell-selected-first { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1368px; } .v-tabsheet-tabitem-selected { - border: 1px solid #bfbfbf; - border-bottom: none; - color: #222; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1400px; + color: #232930; } .v-tabsheet-tabitem-selected .v-caption { - padding: 4px 15px 6px 15px; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: right -1432px; } -.v-tabsheet-content { - border: none; +.v-tabsheet-spacertd div { + margin-right: 4px; } -.v-tabsheet-deco { - height: 0; +.v-tabsheet-spacertd { + background: transparent no-repeat right top; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: right -1464px; } -.v-tabsheet-tabs .v-icon, -.v-tabsheet-tabs .v-captiontext, -.v-tabsheet-tabs .v-errorindicator { - display: inline; - float: none; +.v-tabsheet-content { + border: 1px solid #dcdcdc; + border-bottom: none; + border-top: none; + color: #222; + text-shadow: none; } -.v-sa .v-tabsheet-tabs .v-captiontext { - display: inline-block; +.blue .v-tabsheet-content { + border-color: #a8bcc5; } -.v-tabsheet-tabs .v-icon { - width: 16px !important; - height: 16px !important; +.v-tabsheet-tabsheetpanel { + background: #fff; } -.v-tabsheet-tabs .v-errorindicator { - display: inline-block; - width: 13px; - height: 16px; - background: transparent url(common/icons/error.png) no-repeat 50%; +.v-sa .v-tabsheet-content, +.v-ff3 .v-tabsheet-content { + border-color: rgba(0,0,0,.1); } -.v-ff2 .v-tabsheet-tabs .v-icon, -.v-ff2 .v-tabsheet-tabs .v-errorindicator { - display: -moz-inline-stack; +.v-tabsheet-deco { + height: 1px; + border-top: 1px solid #bebebe; + background: #e2e2e2; + overflow: hidden; } -.v-ie6 .v-tabsheet-tabs .v-errorindicator { - background-image: url(common/icons/error-ie6.png); +.blue .v-tabsheet-deco { + border-color: #92a3ac; + background: #adc2cd; } -.v-ie .v-tabsheet-tabs .v-errorindicator { - zoom: 1; - display: inline; +.v-sa .v-tabsheet-deco, +.v-ff3 .v-tabsheet-deco { + border-top-color: rgba(0,0,0,.1); + background: rgba(0,0,0,.08); } .v-tabsheet-scroller { - margin-top: -20px; - height: 17px; + height: 31px; + margin-top: -31px; + padding-right: 3px; + border-right: 1px solid #afafaf; + position: relative; + float: right; +} +.v-tabsheet-scroller button { + margin-top: 7px; } .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, @@ -3818,7 +3872,7 @@ td.v-datefield-calendarpanel-nextyear { background: transparent; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1208px; + background-position: left -1496px; width: 18px; height: 17px; overflow: hidden; @@ -3830,23 +3884,23 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-scrollerNext { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1225px; + background-position: left -1513px; } .v-tabsheet-scrollerPrev:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1242px; + background-position: left -1530px; } .v-tabsheet-scrollerNext:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1259px; + background-position: left -1547px; } .v-tabsheet-scrollerPrev-disabled, .v-tabsheet-scrollerPrev-disabled:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1276px; + background-position: left -1564px; opacity: 1; filter: none; } @@ -3854,150 +3908,135 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-scrollerNext-disabled:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1293px; + background-position: left -1581px; opacity: 1; filter: none; } -/* Tabsheet on blue background */ -.blue .v-tabsheet-spacertd div, -.blue .v-tabsheet-tabitem, -.blue .v-tabsheet-tabitem-selected { - border-color: #7c8a91; +.v-tabsheet-tabs .v-icon, +.v-tabsheet-tabs .v-captiontext, +.v-tabsheet-tabs .v-errorindicator { + display: inline; + float: none; } -/* Tabsheet on black background */ -.black .v-tabsheet-spacertd div, -.black .v-tabsheet-tabitem, -.black .v-tabsheet-tabitem-selected { - border-color: #3e4044; - color: #6a7f89; +.v-sa .v-tabsheet-tabs .v-captiontext { + display: inline-block; } -.black .v-tabsheet-tabitem-selected { - color: #c9ccce; +.v-tabsheet-tabs .v-icon { + width: 16px !important; + height: 16px !important; +} +.v-tabsheet-tabs .v-errorindicator { + display: inline-block; + width: 13px; + height: 16px; + background: transparent url(common/icons/error.png) no-repeat 50%; +} +.v-ff2 .v-tabsheet-tabs .v-icon, +.v-ff2 .v-tabsheet-tabs .v-errorindicator { + display: -moz-inline-stack; +} +.v-ie6 .v-tabsheet-tabs .v-errorindicator { + background-image: url(common/icons/error-ie6.png); +} +.v-ie .v-tabsheet-tabs .v-errorindicator { + zoom: 1; + display: inline; } + + + /** - * Framed style --------------- + * Minimal style -------------- */ -.v-tabsheet-framed .v-tabsheet-tabitemcell, -.v-tabsheet-framed .v-tabsheet-spacertd { - height: 32px; -} -.v-tabsheet-framed .v-tabsheet-tabitemcell { - background: no-repeat; - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1311px; - padding-left: 3px; +.v-tabsheet-minimal .v-tabsheet-spacertd div { + border-bottom: 1px solid #bfbfbf; + height: auto; + background: transparent; } -.v-tabsheet-framed .v-tabsheet-tabitemcell-first { - padding-left: 10px; - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1343px; +.v-tabsheet-minimal .v-tabsheet-tabitemcell, +.v-tabsheet-minimal .v-tabsheet-spacertd { + height: auto; + background: transparent; + padding-left: 0; } -.v-tabsheet-framed .v-tabsheet-tabitem, -.v-tabsheet-framed .v-tabsheet-spacertd div { +.v-tabsheet-minimal .v-tabsheet-tabitem { border: none; - height: 32px; - background: transparent repeat-x; - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1375px; + border-bottom: 1px solid #bfbfbf; + color: #4d748f; padding: 0; - color: #222; - text-shadow: #fff 0 1px 0; -} -.v-tabsheet-framed .v-tabsheet-tabitem .v-caption { - border: none; - height: 23px; - background: no-repeat right top; - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: right -1407px; - padding: 9px 8px 0 6px; -} -.v-tabsheet-framed .v-tabsheet-tabitem .v-captiontext { - height: 16px; -} -.v-tabsheet-framed .v-tabsheet-tabitemcell-selected { - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1439px; -} -.v-tabsheet-framed .v-tabsheet-tabitemcell-selected-first { - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1471px; -} -.v-tabsheet-framed .v-tabsheet-tabitem-selected { - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1503px; - color: #232930; -} -.v-tabsheet-framed .v-tabsheet-tabitem-selected .v-caption { - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: right -1535px; + height: auto; + background: transparent; + text-shadow: none; } -.v-tabsheet-framed .v-tabsheet-spacertd div { - margin-right: 4px; +.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption { + padding: 5px 16px; + height: auto; + background: transparent; } -.v-tabsheet-framed .v-tabsheet-spacertd { - background: transparent no-repeat right top; - background-image: url(common/img/vertical-sprites.png); - -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: right -1567px; +.v-tabsheet-minimal .v-tabsheet-tabitemcell-selected { + background: transparent; } -.v-tabsheet-content-framed { - border: 1px solid #dcdcdc; +.v-tabsheet-minimal .v-tabsheet-tabitem-selected { + background: transparent; + border: 1px solid #bfbfbf; border-bottom: none; - border-top: none; color: #222; - text-shadow: none; } -.blue .v-tabsheet-content-framed { - border-color: #a8bcc5; +.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption { + background: transparent; + padding: 4px 15px 6px 15px; } -.v-tabsheet-content-framed .v-tabsheet-tabsheetpanel { - background: #fff; +.v-tabsheet-content-minimal { + border: none; } -.v-sa .v-tabsheet-content-framed, -.v-ff3 .v-tabsheet-content-framed { - border-color: rgba(0,0,0,.1); +.v-tabsheet-content-minimal .v-tabsheet-tabsheetpanel { + background: transparent; } -.v-tabsheet-deco-framed { - height: 1px; - border-top: 1px solid #bebebe; - background: #e2e2e2; - overflow: hidden; +.v-tabsheet-deco-minimal { + height: 0; + border: none; } -.blue .v-tabsheet-deco-framed { - border-color: #92a3ac; - background: #adc2cd; +.v-tabsheet-minimal .v-tabsheet-scroller { + margin-top: -20px; + height: 17px; + padding-right: 0; + border-right: none; + position: static; + float: none; } -.v-sa .v-tabsheet-deco-framed, -.v-ff3 .v-tabsheet-deco-framed { - border-top-color: rgba(0,0,0,.1); - background: rgba(0,0,0,.08); +.v-tabsheet-minimal .v-tabsheet-scroller button { + margin-top: 0; } -.v-tabsheet-framed .v-tabsheet-scroller { - height: 31px; - margin-top: -31px; - padding-right: 3px; - border-right: 1px solid #afafaf; - position: relative; - float: right; +/* Minimal tabsheet on blue background */ +.blue .v-tabsheet-minimal .v-tabsheet-spacertd div, +.blue .v-tabsheet-minimal .v-tabsheet-tabitem, +.blue .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + border-color: #7c8a91; } -.v-tabsheet-framed .v-tabsheet-scroller button { - margin-top: 7px; +/* Minimal tabsheet on black background */ +.black .v-tabsheet-minimal .v-tabsheet-spacertd div, +.black .v-tabsheet-minimal .v-tabsheet-tabitem, +.black .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + border-color: #3e4044; + color: #6a7f89; +} +.black .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + color: #c9ccce; +} +.black .v-tabsheet-content-minimal, +.black .v-tabsheet-content-bar { + color: #c9ccce; + text-shadow: #000 0 0 1px; } + + /** * Bar style --------------- */ @@ -4005,12 +4044,13 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-bar .v-tabsheet-spacertd { height: 20px; } +.v-tabsheet-bar .v-tabsheet-spacertd { + background: transparent; +} .v-tabsheet-bar .v-tabsheet-tabitemcell { - background: no-repeat; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); background-position: left -1599px; - padding-left: 3px; } .v-tabsheet-bar .v-tabsheet-tabitemcell-first { padding-left: 6px; @@ -4020,30 +4060,20 @@ td.v-datefield-calendarpanel-nextyear { } .v-tabsheet-bar .v-tabsheet-tabitem, .v-tabsheet-bar .v-tabsheet-spacertd div { - border: none; height: 20px; - background: transparent repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); background-position: left -1639px; - padding: 0; - color: #222; - text-shadow: #fff 0 1px 0; font-size: 11px; + margin: 0; } .v-tabsheet-bar .v-tabsheet-tabitem .v-caption { - border: none; height: 18px; - background: no-repeat right top; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); background-position: right -1659px; padding: 2px 12px 0 10px; } -.v-tabsheet-bar .v-tabsheet-tabitem .v-captiontext { - height: 16px; - line-height: 16px; -} .v-tabsheet-bar .v-tabsheet-tabitemcell-selected { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); @@ -4068,6 +4098,28 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-bar .v-tabsheet-scroller { margin-top: -19px; } +.v-tabsheet-bar .v-tabsheet-scroller { + margin-top: -19px; + height: 17px; + padding-right: 0; + border-right: none; + position: static; + float: none; +} +.v-tabsheet-bar .v-tabsheet-scroller button { + margin-top: 0; +} +.v-tabsheet-content-bar { + border: none; +} +.v-tabsheet-content-bar .v-tabsheet-tabsheetpanel { + background: transparent; +} +.v-tabsheet-deco-bar { + height: 0; + border: none; +} +/* Content area font color specified with minimal style (reduces additional selectors) */ /* ./WebContent/VAADIN/themes/reindeer/textfield/textfield.css */ .v-textfield { diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css index c5c9b03d8b..289660eb3b 100644 --- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css @@ -1,63 +1,99 @@ -.v-tabsheet-spacertd div { - border-color: #bfbfbf; - border-left: none; +.v-tabsheet-tabitemcell, +.v-tabsheet-spacertd { + height: 32px; +} +.v-tabsheet-tabitemcell { + background: no-repeat; + background-image: url(img/framed/tab-left.png); /** sprite-ref: verticals */ + padding-left: 3px; +} +.v-tabsheet-tabitemcell-first { + padding-left: 10px; + background-image: url(img/framed/tab-first-left.png); /** sprite-ref: verticals */ } -.v-tabsheet-tabitem { +.v-tabsheet-tabitem, +.v-tabsheet-spacertd div { border: none; - border-bottom: 1px solid #bfbfbf; - color: #4d748f; + height: 32px; + background: transparent repeat-x; + background-image: url(img/framed/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ padding: 0; + color: #222; + text-shadow: #fff 0 1px 0; } .v-tabsheet-tabitem .v-caption { - padding: 5px 16px; + border: none; + height: 23px; + background: no-repeat right top; + background-image: url(img/framed/tab-right.png); /** sprite-ref: verticals; sprite-alignment: right */ + padding: 9px 8px 0 6px; +} +.v-tabsheet-tabitem .v-captiontext { + height: 16px; + line-height: 16px; +} +.v-tabsheet-tabitemcell-selected { + background-image: url(img/framed/tab-left-sel.png); /** sprite-ref: verticals */ +} +.v-tabsheet-tabitemcell-selected-first { + background-image: url(img/framed/tab-first-left-sel.png); /** sprite-ref: verticals */ } .v-tabsheet-tabitem-selected { - border: 1px solid #bfbfbf; - border-bottom: none; - color: #222; + background-image: url(img/framed/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + color: #232930; } .v-tabsheet-tabitem-selected .v-caption { - padding: 4px 15px 6px 15px; + background-image: url(img/framed/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ } -.v-tabsheet-content { - border: none; +.v-tabsheet-spacertd div { + margin-right: 4px; } -.v-tabsheet-deco { - height: 0; +.v-tabsheet-spacertd { + background: transparent no-repeat right top; + background-image: url(img/framed/tab-spacer-right.png); /** sprite-ref: verticals; sprite-alignment: right */ } -.v-tabsheet-tabs .v-icon, -.v-tabsheet-tabs .v-captiontext, -.v-tabsheet-tabs .v-errorindicator { - display: inline; - float: none; +.v-tabsheet-content { + border: 1px solid #dcdcdc; + border-bottom: none; + border-top: none; + color: #222; + text-shadow: none; } -.v-sa .v-tabsheet-tabs .v-captiontext { - display: inline-block; +.blue .v-tabsheet-content { + border-color: #a8bcc5; } -.v-tabsheet-tabs .v-icon { - width: 16px !important; - height: 16px !important; +.v-tabsheet-tabsheetpanel { + background: #fff; } -.v-tabsheet-tabs .v-errorindicator { - display: inline-block; - width: 13px; - height: 16px; - background: transparent url(../common/icons/error.png) no-repeat 50%; +.v-sa .v-tabsheet-content, +.v-ff3 .v-tabsheet-content { + border-color: rgba(0,0,0,.1); } -.v-ff2 .v-tabsheet-tabs .v-icon, -.v-ff2 .v-tabsheet-tabs .v-errorindicator { - display: -moz-inline-stack; +.v-tabsheet-deco { + height: 1px; + border-top: 1px solid #bebebe; + background: #e2e2e2; + overflow: hidden; } -.v-ie6 .v-tabsheet-tabs .v-errorindicator { - background-image: url(../common/icons/error-ie6.png); +.blue .v-tabsheet-deco { + border-color: #92a3ac; + background: #adc2cd; } -.v-ie .v-tabsheet-tabs .v-errorindicator { - zoom: 1; - display: inline; +.v-sa .v-tabsheet-deco, +.v-ff3 .v-tabsheet-deco { + border-top-color: rgba(0,0,0,.1); + background: rgba(0,0,0,.08); } .v-tabsheet-scroller { - margin-top: -20px; - height: 17px; + height: 31px; + margin-top: -31px; + padding-right: 3px; + border-right: 1px solid #afafaf; + position: relative; + float: right; +} +.v-tabsheet-scroller button { + margin-top: 7px; } .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, @@ -95,124 +131,127 @@ opacity: 1; filter: none; } -/* Tabsheet on blue background */ -.blue .v-tabsheet-spacertd div, -.blue .v-tabsheet-tabitem, -.blue .v-tabsheet-tabitem-selected { - border-color: #7c8a91; +.v-tabsheet-tabs .v-icon, +.v-tabsheet-tabs .v-captiontext, +.v-tabsheet-tabs .v-errorindicator { + display: inline; + float: none; } -/* Tabsheet on black background */ -.black .v-tabsheet-spacertd div, -.black .v-tabsheet-tabitem, -.black .v-tabsheet-tabitem-selected { - border-color: #3e4044; - color: #6a7f89; +.v-sa .v-tabsheet-tabs .v-captiontext { + display: inline-block; } -.black .v-tabsheet-tabitem-selected { - color: #c9ccce; +.v-tabsheet-tabs .v-icon { + width: 16px !important; + height: 16px !important; +} +.v-tabsheet-tabs .v-errorindicator { + display: inline-block; + width: 13px; + height: 16px; + background: transparent url(../common/icons/error.png) no-repeat 50%; +} +.v-ff2 .v-tabsheet-tabs .v-icon, +.v-ff2 .v-tabsheet-tabs .v-errorindicator { + display: -moz-inline-stack; +} +.v-ie6 .v-tabsheet-tabs .v-errorindicator { + background-image: url(../common/icons/error-ie6.png); +} +.v-ie .v-tabsheet-tabs .v-errorindicator { + zoom: 1; + display: inline; } + + + /** - * Framed style --------------- + * Minimal style -------------- */ -.v-tabsheet-framed .v-tabsheet-tabitemcell, -.v-tabsheet-framed .v-tabsheet-spacertd { - height: 32px; -} -.v-tabsheet-framed .v-tabsheet-tabitemcell { - background: no-repeat; - background-image: url(img/framed/tab-left.png); /** sprite-ref: verticals */ - padding-left: 3px; +.v-tabsheet-minimal .v-tabsheet-spacertd div { + border-bottom: 1px solid #bfbfbf; + height: auto; + background: transparent; } -.v-tabsheet-framed .v-tabsheet-tabitemcell-first { - padding-left: 10px; - background-image: url(img/framed/tab-first-left.png); /** sprite-ref: verticals */ +.v-tabsheet-minimal .v-tabsheet-tabitemcell, +.v-tabsheet-minimal .v-tabsheet-spacertd { + height: auto; + background: transparent; + padding-left: 0; } -.v-tabsheet-framed .v-tabsheet-tabitem, -.v-tabsheet-framed .v-tabsheet-spacertd div { +.v-tabsheet-minimal .v-tabsheet-tabitem { border: none; - height: 32px; - background: transparent repeat-x; - background-image: url(img/framed/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + border-bottom: 1px solid #bfbfbf; + color: #4d748f; padding: 0; - color: #222; - text-shadow: #fff 0 1px 0; -} -.v-tabsheet-framed .v-tabsheet-tabitem .v-caption { - border: none; - height: 23px; - background: no-repeat right top; - background-image: url(img/framed/tab-right.png); /** sprite-ref: verticals; sprite-alignment: right */ - padding: 9px 8px 0 6px; -} -.v-tabsheet-framed .v-tabsheet-tabitem .v-captiontext { - height: 16px; -} -.v-tabsheet-framed .v-tabsheet-tabitemcell-selected { - background-image: url(img/framed/tab-left-sel.png); /** sprite-ref: verticals */ -} -.v-tabsheet-framed .v-tabsheet-tabitemcell-selected-first { - background-image: url(img/framed/tab-first-left-sel.png); /** sprite-ref: verticals */ -} -.v-tabsheet-framed .v-tabsheet-tabitem-selected { - background-image: url(img/framed/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ - color: #232930; -} -.v-tabsheet-framed .v-tabsheet-tabitem-selected .v-caption { - background-image: url(img/framed/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ + height: auto; + background: transparent; + text-shadow: none; } -.v-tabsheet-framed .v-tabsheet-spacertd div { - margin-right: 4px; +.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption { + padding: 5px 16px; + height: auto; + background: transparent; } -.v-tabsheet-framed .v-tabsheet-spacertd { - background: transparent no-repeat right top; - background-image: url(img/framed/tab-spacer-right.png); /** sprite-ref: verticals; sprite-alignment: right */ +.v-tabsheet-minimal .v-tabsheet-tabitemcell-selected { + background: transparent; } -.v-tabsheet-content-framed { - border: 1px solid #dcdcdc; +.v-tabsheet-minimal .v-tabsheet-tabitem-selected { + background: transparent; + border: 1px solid #bfbfbf; border-bottom: none; - border-top: none; color: #222; - text-shadow: none; } -.blue .v-tabsheet-content-framed { - border-color: #a8bcc5; +.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption { + background: transparent; + padding: 4px 15px 6px 15px; } -.v-tabsheet-content-framed .v-tabsheet-tabsheetpanel { - background: #fff; +.v-tabsheet-content-minimal { + border: none; } -.v-sa .v-tabsheet-content-framed, -.v-ff3 .v-tabsheet-content-framed { - border-color: rgba(0,0,0,.1); +.v-tabsheet-content-minimal .v-tabsheet-tabsheetpanel { + background: transparent; } -.v-tabsheet-deco-framed { - height: 1px; - border-top: 1px solid #bebebe; - background: #e2e2e2; - overflow: hidden; +.v-tabsheet-deco-minimal { + height: 0; + border: none; } -.blue .v-tabsheet-deco-framed { - border-color: #92a3ac; - background: #adc2cd; +.v-tabsheet-minimal .v-tabsheet-scroller { + margin-top: -20px; + height: 17px; + padding-right: 0; + border-right: none; + position: static; + float: none; } -.v-sa .v-tabsheet-deco-framed, -.v-ff3 .v-tabsheet-deco-framed { - border-top-color: rgba(0,0,0,.1); - background: rgba(0,0,0,.08); +.v-tabsheet-minimal .v-tabsheet-scroller button { + margin-top: 0; } -.v-tabsheet-framed .v-tabsheet-scroller { - height: 31px; - margin-top: -31px; - padding-right: 3px; - border-right: 1px solid #afafaf; - position: relative; - float: right; +/* Minimal tabsheet on blue background */ +.blue .v-tabsheet-minimal .v-tabsheet-spacertd div, +.blue .v-tabsheet-minimal .v-tabsheet-tabitem, +.blue .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + border-color: #7c8a91; } -.v-tabsheet-framed .v-tabsheet-scroller button { - margin-top: 7px; +/* Minimal tabsheet on black background */ +.black .v-tabsheet-minimal .v-tabsheet-spacertd div, +.black .v-tabsheet-minimal .v-tabsheet-tabitem, +.black .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + border-color: #3e4044; + color: #6a7f89; +} +.black .v-tabsheet-minimal .v-tabsheet-tabitem-selected { + color: #c9ccce; } +.black .v-tabsheet-content-minimal, +.black .v-tabsheet-content-bar { + color: #c9ccce; + text-shadow: #000 0 0 1px; +} + + @@ -224,10 +263,11 @@ .v-tabsheet-bar .v-tabsheet-spacertd { height: 20px; } +.v-tabsheet-bar .v-tabsheet-spacertd { + background: transparent; +} .v-tabsheet-bar .v-tabsheet-tabitemcell { - background: no-repeat; background-image: url(img/bar/tab-left.png); /** sprite-ref: verticals */ - padding-left: 3px; } .v-tabsheet-bar .v-tabsheet-tabitemcell-first { padding-left: 6px; @@ -235,26 +275,16 @@ } .v-tabsheet-bar .v-tabsheet-tabitem, .v-tabsheet-bar .v-tabsheet-spacertd div { - border: none; height: 20px; - background: transparent repeat-x; background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ - padding: 0; - color: #222; - text-shadow: #fff 0 1px 0; font-size: 11px; + margin: 0; } .v-tabsheet-bar .v-tabsheet-tabitem .v-caption { - border: none; height: 18px; - background: no-repeat right top; background-image: url(img/bar/tab-right.png); /** sprite-ref: verticals; sprite-alignment: right */ padding: 2px 12px 0 10px; } -.v-tabsheet-bar .v-tabsheet-tabitem .v-captiontext { - height: 16px; - line-height: 16px; -} .v-tabsheet-bar .v-tabsheet-tabitemcell-selected { background-image: url(img/bar/tab-left-sel.png); /** sprite-ref: verticals */ } @@ -270,4 +300,26 @@ } .v-tabsheet-bar .v-tabsheet-scroller { margin-top: -19px; -} \ No newline at end of file +} +.v-tabsheet-bar .v-tabsheet-scroller { + margin-top: -19px; + height: 17px; + padding-right: 0; + border-right: none; + position: static; + float: none; +} +.v-tabsheet-bar .v-tabsheet-scroller button { + margin-top: 0; +} +.v-tabsheet-content-bar { + border: none; +} +.v-tabsheet-content-bar .v-tabsheet-tabsheetpanel { + background: transparent; +} +.v-tabsheet-deco-bar { + height: 0; + border: none; +} +/* Content area font color specified with minimal style (reduces additional selectors) */ \ No newline at end of file