1

simple-demo/send_memos.html

@@ -5,9 +5,16 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
     <title>memos记录</title>
     <!-- 引入Quill样式 -->
-    <link rel="stylesheet" href="./js/quill.snow.css">
+<!--    <link rel="stylesheet" href="./js/quill.snow.css">-->
+    <link rel="stylesheet" href="https://cdn.staticfile.org/lxgw-wenkai-screen-webfont/1.6.0/lxgwwenkaiscreen.css"></link>
     <script src="js/util.js"></script>
     <style>
+        body{font-family: "LXGW WenKai Screen", sans-serif !important;}
+
+        .border {
+            border: 1px solid #b7b6b6;
+            border-radius: 5px;
+        }
         .editor {
             height: 130px;
             padding: 10px;
@@ -44,15 +51,15 @@
         <a href="https://memos.tianyunperfect.cn/">memos主页</a>
         <!--        页码输入框，默认为1，修改触发查询-->
         <span style="margin-left: 20px">页码：</span>
-        <input style="width: 50px; margin-left: 20px" type="number" id="page" value="1" onkeydown="if(event.keyCode===13) {search()}">
+        <input style="width: 50px; margin-left: 20px;padding-left: 10px" type="number" class="border" id="page" value="1" onkeydown="if(event.keyCode===13) {search()}">
         <!--输入框，绑定回车事件，触发查询-->
-        <input style="margin-left: 30px; width: 70vw;" placeholder="搜索" type="text" id="search" onkeydown="if(event.keyCode===13) {search()}">
+        <input style="margin-left: 30px; width: 70vw; padding-left: 10px" placeholder="搜索" type="text" id="search" class="border" onkeydown="if(event.keyCode===13) {search()}">
     </div>
 
     <br><br>
     <div></div>
     <!-- 创建一个用于编辑的容器 -->
-    <textarea id="editor" class="editor" rows="4" style="width: 95%" onchange="localStorage.setItem(contentStr, getEditContent())"></textarea>
+    <textarea id="editor" class="editor border" rows="4" style="width: 95%" onchange="localStorage.setItem(contentStr, getEditContent())"></textarea>
 
     <!-- 添加多选按钮 -->
     <div id="tags"></div>
@@ -108,6 +115,7 @@
                 input.checked = true;
             }
             input.type = 'checkbox';
+            input.classList.add('border');
             input.id = tag;
             input.name = 'category';
             input.value = tag;
@@ -257,7 +265,6 @@
     }
 
     let tmpId;
-    let timeStr;
 
     // 更新数据
     async function updateById() {
@@ -345,7 +352,7 @@
                 div.appendChild(lineDiv);
 
                 let contentDiv = document.createElement('div');
-                contentDiv.style.border = '1px solid #000';
+                contentDiv.className = 'border';
                 contentDiv.style.width = '70vw';
                 contentDiv.style.margin = '10px';
                 contentDiv.style.padding = '10px';
@@ -358,6 +365,7 @@
                 let id = item['id'];
                 timeSpan.id = 'time_' + id;
                 timeSpan.innerText = timeStr;
+                timeSpan.style.marginBottom = '5px';
                 contentDiv.appendChild(timeSpan);
 
 
@@ -388,7 +396,7 @@
                         img.src = `https://memos_assert.tianyunperfect.cn/${internal_path}?width=150`;
                         img.style.maxHeight = '200px';
                         img.style.maxWidth = '200px';
-                        img.style.margin = '10px';
+                        img.style.margin = '10px 10px 0 0';
                         img.style.cursor = 'pointer';
                         // 添加到div
                         tmpDiv.appendChild(img);