modify colors

A-S-T-U-C-E · Oct 8, 2020 · 95974e8 · 95974e8
1 parent b54eafd
commit 95974e8
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 13 deletions.
diff --git a/S4E/css/overload.css b/S4E/css/overload.css
@@ -0,0 +1,50 @@
+/**
+* @license
+* Copyright 2020 Sébastien CANET
+* SPDX-License-Identifier: BSD-3-Clause
+*/
+
+/* CSS specific added for the theme */
+
+body {
+    background-color: #03234B;
+}
+#separator {
+    background-color: #03234B;
+}
+#helpModal_header {
+    background-color: #03234B;
+}
+.config_content {
+    background-color: #03234B;
+}
+.modal-header {
+    background-color: #03234B;
+}
+.accordion {
+  background-color: #03234B;
+}
+.accordion:hover {
+  color: #03234B;
+}
+.active {
+    color: #03234B;
+  background-color: #FFCC00;
+}
+.collapsibleButton {
+    background-color: #03234B;
+}
+.active:after {
+    color: #03234B;
+}
+#lateral-panel-setup-label {
+    color: #03234B;
+}
+.closeModal:hover,
+.closeModal:focus {
+    color: #FFCC00;
+}
+/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
+.active, .collapsibleButton:hover {
+    background-color: #FFCC00;
+}
diff --git a/css/UI.css b/css/UI.css
@@ -156,7 +156,6 @@ td.tabMiddle {
 
 #separator {
     cursor: col-resize;
-    background-color: #03234B;
     background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='30'><path d='M2 0 v30 M5 0 v30 M8 0 v30' fill='white' stroke='white'/></svg>");
     background-repeat: no-repeat;
     background-position: center;
@@ -239,7 +238,6 @@ td.tabMiddle {
 }
 .config_content {
     margin: 5px;
-    background-color: #03234B;
 }
 #content_code {
     width: 40px;
@@ -337,7 +335,6 @@ td.tabMiddle {
 /* Modal Header */
 .modal-header {
     padding: 10px;
-    background-color: #03234B;
     color: white;
     -webkit-border-radius: 15px !important;
     -moz-border-radius: 15px !important;
@@ -388,7 +385,6 @@ td.tabMiddle {
 }
 /* collapsible content inside div */
 .collapsibleButton {
-    background-color: #03234B;
     color: #FFFFFF;
     cursor: pointer;
     padding: 10px;

diff --git a/css/lateral-panel.css b/css/lateral-panel.css
@@ -57,7 +57,6 @@
     height: 28px;
     cursor: pointer;
     font-size: 1.5em;
-    color: #03234B;
 }
 #lateral-panel-CLI-bloc,
 #lateral-panel-setup-label,
@@ -84,7 +83,6 @@
  * accordion effect inside setup panel
  */
 .accordion {
-  background-color: #03234b;
   color: #FFFFFF;
   cursor: pointer;
   padding: 8px;
@@ -105,7 +103,6 @@
 }
 .accordion:hover {
   background-color: #FFFFFF;
-  color: #03234b;
 }
 
 /* Style the accordion panel. Note: hidden by default */

diff --git a/index.html b/index.html
@@ -11,6 +11,7 @@
         <link rel="stylesheet" href="./css/lateral-panel.css" />
         <link rel="stylesheet" href="./css/UI.css" />
         <link rel="stylesheet" href="./S4E/css/S4E.css" />
+        <link rel="stylesheet" href="./S4E/css/overload.css" />
     </head>
     <body>
         <div class="table_wrapper">

diff --git a/js/blockly/playground.js b/js/blockly/playground.js
@@ -127,18 +127,12 @@ function fontSpacingPageModify(classToModify, spacingToModify) {
 function setOnOffLine() {
     // Set background colour to differentiate server vs local copy.
     if (location.protocol === 'file:') {
-        document.body.style.backgroundColor = '#03234B';
-        document.getElementById('CLI_content').style.backgroundColor = '#03234B';
-        document.getElementById('setup_content').style.backgroundColor = '#03234B';
         document.getElementById('verifyButton').disabled = false;
         document.getElementById('serialButton').disabled = false;
         document.getElementById('uploadButton').disabled = false;
         document.getElementById('serialConnectButton').disabled = false;
         document.getElementById('serialMenu').disabled = false;
     } else {
-        document.body.style.backgroundColor = '#00abdf';
-        document.getElementById('CLI_content').style.backgroundColor = '#00abdf';
-        document.getElementById('setup_content').style.backgroundColor = '#00abdf';
         document.getElementById('verifyButton').disabled = true;
         document.getElementById('serialButton').disabled = true;
         document.getElementById('uploadButton').disabled = true;