add start stop joplin client terminal

tmpl/snippet_html.nim

@@ -8,6 +8,22 @@ proc templ_title* (title: string): string = tmpli html"""
         <h2>$title</h2>
 """
 
+# --==--==--==--==--==--==--==--==--==--==-- #
+# HTML : Show notification Bell
+# --==--==--==--==--==--==--==--==--==--==-- #
+proc show_notification_bell* (nb_notif: int): string = tmpli html"""
+ <div class="notification-box">
+    <span class="notification-count">$nb_notif</span>
+    <div class="notification-bell">
+      <span class="bell-top"></span>
+      <span class="bell-middle"></span>
+      <span class="bell-bottom"></span>
+      <span class="bell-rad"></span>
+    </div>
+  </div>
+    """
+
+
 # --==--==--==--==--==--==--==--==--==--==-- #
 # SVG : Status Joplin green icon
 # --==--==--==--==--==--==--==--==--==--==-- #
@@ -49,3 +65,7 @@ proc NEED_joplinSyncro_icon* (): string = tmpli html"""
 proc InProgress_joplinSyncro_icon* (): string = tmpli html"""
 
     """
+
+
+
+

tmpl/website.tmpl

@@ -24,8 +24,9 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>Document</title>
         <link rel="stylesheet" href="css/styles.css">
-        <link rel="stylesheet" href="css/progress.css">
+        <link rel="stylesheet" href="css/notif-bell.css">
         <script src="js/script.js" defer></script>
+        
     </head>
 
     <body>
@@ -35,7 +36,14 @@
                 # var icon_menu = Menu_icon()
                 ${icon_menu}
 
+                
+
             </button>
+            <button class="notifBell-btn" data-notifBell-btn>
+                # var notifBell = show_notification_bell(1)
+                ${notifBell}
+            </button>
+
         </header>
         <div class="container">
             <aside class="sidebar" data-sidebar>
@@ -161,12 +169,13 @@
                             </a>
                         </li>
                         <li class="sidebar-list-item ">
-                            <a href="#" class="sidebar-link">                          
-                                                                
+                                
                                 # if columnLeftInfo.j_status:
+                                    <a href="/secret?msg=startStopJoplin" class="sidebar-link">    
                                     # var status_green = status_joplin_green()
                                     ${status_green}
                                 # else:
+                                    <a href="/secret?msg=startStopJoplin" class="sidebar-link">
                                     # var status_red = status_joplin_red()
                                     ${status_red}
                                 # end if
@@ -256,6 +265,13 @@
                 </div>
             </div>
         </div>
+        <script
+            src="https://code.jquery.com/jquery-2.2.4.min.js"
+            integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
+            crossorigin="anonymous">
+        </script>
+        <script src='https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.0/js/foundation.min.js'></script>
+        <script src="js/alertify_notif.js" defer></script>
     </body>
 
     </html>