@mixin reindeer-tabsheet-small-style($name : v-tabsheet) { /** * Tabsheet bar style --------------- */ .#{$name}-tabs-bar .#{$name}-tabitemcell, .#{$name}-tabs-bar .#{$name}-spacertd { height: 20px; } .#{$name}-tabs-bar .#{$name}-spacertd { background: transparent; } .#{$name}-tabs-bar .#{$name}-tabitemcell { background-image: url(img/bar/tab-left.png); /** sprite-ref: verticals */ } .#{$name}-tabs-bar .#{$name}-tabitemcell-first { padding-left: 6px; background-image: url(img/bar/tab-first-left.png); /** sprite-ref: verticals */ } .#{$name}-tabs-bar .#{$name}-tabitem, .#{$name}-tabs-bar .#{$name}-spacertd div { height: 20px; background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ font-size: 11px; margin: 0; } .#{$name}-tabs-bar .#{$name}-tabitem .v-caption { height: 18px; background-image: url(img/bar/tab-right.png); /** sprite-ref: verticals; sprite-alignment: right */ padding: 2px 12px 0 10px; } .#{$name}-tabs-bar .#{$name}-tabitem .v-caption-closable, .#{$name}-tabs-bar .#{$name}-tabitem-selected .v-caption-closable { padding-right: 8px; padding-left: 14px; } .#{$name}-tabs-bar .#{$name}-caption-close, .#{$name}-tabs-bar .#{$name}-caption-close:hover, .#{$name}-tabs-bar .#{$name}-caption-close:active { text-indent: 0; background: transparent; margin-left: 3px; margin-right: -3px; padding: 1px 0 0 1px; color: #3c3c3c; width: 13px; height: 13px; line-height: 12px; -webkit-border-radius: 7px; -moz-border-radius: 7px; } .#{$name}-tabs-bar .#{$name}-caption-close { margin-top: 1px; } .v-ff .#{$name}-tabs-bar .#{$name}-caption-close { margin-top: -14px; } .#{$name}-tabs-bar .#{$name}-caption-close:hover { background: #bfbfbf; -webkit-box-shadow: 0 1px 0 #fff; } .#{$name}-tabs-bar .#{$name}-caption-close:active { background: #a9a9a9; } .#{$name}-tabs-bar .#{$name}-tabitem-selected .#{$name}-caption-close { color: #404142; } .#{$name}-tabs-bar .#{$name}-tabitem-selected .#{$name}-caption-close:hover { background: #5e666e; color: #fff; text-shadow: 0 -1px 0 #222; } .#{$name}-tabs-bar .#{$name}-tabitem-selected .#{$name}-caption-close:active { background: #404142; } .#{$name}-tabs-bar .#{$name}-tabitemcell-selected { background-image: url(img/bar/tab-left-sel.png); /** sprite-ref: verticals */ } .#{$name}-tabs-bar .#{$name}-tabitemcell-selected-first { background-image: url(img/bar/tab-first-left-sel.png); /** sprite-ref: verticals */ } .#{$name}-tabs-bar .#{$name}-tabitem-selected { background-image: url(img/bar/tab-bg-sel.png); /** sprite-ref: verticals; sprite-alignment: repeat */ color: #232930; } .#{$name}-tabs-bar .#{$name}-tabitem-selected .v-caption { background-image: url(img/bar/tab-right-sel.png); /** sprite-ref: verticals; sprite-alignment: right */ } .#{$name}-tabcontainer-bar .#{$name}-scroller { margin-top: -20px; height: 19px; border-right: none; background-image: url(img/bar/tab-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ } .#{$name}-tabcontainer-bar .#{$name}-scroller button { margin-top: 1px; } .#{$name}-content-bar, .white .#{$name}-content-bar { border: none; } .#{$name}-content-bar .#{$name}-tabsheetpanel { background: transparent; } .#{$name}-deco-bar, .white .#{$name}-deco-bar { height: 0; border: none; } /* Content area font color specified with minimal style (reduces additional selectors) */ }