diff options
Diffstat (limited to 'WebContent/VAADIN/themes')
21 files changed, 835 insertions, 432 deletions
diff --git a/WebContent/VAADIN/themes/base/styles.css b/WebContent/VAADIN/themes/base/styles.css index 5908dcec9f..e0908ddd88 100644 --- a/WebContent/VAADIN/themes/base/styles.css +++ b/WebContent/VAADIN/themes/base/styles.css @@ -1387,6 +1387,9 @@ div.v-progressindicator-indeterminate-disabled { .v-ff2 .v-tabsheet-scroller { position: relative; } +.v-disabled .v-tabsheet-scroller { + display: none; +} .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, .v-tabsheet-scrollerPrev-disabled, @@ -1412,12 +1415,26 @@ div.v-progressindicator-indeterminate-disabled { zoom: 1; width: 16px; height: 16px; - background: url(common/img/close.png) no-repeat; + text-align: center; + font-weight: bold; cursor: pointer; vertical-align: middle; + user-select: none; + -khtml-user-select: none; + -ms-user-select: none; + -moz-user-select: none; + -webkit-user-select: none; } -.v-disabled .v-tabsheet-caption-close { +.v-tabsheet .v-disabled .v-tabsheet-caption-close { cursor: default; + visibility: hidden; +} +.v-tabsheet-tabitemcell:hover .v-tabsheet-caption-close, +.v-ie6 .v-tabsheet-caption-close { + visibility: visible; +} +.v-ie6 .v-tabsheet-caption-close { + float: right; } .v-tabsheet-tabitem { border: 1px solid #aaa; @@ -1642,9 +1659,9 @@ div.v-tree-node-leaf { position: absolute; top: 0; right: 0; - width: 16px; - height: 16px; - background: url(common/img/close.png) no-repeat; + width: 1em; + height: 1em; + background: red; cursor: pointer; overflow: hidden; } diff --git a/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css index 8520f35913..6fd1f1470a 100644 --- a/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css +++ b/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css @@ -39,6 +39,9 @@ .v-ff2 .v-tabsheet-scroller { position: relative; } +.v-disabled .v-tabsheet-scroller { + display: none; +} .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, .v-tabsheet-scrollerPrev-disabled, @@ -58,6 +61,33 @@ .v-tabsheet-tabs .v-caption span { white-space: nowrap; } +.v-tabsheet-caption-close { + display: inline; + display: inline-block; + zoom: 1; + width: 16px; + height: 16px; + text-align: center; + font-weight: bold; + cursor: pointer; + vertical-align: middle; + user-select: none; + -khtml-user-select: none; + -ms-user-select: none; + -moz-user-select: none; + -webkit-user-select: none; +} +.v-tabsheet .v-disabled .v-tabsheet-caption-close { + cursor: default; + visibility: hidden; +} +.v-tabsheet-tabitemcell:hover .v-tabsheet-caption-close, +.v-ie6 .v-tabsheet-caption-close { + visibility: visible; +} +.v-ie6 .v-tabsheet-caption-close { + float: right; +} .v-tabsheet-tabitem { border: 1px solid #aaa; border-right: none; diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png Binary files differindex c4ee4bdcd1..c11ee47f9e 100644 --- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png +++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png Binary files differindex b68e51aca4..4a4537ac06 100644 --- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png +++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css index 1aa84f88d3..be563abfc3 100644 --- a/WebContent/VAADIN/themes/reindeer/styles.css +++ b/WebContent/VAADIN/themes/reindeer/styles.css @@ -1387,6 +1387,9 @@ div.v-progressindicator-indeterminate-disabled { .v-ff2 .v-tabsheet-scroller { position: relative; } +.v-disabled .v-tabsheet-scroller { + display: none; +} .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, .v-tabsheet-scrollerPrev-disabled, @@ -1412,12 +1415,26 @@ div.v-progressindicator-indeterminate-disabled { zoom: 1; width: 16px; height: 16px; - background: url(../base/common/img/close.png) no-repeat; + text-align: center; + font-weight: bold; cursor: pointer; vertical-align: middle; + user-select: none; + -khtml-user-select: none; + -ms-user-select: none; + -moz-user-select: none; + -webkit-user-select: none; } -.v-disabled .v-tabsheet-caption-close { +.v-tabsheet .v-disabled .v-tabsheet-caption-close { cursor: default; + visibility: hidden; +} +.v-tabsheet-tabitemcell:hover .v-tabsheet-caption-close, +.v-ie6 .v-tabsheet-caption-close { + visibility: visible; +} +.v-ie6 .v-tabsheet-caption-close { + float: right; } .v-tabsheet-tabitem { border: 1px solid #aaa; @@ -1642,9 +1659,9 @@ div.v-tree-node-leaf { position: absolute; top: 0; right: 0; - width: 16px; - height: 16px; - background: url(../base/common/img/close.png) no-repeat; + width: 1em; + height: 1em; + background: red; cursor: pointer; overflow: hidden; } @@ -3143,6 +3160,8 @@ td.v-datefield-calendarpanel-nextyear { border-bottom: none; border-top: none; } +.blue .v-panel-caption, +.blue .v-panel-nocaption, .blue .v-panel-content { border-color: #a8bcc5; } @@ -3150,11 +3169,13 @@ td.v-datefield-calendarpanel-nextyear { .v-ff3 .v-panel-content { border-color: rgba(0,0,0,.1); } -.v-panel-content > div, -.v-ie6 .v-panel-content { +.v-panel-content > div { background: #fff; min-height: 100%; } +.v-ie6 .v-panel-content { + background: #fff; +} .v-panel-deco { height: 1px; border-top: 1px solid #bebebe; @@ -3196,6 +3217,9 @@ td.v-datefield-calendarpanel-nextyear { .v-panel-content-light > div { background: transparent; } +.v-ie6 .v-panel-content-light { + background: transparent; +} .v-panel-deco-light { height: 0; border: none; @@ -3967,6 +3991,10 @@ td.v-datefield-calendarpanel-nextyear { border: none; } +/* These styles get catenated together on build */ + +/* Default Tabsheet styles */ + .v-tabsheet-tabitemcell, .v-tabsheet-spacertd { height: 32px; @@ -4005,33 +4033,80 @@ td.v-datefield-calendarpanel-nextyear { background-position: right -1304px; padding: 9px 8px 0 6px; } +.v-tabsheet-tabitem .v-caption-closable { + padding-right: 0; + padding-left: 17px; +} .v-tabsheet-tabitem .v-captiontext { height: 16px; line-height: 16px; } .v-tabsheet-caption-close { - + float: right; + width: 19px; + height: 18px; + margin: -1px -1px 0; + padding-left: 2px; + background: transparent; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1336px; + cursor: default; + text-indent: -999px; + overflow: hidden; +} +.v-ff .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-caption-close { + margin-top: -17px; +} +.v-ie6 .v-tabsheet-caption-close { + float: none; +} +.v-tabsheet-caption-close:hover { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1354px; +} +.v-tabsheet-caption-close:active { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1372px; +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1390px; +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close:hover { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1408px; +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close:active { + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1426px; } .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; + background-position: left -1444px; } .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; + background-position: left -1476px; } .v-tabsheet-tabitem-selected { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1400px; + background-position: left -1508px; color: #232930; } .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 -1432px; + background-position: right -1540px; } .v-tabsheet-spacertd div { margin-right: 4px; @@ -4040,7 +4115,7 @@ td.v-datefield-calendarpanel-nextyear { 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; + background-position: right -1572px; } .v-tabsheet-content { border: 1px solid #dcdcdc; @@ -4074,13 +4149,53 @@ td.v-datefield-calendarpanel-nextyear { border-top-color: rgba(0,0,0,.1); background: rgba(0,0,0,.08); } + + +/* Icons & error indicators */ + +.v-tabsheet-tabs .v-icon, +.v-tabsheet-tabs .v-captiontext, +.v-tabsheet-tabs .v-errorindicator { + display: inline; + float: none; +} +.v-sa .v-tabsheet-tabs .v-captiontext { + display: inline-block; +} +.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; +} + +/* Tabsheet scroller styles */ + .v-tabsheet-scroller { height: 31px; margin-top: -31px; - padding-right: 3px; - border-right: 1px solid #afafaf; + padding: 0 3px 0 4px; + border-right: 1px solid #c2c2c2; + border-left: 1px solid #cfcfcf; position: relative; float: right; + background: transparent url(tabsheet/img/framed/tab-bg.png) repeat-x left -1px; + width: 36px; } .v-tabsheet-scroller button { margin-top: 7px; @@ -4093,7 +4208,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 -1496px; + background-position: left -1604px; width: 18px; height: 17px; overflow: hidden; @@ -4105,23 +4220,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 -1513px; + background-position: left -1621px; } .v-tabsheet-scrollerPrev:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1530px; + background-position: left -1638px; } .v-tabsheet-scrollerNext:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1547px; + background-position: left -1655px; } .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 -1564px; + background-position: left -1672px; opacity: 1; filter: none; } @@ -4129,48 +4244,13 @@ 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 -1581px; + background-position: left -1689px; opacity: 1; filter: none; } -.v-tabsheet-tabs .v-icon, -.v-tabsheet-tabs .v-captiontext, -.v-tabsheet-tabs .v-errorindicator { - display: inline; - float: none; -} -.v-sa .v-tabsheet-tabs .v-captiontext { - display: inline-block; -} -.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; -} - - - - - /** - * Minimal style -------------- + * Tabsheet "minimal" style -------------- */ .v-tabsheet-minimal .v-tabsheet-spacertd div { border-bottom: 1px solid #bfbfbf; @@ -4210,6 +4290,10 @@ td.v-datefield-calendarpanel-nextyear { background: transparent; padding: 4px 15px 6px 15px; } +.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption-closable, +.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption-closable { + padding-right: 6px; +} .v-tabsheet-content-minimal { border: none; } @@ -4223,20 +4307,58 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-minimal .v-tabsheet-scroller { margin-top: -20px; height: 17px; - padding-right: 0; - border-right: none; - position: static; - float: none; + padding: 0; + border: none; + background: transparent; } .v-tabsheet-minimal .v-tabsheet-scroller button { margin-top: 0; } +.v-tabsheet-minimal .v-tabsheet-caption-close, +.v-tabsheet-minimal .v-tabsheet-caption-close:hover, +.v-tabsheet-minimal .v-tabsheet-caption-close:active { + text-indent: 0; + background: transparent; + margin-left: 3px; + margin-right: -3px; + padding: 0; + color: #999; + width: 15px; + height: 15px; + line-height: 14px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; +} +.v-tabsheet-minimal .v-tabsheet-caption-close { + margin-top: 1px; +} +.v-ff .v-tabsheet-minimal .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-minimal .v-tabsheet-caption-close { + margin-top: -15px; +} +.v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #fff; + background: #aaa; +} +.v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #777; +} /* 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; } +.blue .v-tabsheet-minimal .v-tabsheet-caption-close { + color: #7c8a91; +} +.blue .v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #BCD3DE; + background: #778d98; +} +.blue .v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #4f6874; +} /* Minimal tabsheet on black background */ .black .v-tabsheet-minimal .v-tabsheet-spacertd div, .black .v-tabsheet-minimal .v-tabsheet-tabitem, @@ -4252,14 +4374,19 @@ td.v-datefield-calendarpanel-nextyear { color: #c9ccce; text-shadow: #000 0 0 1px; } - - - - - +.black .v-tabsheet-minimal .v-tabsheet-caption-close { + color: #72787c; +} +.black .v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #1d2021; + background: #4d5154; +} +.black .v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #626669; +} /** - * Bar style --------------- + * Tabsheet bar style --------------- */ .v-tabsheet-bar .v-tabsheet-tabitemcell, .v-tabsheet-bar .v-tabsheet-spacertd { @@ -4271,20 +4398,20 @@ td.v-datefield-calendarpanel-nextyear { .v-tabsheet-bar .v-tabsheet-tabitemcell { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1599px; + background-position: left -1707px; } .v-tabsheet-bar .v-tabsheet-tabitemcell-first { padding-left: 6px; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1619px; + background-position: left -1727px; } .v-tabsheet-bar .v-tabsheet-tabitem, .v-tabsheet-bar .v-tabsheet-spacertd div { height: 20px; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1639px; + background-position: left -1747px; font-size: 11px; margin: 0; } @@ -4292,43 +4419,86 @@ td.v-datefield-calendarpanel-nextyear { height: 18px; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: right -1659px; + background-position: right -1767px; padding: 2px 12px 0 10px; } +.v-tabsheet-bar .v-tabsheet-tabitem .v-caption-closable, +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-caption-closable { + padding-right: 8px; + padding-left: 14px; +} +.v-tabsheet-bar .v-tabsheet-caption-close, +.v-tabsheet-bar .v-tabsheet-caption-close:hover, +.v-tabsheet-bar .v-tabsheet-caption-close:active { + text-indent: 0; + background: transparent; + margin-left: 3px; + margin-right: -3px; + padding: 0; + color: #3c3c3c; + width: 14px; + height: 14px; + line-height: 12px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; +} +.v-tabsheet-bar .v-tabsheet-caption-close { + margin-top: 0; +} +.v-ff .v-tabsheet-bar .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-bar .v-tabsheet-caption-close { + margin-top: -15px; +} +.v-tabsheet-bar .v-tabsheet-caption-close:hover { + background: #bfbfbf; + -webkit-box-shadow: 0 1px 0 #fff; +} +.v-tabsheet-bar .v-tabsheet-caption-close:active { + background: #a9a9a9; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close { + color: #404142; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close:hover { + background: #5e666e; + color: #fff; + text-shadow: 0 -1px 0 #222; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close:active { + background: #404142; +} + .v-tabsheet-bar .v-tabsheet-tabitemcell-selected { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1679px; + background-position: left -1787px; } .v-tabsheet-bar .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 -1699px; + background-position: left -1807px; } .v-tabsheet-bar .v-tabsheet-tabitem-selected { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1719px; + background-position: left -1827px; color: #232930; } .v-tabsheet-bar .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 -1739px; + background-position: right -1847px; } .v-tabsheet-bar .v-tabsheet-scroller { - margin-top: -19px; -} -.v-tabsheet-bar .v-tabsheet-scroller { - margin-top: -19px; - height: 17px; - padding-right: 0; + margin-top: -20px; + height: 19px; border-right: none; - position: static; - float: none; + background-image: url(common/img/vertical-sprites.png); + -background-image: url(common/img/vertical-sprites-ie6.png); + background-position: left -1867px; } .v-tabsheet-bar .v-tabsheet-scroller button { - margin-top: 0; + margin-top: 1px; } .v-tabsheet-content-bar { border: none; @@ -4353,7 +4523,7 @@ td.v-datefield-calendarpanel-nextyear { background-repeat: repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1759px; + background-position: left -1887px; border-radius: 3px; -moz-border-radius: 3px; margin: 0; @@ -4512,7 +4682,7 @@ input.v-textfield-readonly, background: #4d749f repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1782px; + background-position: left -1910px; color: #fff; padding: 1px 2px; -webkit-border-radius: 2px; @@ -4567,7 +4737,7 @@ input.v-textfield-readonly, background: transparent repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1802px; + background-position: left -1930px; } .v-window-header { font-weight: bold; @@ -4594,13 +4764,13 @@ input.v-textfield-readonly, background: transparent; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1839px; + background-position: left -1967px; } .v-window-footer { background-repeat: repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1854px; + background-position: left -1982px; height: 15px; } .v-window-closebox { @@ -4611,17 +4781,17 @@ input.v-textfield-readonly, background: transparent; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1869px; + background-position: left -1997px; } .v-window-closebox:hover { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1885px; + background-position: left -2013px; } .v-window-closebox:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1901px; + background-position: left -2029px; } .v-window-contents { background: #fff; @@ -4654,7 +4824,7 @@ input.v-textfield-readonly, height: 12px; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1917px; + background-position: left -2045px; } .v-window-light .v-window-footer { background: transparent; @@ -4667,17 +4837,17 @@ input.v-textfield-readonly, height: 15px; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1929px; + background-position: left -2057px; } .v-window-light .v-window-closebox:hover { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1944px; + background-position: left -2072px; } .v-window-light .v-window-closebox:active { background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1959px; + background-position: left -2087px; } .v-window-light .v-window-contents { background: transparent; @@ -4687,7 +4857,7 @@ input.v-textfield-readonly, background: #f7f7f8 repeat-x; background-image: url(common/img/vertical-sprites.png); -background-image: url(common/img/vertical-sprites-ie6.png); - background-position: left -1974px; + background-position: left -2102px; } .v-ie6 .v-window-light .v-window-wrap2 { background-image: none; diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-hover.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-hover.png Binary files differnew file mode 100644 index 0000000000..f548db838a --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-hover.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-pressed.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-pressed.png Binary files differnew file mode 100644 index 0000000000..a39a4431b3 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-pressed.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-hover.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-hover.png Binary files differnew file mode 100644 index 0000000000..31a0d1f3f5 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-hover.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-pressed.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-pressed.png Binary files differnew file mode 100644 index 0000000000..9aae58c427 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel-pressed.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel.png Binary files differnew file mode 100644 index 0000000000..e0cd398707 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn-sel.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn.png b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn.png Binary files differnew file mode 100644 index 0000000000..9407f7b82c --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/img/close-btn.png diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-bar-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-bar-style.css new file mode 100644 index 0000000000..ec985ad993 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-bar-style.css @@ -0,0 +1,108 @@ +/** + * Tabsheet bar style --------------- + */ +.v-tabsheet-bar .v-tabsheet-tabitemcell, +.v-tabsheet-bar .v-tabsheet-spacertd { + height: 20px; +} +.v-tabsheet-bar .v-tabsheet-spacertd { + background: transparent; +} +.v-tabsheet-bar .v-tabsheet-tabitemcell { + background-image: url(img/bar/tab-left.png); /** sprite-ref: verticals */ +} +.v-tabsheet-bar .v-tabsheet-tabitemcell-first { + padding-left: 6px; + background-image: url(img/bar/tab-first-left.png); /** sprite-ref: verticals */ +} +.v-tabsheet-bar .v-tabsheet-tabitem, +.v-tabsheet-bar .v-tabsheet-spacertd div { + height: 20px; + background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + font-size: 11px; + margin: 0; +} +.v-tabsheet-bar .v-tabsheet-tabitem .v-caption { + height: 18px; + 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-caption-closable, +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-caption-closable { + padding-right: 8px; + padding-left: 14px; +} +.v-tabsheet-bar .v-tabsheet-caption-close, +.v-tabsheet-bar .v-tabsheet-caption-close:hover, +.v-tabsheet-bar .v-tabsheet-caption-close:active { + text-indent: 0; + background: transparent; + margin-left: 3px; + margin-right: -3px; + padding: 0; + color: #3c3c3c; + width: 14px; + height: 14px; + line-height: 12px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; +} +.v-tabsheet-bar .v-tabsheet-caption-close { + margin-top: 0; +} +.v-ff .v-tabsheet-bar .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-bar .v-tabsheet-caption-close { + margin-top: -15px; +} +.v-tabsheet-bar .v-tabsheet-caption-close:hover { + background: #bfbfbf; + -webkit-box-shadow: 0 1px 0 #fff; +} +.v-tabsheet-bar .v-tabsheet-caption-close:active { + background: #a9a9a9; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close { + color: #404142; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close:hover { + background: #5e666e; + color: #fff; + text-shadow: 0 -1px 0 #222; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-tabsheet-caption-close:active { + background: #404142; +} + +.v-tabsheet-bar .v-tabsheet-tabitemcell-selected { + background-image: url(img/bar/tab-left-sel.png); /** sprite-ref: verticals */ +} +.v-tabsheet-bar .v-tabsheet-tabitemcell-selected-first { + background-image: url(img/bar/tab-first-left-sel.png); /** sprite-ref: verticals */ +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected { + background-image: url(img/bar/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + color: #232930; +} +.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-caption { + background-image: url(img/bar/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ +} +.v-tabsheet-bar .v-tabsheet-scroller { + margin-top: -20px; + height: 19px; + border-right: none; + background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ +} +.v-tabsheet-bar .v-tabsheet-scroller button { + margin-top: 1px; +} +.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) */ diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.css new file mode 100644 index 0000000000..d80f292055 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.css @@ -0,0 +1,135 @@ +/** + * Tabsheet "minimal" style -------------- + */ +.v-tabsheet-minimal .v-tabsheet-spacertd div { + border-bottom: 1px solid #bfbfbf; + height: auto; + background: transparent; +} +.v-tabsheet-minimal .v-tabsheet-tabitemcell, +.v-tabsheet-minimal .v-tabsheet-spacertd { + height: auto; + background: transparent; + padding-left: 0; +} +.v-tabsheet-minimal .v-tabsheet-tabitem { + border: none; + border-bottom: 1px solid #bfbfbf; + color: #4d748f; + padding: 0; + height: auto; + background: transparent; + text-shadow: none; +} +.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption { + padding: 5px 16px; + height: auto; + background: transparent; +} +.v-tabsheet-minimal .v-tabsheet-tabitemcell-selected { + background: transparent; +} +.v-tabsheet-minimal .v-tabsheet-tabitem-selected { + background: transparent; + border: 1px solid #bfbfbf; + border-bottom: none; + color: #222; +} +.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption { + background: transparent; + padding: 4px 15px 6px 15px; +} +.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption-closable, +.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption-closable { + padding-right: 6px; +} +.v-tabsheet-content-minimal { + border: none; +} +.v-tabsheet-content-minimal .v-tabsheet-tabsheetpanel { + background: transparent; +} +.v-tabsheet-deco-minimal { + height: 0; + border: none; +} +.v-tabsheet-minimal .v-tabsheet-scroller { + margin-top: -20px; + height: 17px; + padding: 0; + border: none; + background: transparent; +} +.v-tabsheet-minimal .v-tabsheet-scroller button { + margin-top: 0; +} +.v-tabsheet-minimal .v-tabsheet-caption-close, +.v-tabsheet-minimal .v-tabsheet-caption-close:hover, +.v-tabsheet-minimal .v-tabsheet-caption-close:active { + text-indent: 0; + background: transparent; + margin-left: 3px; + margin-right: -3px; + padding: 0; + color: #999; + width: 15px; + height: 15px; + line-height: 14px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; +} +.v-tabsheet-minimal .v-tabsheet-caption-close { + margin-top: 1px; +} +.v-ff .v-tabsheet-minimal .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-minimal .v-tabsheet-caption-close { + margin-top: -15px; +} +.v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #fff; + background: #aaa; +} +.v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #777; +} +/* 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; +} +.blue .v-tabsheet-minimal .v-tabsheet-caption-close { + color: #7c8a91; +} +.blue .v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #BCD3DE; + background: #778d98; +} +.blue .v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #4f6874; +} +/* 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; +} +.black .v-tabsheet-minimal .v-tabsheet-caption-close { + color: #72787c; +} +.black .v-tabsheet-minimal .v-tabsheet-caption-close:hover { + color: #1d2021; + background: #4d5154; +} +.black .v-tabsheet-minimal .v-tabsheet-caption-close:active { + background: #626669; +}
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.css new file mode 100644 index 0000000000..607b25b794 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.css @@ -0,0 +1,160 @@ +/* Default Tabsheet styles */ + +.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-spacertd div { + border: none; + 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 { + 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-caption-closable { + padding-right: 0; + padding-left: 17px; +} +.v-tabsheet-tabitem .v-captiontext { + height: 16px; + line-height: 16px; +} +.v-tabsheet-caption-close { + float: right; + width: 19px; + height: 18px; + margin: -1px -1px 0; + padding-left: 2px; + background: transparent; + background-image: url(img/close-btn.png); /** sprite-ref: verticals */ + cursor: default; + text-indent: -999px; + overflow: hidden; +} +.v-ff .v-tabsheet-caption-close, +.v-ie7 .v-tabsheet-caption-close { + margin-top: -17px; +} +.v-ie6 .v-tabsheet-caption-close { + float: none; +} +.v-tabsheet-caption-close:hover { + background-image: url(img/close-btn-hover.png); /** sprite-ref: verticals */ +} +.v-tabsheet-caption-close:active { + background-image: url(img/close-btn-pressed.png); /** sprite-ref: verticals */ +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close { + background-image: url(img/close-btn-sel.png); /** sprite-ref: verticals */ +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close:hover { + background-image: url(img/close-btn-sel-hover.png); /** sprite-ref: verticals */ +} +.v-tabsheet-tabitem-selected .v-tabsheet-caption-close:active { + background-image: url(img/close-btn-sel-pressed.png); /** sprite-ref: verticals */ +} +.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 { + background-image: url(img/framed/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + color: #232930; +} +.v-tabsheet-tabitem-selected .v-caption { + background-image: url(img/framed/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ +} +.v-tabsheet-spacertd div { + margin-right: 4px; +} +.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-content { + border: 1px solid #dcdcdc; + border-bottom: none; + border-top: none; + color: #222; + text-shadow: none; +} +.blue .v-tabsheet-content { + border-color: #a8bcc5; +} +.v-tabsheet-tabsheetpanel { + background: #fff; +} +.v-sa .v-tabsheet-content, +.v-ff3 .v-tabsheet-content { + border-color: rgba(0,0,0,.1); +} +.v-tabsheet-deco { + height: 1px; + border-top: 1px solid #bebebe; + background: #e2e2e2; + overflow: hidden; +} +.blue .v-tabsheet-deco { + border-color: #92a3ac; + background: #adc2cd; +} +.v-sa .v-tabsheet-deco, +.v-ff3 .v-tabsheet-deco { + border-top-color: rgba(0,0,0,.1); + background: rgba(0,0,0,.08); +} + + +/* Icons & error indicators */ + +.v-tabsheet-tabs .v-icon, +.v-tabsheet-tabs .v-captiontext, +.v-tabsheet-tabs .v-errorindicator { + display: inline; + float: none; +} +.v-sa .v-tabsheet-tabs .v-captiontext { + display: inline-block; +} +.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; +}
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.css new file mode 100644 index 0000000000..217676558e --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.css @@ -0,0 +1,52 @@ +/* Tabsheet scroller styles */ + +.v-tabsheet-scroller { + height: 31px; + margin-top: -31px; + padding: 0 3px 0 4px; + border-right: 1px solid #c2c2c2; + border-left: 1px solid #cfcfcf; + position: relative; + float: right; + background: transparent url(img/framed/tab-bg.png) repeat-x left -1px; + width: 36px; +} +.v-tabsheet-scroller button { + margin-top: 7px; +} +.v-tabsheet-scrollerPrev, +.v-tabsheet-scrollerNext, +.v-tabsheet-scrollerPrev-disabled, +.v-tabsheet-scrollerNext-disabled { + border: none; + background: transparent; + background-image: url(img/tab-prev.png); /** sprite-ref: verticals */ + width: 18px; + height: 17px; + overflow: hidden; + cursor: default; +} +.v-tabsheet-scroller button::-moz-focus-inner { + border: none; +} +.v-tabsheet-scrollerNext { + background-image: url(img/tab-next.png); /** sprite-ref: verticals */ +} +.v-tabsheet-scrollerPrev:active { + background-image: url(img/tab-prev-pressed.png); /** sprite-ref: verticals */ +} +.v-tabsheet-scrollerNext:active { + background-image: url(img/tab-next-pressed.png); /** sprite-ref: verticals */ +} +.v-tabsheet-scrollerPrev-disabled, +.v-tabsheet-scrollerPrev-disabled:active { + background-image: url(img/tab-prev-disabled.png); /** sprite-ref: verticals */ + opacity: 1; + filter: none; +} +.v-tabsheet-scrollerNext-disabled, +.v-tabsheet-scrollerNext-disabled:active { + background-image: url(img/tab-next-disabled.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */ + opacity: 1; + filter: none; +}
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css index 289660eb3b..fddef9a287 100644 --- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css @@ -1,325 +1,5 @@ -.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-spacertd div { - border: none; - 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 { - 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 { - background-image: url(img/framed/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ - color: #232930; -} -.v-tabsheet-tabitem-selected .v-caption { - background-image: url(img/framed/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ -} -.v-tabsheet-spacertd div { - margin-right: 4px; -} -.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-content { - border: 1px solid #dcdcdc; - border-bottom: none; - border-top: none; - color: #222; - text-shadow: none; -} -.blue .v-tabsheet-content { - border-color: #a8bcc5; -} -.v-tabsheet-tabsheetpanel { - background: #fff; -} -.v-sa .v-tabsheet-content, -.v-ff3 .v-tabsheet-content { - border-color: rgba(0,0,0,.1); -} -.v-tabsheet-deco { - height: 1px; - border-top: 1px solid #bebebe; - background: #e2e2e2; - overflow: hidden; -} -.blue .v-tabsheet-deco { - border-color: #92a3ac; - background: #adc2cd; -} -.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 { - 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, -.v-tabsheet-scrollerPrev-disabled, -.v-tabsheet-scrollerNext-disabled { - border: none; - background: transparent; - background-image: url(img/tab-prev.png); /** sprite-ref: verticals */ - width: 18px; - height: 17px; - overflow: hidden; - cursor: default; -} -.v-tabsheet-scroller button::-moz-focus-inner { - border: none; -} -.v-tabsheet-scrollerNext { - background-image: url(img/tab-next.png); /** sprite-ref: verticals */ -} -.v-tabsheet-scrollerPrev:active { - background-image: url(img/tab-prev-pressed.png); /** sprite-ref: verticals */ -} -.v-tabsheet-scrollerNext:active { - background-image: url(img/tab-next-pressed.png); /** sprite-ref: verticals */ -} -.v-tabsheet-scrollerPrev-disabled, -.v-tabsheet-scrollerPrev-disabled:active { - background-image: url(img/tab-prev-disabled.png); /** sprite-ref: verticals */ - opacity: 1; - filter: none; -} -.v-tabsheet-scrollerNext-disabled, -.v-tabsheet-scrollerNext-disabled:active { - background-image: url(img/tab-next-disabled.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */ - opacity: 1; - filter: none; -} -.v-tabsheet-tabs .v-icon, -.v-tabsheet-tabs .v-captiontext, -.v-tabsheet-tabs .v-errorindicator { - display: inline; - float: none; -} -.v-sa .v-tabsheet-tabs .v-captiontext { - display: inline-block; -} -.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; -} - - - - - - -/** - * Minimal style -------------- - */ -.v-tabsheet-minimal .v-tabsheet-spacertd div { - border-bottom: 1px solid #bfbfbf; - height: auto; - background: transparent; -} -.v-tabsheet-minimal .v-tabsheet-tabitemcell, -.v-tabsheet-minimal .v-tabsheet-spacertd { - height: auto; - background: transparent; - padding-left: 0; -} -.v-tabsheet-minimal .v-tabsheet-tabitem { - border: none; - border-bottom: 1px solid #bfbfbf; - color: #4d748f; - padding: 0; - height: auto; - background: transparent; - text-shadow: none; -} -.v-tabsheet-minimal .v-tabsheet-tabitem .v-caption { - padding: 5px 16px; - height: auto; - background: transparent; -} -.v-tabsheet-minimal .v-tabsheet-tabitemcell-selected { - background: transparent; -} -.v-tabsheet-minimal .v-tabsheet-tabitem-selected { - background: transparent; - border: 1px solid #bfbfbf; - border-bottom: none; - color: #222; -} -.v-tabsheet-minimal .v-tabsheet-tabitem-selected .v-caption { - background: transparent; - padding: 4px 15px 6px 15px; -} -.v-tabsheet-content-minimal { - border: none; -} -.v-tabsheet-content-minimal .v-tabsheet-tabsheetpanel { - background: transparent; -} -.v-tabsheet-deco-minimal { - height: 0; - border: none; -} -.v-tabsheet-minimal .v-tabsheet-scroller { - margin-top: -20px; - height: 17px; - padding-right: 0; - border-right: none; - position: static; - float: none; -} -.v-tabsheet-minimal .v-tabsheet-scroller button { - margin-top: 0; -} -/* 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; -} -/* 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 --------------- - */ -.v-tabsheet-bar .v-tabsheet-tabitemcell, -.v-tabsheet-bar .v-tabsheet-spacertd { - height: 20px; -} -.v-tabsheet-bar .v-tabsheet-spacertd { - background: transparent; -} -.v-tabsheet-bar .v-tabsheet-tabitemcell { - background-image: url(img/bar/tab-left.png); /** sprite-ref: verticals */ -} -.v-tabsheet-bar .v-tabsheet-tabitemcell-first { - padding-left: 6px; - background-image: url(img/bar/tab-first-left.png); /** sprite-ref: verticals */ -} -.v-tabsheet-bar .v-tabsheet-tabitem, -.v-tabsheet-bar .v-tabsheet-spacertd div { - height: 20px; - background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ - font-size: 11px; - margin: 0; -} -.v-tabsheet-bar .v-tabsheet-tabitem .v-caption { - height: 18px; - background-image: url(img/bar/tab-right.png); /** sprite-ref: verticals; sprite-alignment: right */ - padding: 2px 12px 0 10px; -} -.v-tabsheet-bar .v-tabsheet-tabitemcell-selected { - background-image: url(img/bar/tab-left-sel.png); /** sprite-ref: verticals */ -} -.v-tabsheet-bar .v-tabsheet-tabitemcell-selected-first { - background-image: url(img/bar/tab-first-left-sel.png); /** sprite-ref: verticals */ -} -.v-tabsheet-bar .v-tabsheet-tabitem-selected { - background-image: url(img/bar/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ - color: #232930; -} -.v-tabsheet-bar .v-tabsheet-tabitem-selected .v-caption { - background-image: url(img/bar/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ -} -.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) */
\ No newline at end of file +/* These styles get catenated together on build */ +@import "tabsheet-normal-style.css"; +@import "tabsheet-scroller.css"; +@import "tabsheet-minimal-style.css"; +@import "tabsheet-bar-style.css";
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/runo/styles.css b/WebContent/VAADIN/themes/runo/styles.css index e2a5dd418f..8a35c1e439 100644 --- a/WebContent/VAADIN/themes/runo/styles.css +++ b/WebContent/VAADIN/themes/runo/styles.css @@ -1387,6 +1387,9 @@ div.v-progressindicator-indeterminate-disabled { .v-ff2 .v-tabsheet-scroller { position: relative; } +.v-disabled .v-tabsheet-scroller { + display: none; +} .v-tabsheet-scrollerPrev, .v-tabsheet-scrollerNext, .v-tabsheet-scrollerPrev-disabled, @@ -1412,12 +1415,26 @@ div.v-progressindicator-indeterminate-disabled { zoom: 1; width: 16px; height: 16px; - background: url(../base/common/img/close.png) no-repeat; + text-align: center; + font-weight: bold; cursor: pointer; vertical-align: middle; + user-select: none; + -khtml-user-select: none; + -ms-user-select: none; + -moz-user-select: none; + -webkit-user-select: none; } -.v-disabled .v-tabsheet-caption-close { +.v-tabsheet .v-disabled .v-tabsheet-caption-close { cursor: default; + visibility: hidden; +} +.v-tabsheet-tabitemcell:hover .v-tabsheet-caption-close, +.v-ie6 .v-tabsheet-caption-close { + visibility: visible; +} +.v-ie6 .v-tabsheet-caption-close { + float: right; } .v-tabsheet-tabitem { border: 1px solid #aaa; @@ -1642,9 +1659,9 @@ div.v-tree-node-leaf { position: absolute; top: 0; right: 0; - width: 16px; - height: 16px; - background: url(../base/common/img/close.png) no-repeat; + width: 1em; + height: 1em; + background: red; cursor: pointer; overflow: hidden; } @@ -3019,6 +3036,23 @@ div.v-tree-node-leaf { padding: 16px 16px 14px 7px; overflow: visible; } +.v-tabsheet-caption-close { + margin-left: 3px; + margin-right: -3px; + width: 16px; + height: 16px; + -webkit-border-radius: 8px; + -moz-border-radius: 8px; + color: #777f85; + line-height: 13px; +} +.v-tabsheet-caption-close:hover { + background: #dce0e0; +} +.v-tabsheet-caption-close:active { + background: #b6bbbc; + color: #fff; +} .v-tabsheet-content { border: 1px solid #babfc0; background-color: #fff; diff --git a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css index fa99f6ae43..3b738107b2 100644 --- a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css +++ b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css @@ -83,6 +83,23 @@ padding: 16px 16px 14px 7px; overflow: visible; } +.v-tabsheet-caption-close { + margin-left: 3px; + margin-right: -3px; + width: 16px; + height: 16px; + -webkit-border-radius: 8px; + -moz-border-radius: 8px; + color: #777f85; + line-height: 13px; +} +.v-tabsheet-caption-close:hover { + background: #dce0e0; +} +.v-tabsheet-caption-close:active { + background: #b6bbbc; + color: #fff; +} .v-tabsheet-content { border: 1px solid #babfc0; background-color: #fff; diff --git a/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-bottom.png b/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-bottom.png Binary files differnew file mode 100644 index 0000000000..976e6fad5e --- /dev/null +++ b/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-bottom.png diff --git a/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-top.png b/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-top.png Binary files differnew file mode 100644 index 0000000000..87a687f10f --- /dev/null +++ b/WebContent/VAADIN/themes/sampler/sampler/home/btn-shadow-top.png diff --git a/WebContent/VAADIN/themes/sampler/sampler/home/label-grad.png b/WebContent/VAADIN/themes/sampler/sampler/home/label-grad.png Binary files differnew file mode 100644 index 0000000000..d44d24bf2c --- /dev/null +++ b/WebContent/VAADIN/themes/sampler/sampler/home/label-grad.png |
