feat(themes): added theme switching

#59

#59

src/lib/themes.js

@@ -0,0 +1,8 @@
+import {sender} from './sender';
+export function switchTheme(themeName) {
+  console.log('themeName', themeName);
+
+  global.config.set('currentTheme', themeName);
+  sender([global.slidesWindow, global.commentsWindow], 'switch-theme',
+    themeName);
+}

src/views/themes/blank/css/main-comments.css

@@ -0,0 +1 @@
+body { background: #969696; }

src/views/themes/blank/css/main.css

@@ -0,0 +1 @@
+body { background: #FFABAC; }

src/views/themes/blank/js/blank.js

@@ -0,0 +1,4 @@
+export default function () {
+  console.log('hello blank theme js');
+}
+

src/views/themes/blank/scss/main-comments.scss

@@ -0,0 +1,3 @@
+body{
+  background:#969696
+}

src/views/themes/blank/scss/main.scss

@@ -0,0 +1,3 @@
+body{
+  background:#FFABAC
+}

src/views/themes/default/css/main-comments.css

@@ -0,0 +1,62 @@
+@font-face { font-family: 'Vollkorn-Regular'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Regular.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-Bold'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Bold.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-Italic'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Italic.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-SemiItalic'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-SemiboldItalic.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Regular'; src: url("../font/CamingoCode-v1.0/CamingoCode-Regular.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Bold'; src: url("../font/CamingoCode-v1.0/CamingoCode-Bold.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Italic'; src: url("../font/CamingoCode-v1.0/CamingoCode-Italic.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-SemiItalic'; src: url("../font/CamingoCode-v1.0/CamingoCode-BoldItalic.ttf") format("truetype"); }
+
+body#notes { margin: 0 auto; max-width: 50em !important; padding-top: 15px; background-color: #0C0C0C; font-size: 1.1rem; font-family: 'CamingoCode-Regular'; color: #E9E9E9; }
+
+body#notes em { font-family: 'CamingoCode-Italic'; }
+
+body#notes em strong { font-family: 'CamingoCode-BoldItalic'; }
+
+body#notes strong { font-family: 'CamingoCode-Bold'; }
+
+body#notes strong em { font-family: 'CamingoCode-BoldItalic'; }
+
+body#notes header#speaker-notes { padding-left: 10px; padding-right: 10px; -webkit-border-radius: 3px; border-radius: 3px; box-sizing: border-box; padding-left: 15px; width: 100%; height: 30px; background-color: #3F3F3F; display: flex; justify-content: space-between; align-items: center; text-align: center; }
+
+body#notes header#speaker-notes button { width: 50px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #C7C7C7; color: #000; border: none; box-shadow: none; text-shadow: -1px 1px #8B8B8B; height: 20px; }
+
+body#notes header#speaker-notes button:hover { color: #D0D0D0; background: #000000; }
+
+body#notes header#speaker-notes input[type="number"] { width: 50px; height: 20px; -webkit-border-radius: 3px; color: #000; border-radius: 3px; background-color: #C7C7C7; border: none; text-align: center; }
+
+body#notes #comments { margin-top: 30px; }
+
+.blink { -webkit-animation: blink .75s linear infinite; -moz-animation: blink .75s linear infinite; -ms-animation: blink .75s linear infinite; -o-animation: blink .75s linear infinite; animation: blink .75s linear infinite; }
+
+@-webkit-keyframes blink { 0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; } }
+
+@-moz-keyframes blink { 0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; } }
+
+@-ms-keyframes blink { 0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; } }
+
+@-o-keyframes blink { 0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; } }
+
+@keyframes blink { 0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; } }

src/views/themes/default/css/main.css

