@web-atoms/core-docs
Version:
123 lines • 4.93 kB
JavaScript
(function (factory) {
if (typeof module === "object" && typeof module.exports === "object") {
var v = factory(require, exports);
if (v !== undefined) module.exports = v;
}
else if (typeof define === "function" && define.amd) {
define(["require", "exports", "@web-atoms/core/src/web/images/close-button-hover.svg", "@web-atoms/core/src/web/images/close-button.svg", "./AtomStyle"], factory);
}
})(function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.AtomTabbedPageStyle = void 0;
const close_button_hover_svg_1 = require("@web-atoms/core/src/web/images/close-button-hover.svg");
const close_button_svg_1 = require("@web-atoms/core/src/web/images/close-button.svg");
const AtomStyle_1 = require("./AtomStyle");
class AtomTabbedPageStyle extends AtomStyle_1.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: close_button_hover_svg_1.default,
subclasses: {
":hover": {
backgroundImage: close_button_svg_1.default
}
}
};
}
}
exports.AtomTabbedPageStyle = AtomTabbedPageStyle;
});
//# sourceMappingURL=AtomTabbedPageStyle.js.map