update demo

docs/assets/css/style.css

@@ -136,6 +136,10 @@ img {
     background-color: rgb(39, 41, 54);
 }
 
+.header .run:hover {
+    background-color: #2e3350;
+}
+
 .main {
     display: flex;
     flex: 1;

docs/assets/js/common.js

@@ -174,15 +174,7 @@
             });
     }
 
-    window.addEventListener('error', function (err) {
-        console.error(err);
-    });
-
-    window.addEventListener('unhandledrejection', function (err) {
-        console.error(err);
-    });
-
-    $run.addEventListener('click', function (e) {
+    $run.addEventListener('click', function () {
         var libs = encodeURIComponent($lib.value);
         var code = encodeURIComponent(editor.getValue());
         var url = window.location.origin + window.location.pathname + '?libs=' + libs + '&code=' + code;
@@ -195,4 +187,23 @@
             this.style.display = 'none';
         }
     });
+
+    window.addEventListener('error', function (err) {
+        console.error(err);
+    });
+
+    window.addEventListener('unhandledrejection', function (err) {
+        console.error(err);
+    });
+
+    document.addEventListener('keydown', function (event) {
+        if ((event.ctrlKey || event.metaKey) && event.key === 's') {
+            event.preventDefault();
+            var libs = encodeURIComponent($lib.value);
+            var code = encodeURIComponent(editor.getValue());
+            var url = window.location.origin + window.location.pathname + '?libs=' + libs + '&code=' + code;
+            history.pushState(null, null, url);
+            initApp();
+        }
+    });
 })();

docs/index.html

@@ -45,7 +45,7 @@
                     <a class="item" href="./document/">Document</a>
                     <a class="item" href="https://github.com/zhw2590582/ArtPlayer">Github</a>
                 </div>
-                <div class="run">Run Code</div>
+                <div class="run">▶ Run Code</div>
             </header>
             <div class="libs">
                 <textarea class="libsInput"