From 9f219c725d0198086750b2f05c04489865e038f8 Mon Sep 17 00:00:00 2001
From: frostime <frostime@foxmail.com>
Date: Sat, 20 May 2023 12:43:50 +0800
Subject: [PATCH] Make hello easy

---
 src/hello.svelte        | 32 ++++++++++----------------------
 src/index.ts            |  3 ++-
 src/libs/b3-list.svelte |  8 ++++++++
 3 files changed, 20 insertions(+), 23 deletions(-)
 create mode 100644 src/libs/b3-list.svelte

diff --git a/src/hello.svelte b/src/hello.svelte
index 5978db2..4854e91 100644
--- a/src/hello.svelte
+++ b/src/hello.svelte
@@ -8,6 +8,7 @@
     import { showMessage } from "siyuan";
     export let name: string;
     export let i18n: any;
+    export let opendCount: number;
 
     let time;
     let ver;
@@ -19,7 +20,7 @@
     let intv2 = setInterval(async () => {
         ver = await version();
         showMessage(
-            `Hello ${name} v${ver}`,
+            `[${opendCount}] Hello ${name} v${ver}`,
             5000
         );
     }, 10000);
@@ -45,26 +46,15 @@
 <div id="hello">
     <div class="fn__flex">
         <div class="fn__flex-1">
-            <h2>Hello {name} v{ver}</h2>
+            <h2>[{opendCount}] Hello {name} v{ver}</h2>
         </div>
-        <div class="fn__flex-1 b3-label__text __text-alignright">
+        <div class="fn__flex-1 b3-label__text __text-right">
             {time_str}
         </div>
     </div>
 
-    <br />
-
-    <div class="fn__flex-column">
-        <div class="fn__flex-1">
-            <ul class="b3-list b3-list--background">
-                <li class="b3-list-item">
-                    <span class="b3-list-item__text">
-                        {@html i18n.makesure}
-                    </span>
-                </li>
-            </ul>
-        </div>
-        <div class="fn__space-column"></div>
+    <div>
+        <p>{@html i18n.makesure}</p>
     </div>
 
 </div>
@@ -72,13 +62,11 @@
 <style lang="scss">
     #hello {
         margin: 20px;
+        div {
+            margin-bottom: 10px;
+        }
     }
-    .__text-alignright {
+    .__text-right {
         text-align: right;
     }
-    .fn__space-column {
-        height: 8px;
-        display: inline-block;
-        flex-shrink: 0;
-    }
 </style>
diff --git a/src/index.ts b/src/index.ts
index 1d75664..84af345 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -54,7 +54,8 @@ export default class SamplePlugin extends Plugin {
         let hello = new Hello({
             target: dialog.element.querySelector("#helloPanel"),
             props: {
-                name: `[${this.counter.hello}]${this.i18n.name}`,
+                name: this.i18n.name,
+                opendCount: this.counter.hello,
                 i18n: this.i18n.hello
             }
         });
diff --git a/src/libs/b3-list.svelte b/src/libs/b3-list.svelte
new file mode 100644
index 0000000..edbab36
--- /dev/null
+++ b/src/libs/b3-list.svelte
@@ -0,0 +1,8 @@
+<ul class="b3-list b3-list--background">
+    <li class="b3-list-item">
+        <svg class="b3-list-item__graphic"><use xlink:href="#iconEdit"></use></svg>
+        <span class="b3-list-item__text">
+            <slot></slot>
+        </span>
+    </li>
+</ul>