@web-atoms/core
Version:
128 lines (127 loc) • 4.28 kB
JavaScript
System.register(["@web-atoms/core/src/web/images/close-button-hover.svg", "@web-atoms/core/src/web/images/close-button.svg", "./AtomStyle"], function (_export, _context) {
"use strict";
var CloseButtonDataUrl, CloseButtonHoverDataUrl, AtomStyle, AtomTabbedPageStyle;
_export("AtomTabbedPageStyle", void 0);
return {
setters: [function (_webAtomsCoreSrcWebImagesCloseButtonHoverSvg) {
CloseButtonDataUrl = _webAtomsCoreSrcWebImagesCloseButtonHoverSvg.default;
}, function (_webAtomsCoreSrcWebImagesCloseButtonSvg) {
CloseButtonHoverDataUrl = _webAtomsCoreSrcWebImagesCloseButtonSvg.default;
}, function (_AtomStyle) {
AtomStyle = _AtomStyle.AtomStyle;
}],
execute: function () {
_export("AtomTabbedPageStyle", AtomTabbedPageStyle = class AtomTabbedPageStyle extends AtomStyle {
get theme() {
return this.styleSheet;
}
get root() {
return {
position: "absolute",
left: 0,
right: 0,
top: 0,
bottom: 0,
subclasses: {
" .page-host": {
position: "absolute",
left: 0,
right: 0,
top: "30px",
bottom: 0,
overflow: "auto",
subclasses: {
" > *": {
position: "absolute",
left: 0,
right: 0,
top: 0,
bottom: 0,
overflow: "auto"
}
}
},
" .tabs": {
position: "absolute",
left: 0,
top: 0,
right: 0,
overflow: "hidden",
height: "30px",
subclasses: {
" .tab-item": this.tabItem,
" .close-button": this.closeButton,
" .selected-tab-item": this.selectedTabItem
}
}
}
};
}
get tabItem() {
return {
display: "inline-block",
borderTopLeftRadius: (this.padding || this.theme.padding) + "px",
borderTopRightRadius: (this.padding || this.theme.padding) + "px",
marginLeft: "2px",
padding: 0,
borderStyle: "solid",
borderWidth: "1px",
borderColor: "lightgray",
backgroundColor: this.theme.bgColor,
minWidth: "90px",
minHeight: "30px",
cursor: "default",
position: "relative",
subclasses: {
":hover": {
backgroundColor: this.theme.hoverColor
},
"> div": {
display: "inline-block",
padding: (this.padding || this.theme.padding) + "px",
paddingRight: (this.padding || this.theme.padding) + 23 + "px",
right: "22px"
}
}
};
}
get selectedTabItem() {
return Object.assign(Object.assign({}, this.tabItem), {
borderColor: this.theme.activeColor,
backgroundColor: this.theme.selectedBgColor,
color: this.theme.selectedColor,
subclasses: {
":hover": {
backgroundColor: this.theme.selectedBgColor,
color: this.theme.hoverColor
},
"> div": {
display: "inline-block",
padding: (this.padding || this.theme.padding) + "px",
paddingRight: (this.padding || this.theme.padding) + 23 + "px",
right: "22px"
}
}
});
}
get closeButton() {
return {
position: "absolute",
right: "5px",
top: "5px",
width: "0",
height: "0",
padding: "8px",
backgroundImage: CloseButtonDataUrl,
subclasses: {
":hover": {
backgroundImage: CloseButtonHoverDataUrl
}
}
};
}
});
}
};
});
//# sourceMappingURL=AtomTabbedPageStyle.js.map