diff --git a/card-modder.js b/card-modder.js
new file mode 100644
index 0000000..60e7d03
--- /dev/null
+++ b/card-modder.js
@@ -0,0 +1,68 @@
+customElements.whenDefined('card-tools').then(() => {
+class CardModder extends window.cardTools.LitElement {
+
+ setConfig(config) {
+ if(!window.cardTools) throw new Error(`Can't find card-tools. See https://github.com/thomasloven/lovelace-card-tools`);
+ window.cardTools.checkVersion(0.2);
+
+ if(!config || !config.card) {
+ throw new Error("Card config incorrect");
+ }
+ if(Array.isArray(config.card)) {
+ throw new Error("It says 'card', not 'cardS'. Remove the dash.");
+ }
+ this._config = config;
+ this.card = window.cardTools.createCard(config.card);
+ this.templated = [];
+ this.attempts = 0;
+ }
+
+ render() {
+ return window.cardTools.litHtml`
+
${this.card}
+ `;
+ }
+
+ firstUpdated() {
+ this._cardMod();
+ }
+
+ _cardMod() {
+ if(!this._config.style) return;
+
+ let target = null;
+ target = target || this.card.querySelector("ha-card");
+ target = target || this.card.shadowRoot && this.card.shadowRoot.querySelector("ha-card");
+ target = target || this.card.firstChild && this.card.firstChild.shadowRoot && this.card.firstChild.shadowRoot.querySelector("ha-card");
+ if(!target && !this.attempts) // Try twice
+ setTimeout(() => this._cardMod(), 100);
+ this.attempts++;
+ target = target || this.card;
+
+ for(var k in this._config.style) {
+ if(window.cardTools.hasTemplate(this._config.style[k]))
+ this.templated.push(k);
+ target.style.setProperty(k, window.cardTools.parseTemplate(this._config.style[k]));
+ }
+ this.target = target;
+ }
+
+ set hass(hass) {
+ if(this.card) this.card.hass = hass;
+ if(this.templated)
+ this.templated.forEach((k) => {
+ this.target.style.setProperty(k, window.cardTools.parseTemplate(this._config.style[k], ''));
+ });
+ }
+
+ getCardSize() {
+ if(this._config && this._config.report_size)
+ return this._config.report_size;
+ if(this.card)
+ return typeof this.card.getCardSize === "function" ? this.card.getCardSize() : 1;
+ return 1;
+ }
+}
+
+customElements.define('card-modder', CardModder);
+});
diff --git a/card-tools.js b/card-tools.js
index 99debc2..cfe18c0 100644
--- a/card-tools.js
+++ b/card-tools.js
@@ -203,5 +203,6 @@ if (!window.cardTools){
};
window.cardTools = cardTools;
- cardTools.fireEvent("ll-rebuild");
+ // cardTools.fireEvent("ll-rebuild");
+ customElements.define('card-tools', class {});
}