@@ -0,0 +1,88 @@
+@font-face { font-family: 'Vollkorn-Regular'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Regular.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-Bold'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Bold.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-Italic'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-Italic.ttf") format("truetype"); }
+
+@font-face { font-family: 'Vollkorn-SemiItalic'; src: url("../font/vollkorn-3-005/TTF/Vollkorn-SemiboldItalic.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Regular'; src: url("../font/CamingoCode-v1.0/CamingoCode-Regular.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Bold'; src: url("../font/CamingoCode-v1.0/CamingoCode-Bold.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-Italic'; src: url("../font/CamingoCode-v1.0/CamingoCode-Italic.ttf") format("truetype"); }
+
+@font-face { font-family: 'CamingoCode-SemiItalic'; src: url("../font/CamingoCode-v1.0/CamingoCode-BoldItalic.ttf") format("truetype"); }
+
+/*
+
+Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull <[email protected]>
+
+*/
+.hljs { display: block; overflow-x: auto; padding: 0.5em; background: #fdf6e3; }
+
+.hljs-comment, .hljs-quote { color: #93a1a1; }
+
+/* Solarized Green */
+/* Solarized Cyan */
+.hljs-number, .hljs-string, .hljs-meta .hljs-meta-string, .hljs-literal, .hljs-doctag, .hljs-regexp { color: #2aa198; }
+
+/* Solarized Blue */
+/* Solarized Yellow */
+/* Solarized Orange */
+/* Solarized Red */
+.hljs-emphasis { font-style: italic; }
+
+.hljs-strong { font-weight: bold; }
+
+header, footer { font-family: 'Vollkorn-SemiItalic'; color: #7A7A7A; box-sizing: border-box; margin-top: auto; overflow: hidden; position: absolute; font-size: 0.8rem; text-align: right; width: 100%; left: 0; }
+
+header { top: 0; height: 35px; padding-top: 10px; padding-right: 10px; }
+
+footer { bottom: 0; height: 35px; padding-bottom: 10px; padding-right: 10px; }
+
+body#frontal { margin: 0 auto; padding: 0; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 100vh; font-family: 'Vollkorn-Regular'; max-height: 100%; max-widht: 50em; overflow: hidden; font-size: 1.3em; line-height: 1.5; color: #465963; word-wrap: break-word; hyphens: auto; background-color: #FFFFFF; }
+
+body#frontal img[alt="left"] { margin-left: 5%; margin-right: 5%; }
+
+body#frontal .wide { margin-left: 5%; margin-right: 5%; padding-left: 5%; width: 100%; }
+
+body#frontal .narrow { margin-left: 20%; margin-right: 20%; }
+
+body#frontal .pwide { max-width: 90vw !important; }
+
+body#frontal #slides { padding-top: 35px; padding-bottom: 35px; }
+
+body#frontal #slides ol, body#frontal #slides ul { text-align: left; max-width: 50vw; }
+
+body#frontal #slides ol li, body#frontal #slides ul li { text-align: left; }
+
+body#frontal #slides h1, body#frontal #slides h2, body#frontal #slides h3, body#frontal #slides h4 { font-family: 'Vollkorn-Bold'; }
+
+body#frontal #slides a { color: #E96368; text-decoration: none; }
+
+body#frontal #slides a:hover { color: #e02027; }
+
+body#frontal #slides em { font-family: 'Vollkorn-Italic'; }
+
+body#frontal #slides strong { font-family: 'Vollkorn-Bold'; }
+
+body#frontal #slides img { max-width: 80%; display: block; margin: 0 auto; }
+
+body#frontal #slides img[alt="left"] { float: left; margin-right: 10px; clear: both; }
+
+body#frontal #slides pre { min-width: 100%; text-align: left; padding: 1em; background: #eee; border-left: 2px solid #A4A4A4; }
+
+body#frontal #slides code { text-align: left; font-family: 'CamingoCode-Regular'; }
+
+body#frontal #slides p { text-align: left; max-width: 50vw; }
+
+body#frontal #slides blockquote { font-family: 'Vollkorn-Italic'; font-size: 1.6rem; }
+
+body#frontal #slides table { margin-left: auto; margin-right: auto; }
+
+body#frontal #slides table thead { font-family: 'Vollkorn-Bold'; }
+
+body#frontal #slides table th { border-bottom: 3px dashed #848484; padding-left: 10px; padding-right: 10px; }
+
+body#frontal #slides table td { border-bottom: 2px dashed #cccccc; padding-left: 10px; padding-right: 10px; }

src/views/themes/default/scss/_solarized-light.scss

@@ -0,0 +1,85 @@
+/*
+
+Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull <[email protected]>
+
+*/
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 0.5em;
+  background: #fdf6e3;
+  // color: #657b83;
+}
+
+.hljs-comment,
+.hljs-quote {
+  color: #93a1a1;
+}
+
+/* Solarized Green */
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-addition {
+  // color: #859900;
+}
+
+/* Solarized Cyan */
+.hljs-number,
+.hljs-string,
+.hljs-meta .hljs-meta-string,
+.hljs-literal,
+.hljs-doctag,
+.hljs-regexp {
+  color: #2aa198;
+}
+
+/* Solarized Blue */
+.hljs-title,
+.hljs-section,
+.hljs-name,
+.hljs-selector-id,
+.hljs-selector-class {
+  // color: #268bd2;
+}
+
+/* Solarized Yellow */
+.hljs-attribute,
+.hljs-attr,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-class .hljs-title,
+.hljs-type {
+  // color: #b58900;
+}
+
+/* Solarized Orange */
+.hljs-symbol,
+.hljs-bullet,
+.hljs-subst,
+.hljs-meta,
+.hljs-meta .hljs-keyword,
+.hljs-selector-attr,
+.hljs-selector-pseudo,
+.hljs-link {
+  // color: #cb4b16;
+}
+
+
+/* Solarized Red */
+.hljs-built_in,
+.hljs-deletion {
+  // color: #dc322f;
+}
+
+.hljs-formula {
+  // background: #eee8d5;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}

src/views/themes/default/scss/main-comments.scss

@@ -0,0 +1,113 @@
+@import "fonts";
+$headerHeight: 30px;
+$headerMargin: 10px;
+
+body#notes{
+  margin: 0 auto;
+  max-width: 50em !important;
+  padding-top:$headerHeight/2;
+  background-color:#0C0C0C;
+  font-size: 1.1rem;
+  // font-family:'Vollkorn-Regular';
+  font-family: 'CamingoCode-Regular';
+  color:#E9E9E9;
+  em{
+     font-family: 'CamingoCode-Italic';
+     strong{
+     font-family: 'CamingoCode-BoldItalic';
+
+     }
+  }
+  strong{
+     font-family: 'CamingoCode-Bold';
+em{
+     font-family: 'CamingoCode-BoldItalic';
+  }
+  }
+  header#speaker-notes {
+  padding-left: $headerMargin;
+  padding-right: $headerMargin;
+    -webkit-border-radius: 3px;
+     border-radius: 3px;
+    box-sizing: border-box;
+    padding-left:15px;
+    width: 100%;
+    height: $headerHeight;
+    background-color: #3F3F3F;
+    display:flex;
+    justify-content: space-between;
+    align-items:center;
+    text-align:center;
+
+      button{
+        width:50px;
+        -webkit-border-radius: 3px;
+        border-radius: 3px;
+        background-color: #C7C7C7;
+        color: #000;
+        border: none;
+        box-shadow: none;
+        text-shadow: -1px 1px #8B8B8B;
+        height:20px;
+
+      }
+      button:hover{
+        color: #D0D0D0;
+        background: #000000;
+
+      }
+        input[type="number"]{
+        width:50px;
+        height:20px;
+        -webkit-border-radius: 3px;
+        color: #000;
+        border-radius: 3px;
+        background-color: #C7C7C7;
+        border: none ;
+        text-align: center;
+
+
+      }
+  }
+  #comments {
+    margin-top: $headerHeight;
+  }
+}
+// http://www.computerhope.com/issues/ch001651.htm
+.blink {
+  -webkit-animation: blink .75s linear infinite;
+  -moz-animation: blink .75s linear infinite;
+  -ms-animation: blink .75s linear infinite;
+  -o-animation: blink .75s linear infinite;
+   animation: blink .75s linear infinite;
+}
+@-webkit-keyframes blink {
+  0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; }
+}
+@-moz-keyframes blink {
+  0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; }
+}
+@-ms-keyframes blink {
+  0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; }
+}
+@-o-keyframes blink {
+  0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; }
+}
+@keyframes blink {
+  0% { opacity: 1; }
+  50% { opacity: 1; }
+  50.01% { opacity: 0; }
+  100% { opacity: 0; }
+}