| @mixin base-tabsheet($primaryStyleName : v-tabsheet) { |
| |
| .#{$primaryStyleName}, |
| .#{$primaryStyleName}-content, |
| .#{$primaryStyleName}-deco { |
| outline: none; /* Prevent selection outline which might break layouts or cause scrollbars */ |
| text-align: left; /* Force default alignment */ |
| } |
| .#{$primaryStyleName}-tabs { |
| empty-cells: hide; |
| border-collapse: collapse; |
| margin: 0; |
| padding: 0; |
| border: 0; |
| width: 100%; |
| overflow:hidden; |
| } |
| .#{$primaryStyleName}-tabitemcell:focus { |
| outline: none; |
| } |
| .#{$primaryStyleName}-tabitemcell, |
| .#{$primaryStyleName}-spacertd { |
| margin: 0; |
| padding: 0; |
| vertical-align: bottom; |
| } |
| .#{$primaryStyleName}-spacertd { |
| width: 100%; |
| } |
| .#{$primaryStyleName}-spacertd div { |
| border-left: 1px solid #aaa; |
| border-bottom: 1px solid #aaa; |
| height: 1em; |
| padding: 0.2em 0; |
| } |
| .#{$primaryStyleName}-hidetabs > .#{$primaryStyleName}-tabcontainer { |
| display: none; |
| } |
| .#{$primaryStyleName}-scroller { |
| white-space: nowrap; |
| text-align: right; |
| margin-top: -1em; |
| } |
| .v-disabled .#{$primaryStyleName}-scroller { |
| display: none; |
| } |
| .#{$primaryStyleName}-scrollerPrev, |
| .#{$primaryStyleName}-scrollerNext, |
| .#{$primaryStyleName}-scrollerPrev-disabled, |
| .#{$primaryStyleName}-scrollerNext-disabled { |
| border: 1px solid #aaa; |
| background: #fff; |
| width: 12px; |
| height: 1em; |
| cursor: pointer; |
| } |
| .#{$primaryStyleName}-scrollerPrev-disabled, |
| .#{$primaryStyleName}-scrollerNext-disabled { |
| opacity: 0.5; |
| cursor: default; |
| } |
| .#{$primaryStyleName}-tabs .v-caption, |
| .#{$primaryStyleName}-tabs .v-caption span { |
| white-space: nowrap; |
| } |
| .#{$primaryStyleName}-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; |
| } |
| .#{$primaryStyleName} .v-disabled .#{$primaryStyleName}-caption-close { |
| cursor: default; |
| visibility: hidden; |
| } |
| .#{$primaryStyleName}-tabitem:hover .#{$primaryStyleName}-caption-close { |
| visibility: visible; |
| } |
| .#{$primaryStyleName}-tabitem { |
| border: 1px solid #aaa; |
| border-right: none; |
| cursor: pointer; |
| padding: 0.2em 0.5em; |
| } |
| .#{$primaryStyleName}-tabitem .v-caption { |
| cursor: inherit; |
| } |
| .#{$primaryStyleName}.v-disabled .#{$primaryStyleName}-tabitem, |
| .#{$primaryStyleName}-tabitemcell-disabled .#{$primaryStyleName}-tabitem { |
| cursor: default; |
| } |
| .#{$primaryStyleName}-tabitem-selected { |
| cursor: default; |
| border-bottom-color: #fff; |
| } |
| .#{$primaryStyleName}-tabitem-selected .v-caption { |
| cursor: default; |
| } |
| .#{$primaryStyleName}-tabitem-focus .v-captiontext { |
| text-decoration: underline; |
| } |
| .#{$primaryStyleName}-tabitem-selected.#{$primaryStyleName}-tabitem-focus .v-captiontext { |
| text-decoration: inherit; |
| } |
| .#{$primaryStyleName}-content { |
| border: 1px solid #aaa; |
| /* Vertical borders are not supported, use v-tabsheet-tabcontainer and v-tabsheet-deco to present these borders */ |
| border-top: none; |
| border-bottom: none; |
| position: relative; |
| } |
| .#{$primaryStyleName}-deco { |
| height: 1px; |
| background: #aaa; |
| overflow: hidden; |
| } |
| .#{$primaryStyleName}-hidetabs .#{$primaryStyleName}-content { |
| border: none; |
| } |
| .#{$primaryStyleName}-hidetabs .#{$primaryStyleName}-deco { |
| height: 0; |
| } |
| |
| } |