Modified Theme button to use background images.

src/assets/documents/ZSort.Test.txt

@@ -1 +0,0 @@
-content!

src/assets/pages/resources-landing-page.html

@@ -34,6 +34,7 @@
             <a class="navbar-brand text-navbartext" href="#">
                 <img src="../images/jdsfaulkner-logo-lt-theme.png" height="50" class="d-inline-block align-middle" alt="JDSfaulkner logo">
             </a>
+            <div id="theme-toggle" class="theme-button mb-2"></div>
             <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader"
                     aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
                 <span class="navbar-toggler-icon"></span>
@@ -45,7 +46,7 @@
 
 <main>
     <div class="album py-5 bg-secondary">
-        <button id="theme-toggle" class="btn btn-light mb-2">Push to change theme</button>
+
         <div class="container">
             <input class="form-control form-control-dark w-100 bg-info border border-boxborder text-searchfont" placeholder="Search"
                    aria-label="Search">

src/assets/pages/styles/theme-dark.scss

@@ -18,4 +18,14 @@ $theme-colors: (
         "paragraphtextcolorhover":#202022,
 );
 
+.theme-button{
+  width:40px;
+  height: 30px;
+  background-size: contain;
+  background-color: transparent;
+  background-image: url("../../images/theme-toggle-dark.png");
+  cursor: pointer;
+}
+
+
 @import "theme-base";

src/assets/pages/styles/theme-light.scss

@@ -18,4 +18,13 @@ $theme-colors: (
         "paragraphtextcolorhover":#ffffff,
 );
 
+.theme-button{
+  width:40px;
+  height: 30px;
+  background-size: contain;
+  background-color: transparent;
+  background-image: url("../../images/theme-toggle-light.png");
+  cursor: pointer;
+}
+
 @import "theme-base";

src/ts_source/themes.ts

@@ -13,15 +13,15 @@ export module Themes {
         applyTheme(initTheme);
         let initToggle = $('#theme-toggle');
         let initThemeEnum = getThemeFromValue(initTheme);
-        initToggle.addClass(getButtonClassFromAppTheme(initThemeEnum));
+        // initToggle.addClass(getButtonClassFromAppTheme(initThemeEnum));
         initToggle.on("click", () => {
             let conf = Configurator.loadUserConfig(ConfigPaths.UserConfigName);
             let toggle = $("#theme-toggle");
             let themeValue = conf['theme'];
             let currTheme = getThemeFromValue(themeValue);
             let opposite = getOppositeTheme(currTheme);
-            toggle.removeClass(getButtonClassFromAppTheme(currTheme));
+            // toggle.removeClass(getButtonClassFromAppTheme(currTheme));
-            toggle.addClass(getButtonClassFromAppTheme(opposite));
+            // toggle.addClass(getButtonClassFromAppTheme(opposite));
             applyTheme(opposite);
             conf['theme'] = opposite;
             Configurator.saveUserConfig(ConfigPaths.UserConfigName, conf);

src/ts_source/viewFactory.ts

@@ -47,7 +47,7 @@ export function buildWebCardsFromConfig(configName: string) {
         let key = keys[i];
         let contentList = elementConfig[key];
         let element = $(`#${key}`);
-        console.log(element);
+
         for (let j = 0, m = contentList.length; j<m;j++){
             let content = contentList[j];
             buildWebCard(element, content, true, $);
@@ -65,7 +65,6 @@ export function buildWebCard(elem: JQuery<HTMLElement>, obj, append: boolean = f
     );
 
     loadTemplateSingle("web-card.mustache", model, (content: string, id: string) => {
-        console.log(elem);
         if (append) {
             elem.append(content);
         } else {
@@ -100,11 +99,9 @@ function getImagePathFromDocumentName(name: string): string {
 
 function launchDocument(filename: string) {
     let fullPath = FileUtils.getPathToDocument(filename);
-    console.log(`Attempting to open file: ${fullPath}`);
     shell.openItem(fullPath);
 }
 
 function launchWebsite(url: string) {
-    console.log("Attempting to launch " + url)
     shell.openItem(url);
 }