背景图

Author: Vktun

css/app.css

@@ -1,49 +1,63 @@
 /* Your app styles here */
 
 /* Left Panel right border when it is visible by breakpoint */
+
 .panel-left.panel-visible-by-breakpoint:before {
   position: absolute;
   right: 0;
   top: 0;
   height: 100%;
   width: 1px;
-  background: rgba(0,0,0,0.1);
+  background: rgba(0, 0, 0, 0.1);
   content: '';
   z-index: 6000;
 }
 
 /* Hide navbar link which opens left panel when it is visible by breakpoint */
-.panel-left.panel-visible-by-breakpoint ~ .view .navbar .panel-open[data-panel="left"] {
+
+.panel-left.panel-visible-by-breakpoint~.view .navbar .panel-open[data-panel="left"] {
   display: none;
 }
 
 /*
   Extra borders for main view and left panel for iOS theme when it behaves as panel (before breakpoint size)
 */
-.ios .panel-left:not(.panel-visible-by-breakpoint).panel-active ~ .view-main:before,
-.ios .panel-left:not(.panel-visible-by-breakpoint).panel-closing ~ .view-main:before {
+
+.ios .panel-left:not(.panel-visible-by-breakpoint).panel-active~.view-main:before,
+.ios .panel-left:not(.panel-visible-by-breakpoint).panel-closing~.view-main:before {
   position: absolute;
   left: 0;
   top: 0;
   height: 100%;
   width: 1px;
-  background: rgba(0,0,0,0.1);
+  background: rgba(0, 0, 0, 0.1);
   content: '';
   z-index: 6000;
 }
-textarea{
+
+textarea {
   min-height: 36px;
   width: 100%;
   height: 100%;
 }
-.bottomline{
+
+.bottomline {
   height: 50%;
   min-height: 300px;
   margin-top: 10px;
 }
-hr{
+
+hr {
   color: #c0c0c0;
 }
-card_footer_custome{
+
+card_footer_custome {
   text-align: right;
+}
+
+.bg-image {
+  background-image: url("../images/bg.png");
+  background-origin:content-box;
+  background-position:left;
+  background-attachment:fixed;
 }

images/bg.png

@@ -55,7 +55,7 @@
             </div>
           </div>
         </div>
-        <div class="page-content">
+        <div class="page-content bg-image">
           <div class="block-title">My Cloud Notes</div>
           <div id="cards">
 

index.html

@@ -1,13 +1,14 @@
 window.onload = function () {
-    if(webExtensionWallet){
-        $$("#addbtn").show();
-        setTimeout(() => {
-            getMyNotes();
-          }, 10);
-    }else{
-        $$("#addbtn").hide();
-        $$("#cards").html("Please install<a href='https://github.com/ChengOrangeJu/WebExtensionWallet' class='external'>WebExtensionWallet</a>")
-    }
+  if (typeof (webExtensionWallet) === "undefined") {
+    $$("#addbtn").hide();
+    $$("#cards").html("Please install<a href='https://github.com/ChengOrangeJu/WebExtensionWallet' class='external'>WebExtensionWallet</a>")
+
+  } else {
+    $$("#addbtn").show();
+    setTimeout(() => {
+      getMyNotes();
+    }, 10);
+  }
 }
 
 function initForm() {
@@ -56,4 +57,4 @@ function generateTemplate(note) {
     "</div>" +
     "<div class='card-footer card_footer_custome'>" + d.getFullYear() + "年" + (d.getMonth() + 1) + "月" + (d.getDay() + 1) + "日" + "</div>" +
     "</div>"
-}
+}