Korbs/electron-tabs
1
Fork 0
Code Issues Pull requests Activity

Support custom styles

Browse source
This commit is contained in:
Thomas Brouard 2022-05-24 10:49:24 +02:00
parent d0df158fcf
commit 6a3cc4f7c6
6 changed files with 35 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
demo/electron-tabs.html
View file

@ -6,7 +6,14 @@
</head> </head>
<body style="margin:0"> <body style="margin:0">
<tab-group new-tab-button="true" sortable="true"></tab-group> <tab-group new-tab-button="true" sortable="true">
<style>
/* Add custom style */
.etabs-tab:hover .etabs-tab-title {
text-decoration: underline;
}
</style>
</tab-group>
<script src="../dist/electron-tabs.sortable.js"></script> <script src="../dist/electron-tabs.sortable.js"></script>
<script> <script>

8
dist/electron-tabs.js vendored
View file

@ -23,6 +23,7 @@ class $4fa36e821943b400$var$TabGroup extends HTMLElement {
const shadow = this.attachShadow({ const shadow = this.attachShadow({
mode: "open" mode: "open"
}); });
this.shadow = shadow;
const wrapper = document.createElement("div"); const wrapper = document.createElement("div");
wrapper.setAttribute("class", "etabs"); wrapper.setAttribute("class", "etabs");
const tabgroup = document.createElement("div"); const tabgroup = document.createElement("div");
@ -63,6 +64,13 @@ class $4fa36e821943b400$var$TabGroup extends HTMLElement {
} }
this.emit("ready", this); this.emit("ready", this);
} }
connectedCallback() {
const style = this.querySelector("style");
if (style) {
const clone = style.cloneNode(this);
this.shadow.appendChild(clone);
}
}
setDefaultTab(tab) { setDefaultTab(tab) {
this.options.defaultTab = tab; this.options.defaultTab = tab;
} }

2
dist/electron-tabs.js.map vendored
View file

File diff suppressed because one or more lines are too long

8
dist/electron-tabs.sortable.js vendored
View file

@ -3093,6 +3093,7 @@ class TabGroup extends HTMLElement {
const shadow = this.attachShadow({ const shadow = this.attachShadow({
mode: "open" mode: "open"
}); });
this.shadow = shadow;
const wrapper = document.createElement("div"); const wrapper = document.createElement("div");
wrapper.setAttribute("class", "etabs"); wrapper.setAttribute("class", "etabs");
const tabgroup = document.createElement("div"); const tabgroup = document.createElement("div");
@ -3133,6 +3134,13 @@ class TabGroup extends HTMLElement {
} }
this.emit("ready", this); this.emit("ready", this);
} }
connectedCallback() {
const style = this.querySelector("style");
if (style) {
const clone = style.cloneNode(this);
this.shadow.appendChild(clone);
}
}
setDefaultTab(tab) { setDefaultTab(tab) {
this.options.defaultTab = tab; this.options.defaultTab = tab;
} }

2
dist/electron-tabs.sortable.js.map vendored
View file

File diff suppressed because one or more lines are too long

9
src/index.js
View file

@ -22,6 +22,7 @@ class TabGroup extends HTMLElement {
// Create custom element // Create custom element
const shadow = this.attachShadow({mode: "open"}); const shadow = this.attachShadow({mode: "open"});
this.shadow = shadow;
const wrapper = document.createElement("div"); const wrapper = document.createElement("div");
wrapper.setAttribute("class", "etabs"); wrapper.setAttribute("class", "etabs");
@ -77,6 +78,14 @@ class TabGroup extends HTMLElement {
this.emit("ready", this); this.emit("ready", this);
} }
connectedCallback () {
const style = this.querySelector("style");
if (style) {
const clone = style.cloneNode(this);
this.shadow.appendChild(clone);
}
}
setDefaultTab (tab) { setDefaultTab (tab) {
this.options.defaultTab = tab; this.options.defaultTab = tab;
} }