1.0.70

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-domtools",
-  "version": "1.0.67",
+  "version": "1.0.70",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-domtools",
-  "version": "1.0.67",
+  "version": "1.0.70",
   "private": false,
   "description": "tools to simplify complex css structures",
   "main": "dist_ts/index.js",

ts/domtools.classes.thememanager.ts

@@ -5,7 +5,7 @@ import * as plugins from './domtools.plugins';
 export class ThemeManager {
   public domtoolsRef: DomTools;
   
-  goBrightBoolean = false;
+  public goBrightBoolean = false;
 
   constructor(domtoolsRefArg: DomTools) {
     this.domtoolsRef = domtoolsRefArg;
@@ -21,15 +21,24 @@ export class ThemeManager {
     }
   }
 
-  public goBright() {
+  private async updateAllConnectedElements() {
     this.domtoolsRef.elementInstrumenter.forEachelement(async elementArg => {
-      await this.setThemeStatusForElement(elementArg, true);
+      await this.setThemeStatusForElement(elementArg, this.goBrightBoolean);
     });
   }
 
+  public goBright() {
+    this.goBrightBoolean = true;
+    this.updateAllConnectedElements();
+  }
+
   public goDark() {
-    this.domtoolsRef.elementInstrumenter.forEachelement(async elementArg => {
-      await this.setThemeStatusForElement(elementArg, false);
-    });
+    this.goBrightBoolean = false;
+    this.updateAllConnectedElements();
+  }
+
+  public toggleDarkBright() {
+    this.goBrightBoolean = !this.goBrightBoolean;
+    this.updateAllConnectedElements();
   }
 }

ts/domtools.elementbasic.ts

@@ -10,6 +10,7 @@ import { html, LitElement } from 'lit-element';
 export const styles = html`
   <style>
     * {
+      transition: background 0.2s, color 0.1s;
       font-family: 'Roboto', sans-serif;
       box-sizing: border-box;
     }