view script source theme

Author: HoangTran0410

pages/viewScriptSource/index.html

@@ -9,7 +9,8 @@
 
     <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script> -->
-    <link rel="stylesheet" href="./libs/isbl-editor-dark.min.css">
+    <link rel="stylesheet" href="./libs/styles/default.min.css">
+    <link rel="stylesheet" href="./libs/styles/monokai-sublime.min.css">
     <script src="libs/highlight.min.js"></script>
     <script src="libs/javascript.min.js"></script>
 
@@ -21,7 +22,7 @@
     <button type="button" id="copy-btn">Copy source code</button>
 
     <pre>
-        <code class="language-javascript"></code>
+        <code class="language-js"></code>
     </pre>
 </body>
 

pages/viewScriptSource/libs/isbl-editor-dark.min.css

@@ -7,7 +7,10 @@ window.onload = () => {
     const { name, source, description } = sharedData;
     if (name && source) {
       document.title = "Useful-script / " + name + " / " + description;
-      document.querySelector("code").innerHTML = source;
+      document.querySelector("code").innerHTML = source.replace(
+        "function",
+        "function _"
+      );
       hljs.highlightAll();
     }
   } catch (e) {}

pages/viewScriptSource/libs/isbl-editor-light.min.css

@@ -140,13 +140,12 @@ a:hover {
 .content button:hover {
     background-color: #a8a8a8;
     cursor: pointer;
-    transform: translateY(-3px);
     z-index: 2;
 }
 
 .content button:active {
-    transform: none;
-    transition: all 50ms;
+    background-color: #666;
+    color: #ddd;
 }
 
 .content button i.star,