Feat: the new handbooks (#8524)

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks popup

* feat(ui): WIP dragable & resizable for handbooks popup

* feat(ui): WIP pane navigations for handbooks popup

* feat(ui): WIP pane navigations for handbooks popup

* feat(ui): WIP handbooks markdown body

* feat(ui): WIP handbooks nodes for dashboard render

* feat(ui): WIP watch mode for development

* improve(ui): typos

* feat(ui): WIP enhance watch mode

* feat(ui): WIP support topic conent link local assets

* feat(ui): WIP support slide gallery for demo images & videos.

* fix(ui): parse value about draging position offset

* improve(ui): background color transition of handbook item card

* improve(ui): resizable of handbooks popup

* feat(handbooks): search topics

* improve(handbooks): search results within topics group

* improve(ui): better interaction for handbooks searchbar

* fix(handbooks): conflictive up/down for searchbar interaction

* improve(ux): better interaction for handbooks searchbar

* feat(ux): support youtube video for topic demos media

* fix(ui): container size of youtube video demos

* improve(handbooks): support local video for topic demos

* improve(ui): polish markdown body style for handbooks topic details

* chore: remove debugs

* chore: remove debugs

* improve(ui): polish active style for topic item card

* improve(ui): polish style of demos item

* improve(ui): help buttons still be visible when right sidebar opened

* improve(handbooks): support sub chapters for topic detail

* improve(handbooks): support sub chapters for topic detail

* improve(handbooks): support chapters searching for topics list

* fix: lint

* improve(ui): position of demo slides bullets

* fix(ui): index of chapter select

* improve(handbooks): typo

* fix(dev): lint

* fix(dev): lint

* fix(pdf): remove prefix(`@`) checking for links of org mode page

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks pane

* feat(ui): WIP handbooks popup

* feat(ui): WIP dragable & resizable for handbooks popup

* feat(ui): WIP pane navigations for handbooks popup

* feat(ui): WIP pane navigations for handbooks popup

* feat(ui): WIP handbooks markdown body

* feat(ui): WIP handbooks nodes for dashboard render

* feat(ui): WIP watch mode for development

* improve(ui): typos

* feat(ui): WIP enhance watch mode

* feat(ui): WIP support topic conent link local assets

* feat(ui): WIP support slide gallery for demo images & videos.

* fix(ui): parse value about draging position offset

* improve(ui): background color transition of handbook item card

* improve(ui): resizable of handbooks popup

* feat(handbooks): search topics

* improve(handbooks): search results within topics group

* improve(ui): better interaction for handbooks searchbar

* fix(handbooks): conflictive up/down for searchbar interaction

* improve(ux): better interaction for handbooks searchbar

* feat(ux): support youtube video for topic demos media

* fix(ui): container size of youtube video demos

* improve(handbooks): support local video for topic demos

* improve(ui): polish markdown body style for handbooks topic details

* chore: remove debugs

* chore: remove debugs

* improve(ui): polish active style for topic item card

* improve(ui): polish style of demos item

* improve(ui): help buttons still be visible when right sidebar opened

* improve(handbooks): support sub chapters for topic detail

* improve(handbooks): support sub chapters for topic detail

* improve(handbooks): support chapters searching for topics list

* fix: lint

* improve(ui): position of demo slides bullets

* fix(ui): index of chapter select

* improve(handbooks): typo

* fix(dev): lint

* fix(dev): lint

* improve(handbook): i18n

* fix(lint): unused translations

* fix: accessibility issues and translations

* fix(handbook): chapters navigation

* enhance(handbook): ux of the chapters select

* enhance(handbook): support link other page with markdown link syntax

* improve(ui): polish ui details of handbook topics card

* fix(handbook): parse key from href with a specific extension

* enhance(handbook): logic of chapters navigation

* enhance(handbook): ui of chapters navigation

* fix: lint

* improve(ui): display nowrap for code text

* fix(handbook): remove unnecessary source map

* fix(ui): missing component key of handbook chapter select

* enhance(handbook): WIP support panes navigation for the external links

* enhance(handbook): support panes navigation for the external links

* improve(ui): footer links of the handbook home pane

* improve(ui): footer links of the handbook home pane

* improve(ui): polish topics card

* improve(handbook): add shortcuts category card for home pane

* improve(ui): WIP the new help menu

* improve(ui): the new help menu

* fix: incorrect help link

* improve(ux): close help menu when click outside

* fix: lint

* fix(lint): remove unused translation

* fix(ui): the link of changelog

* fix(ui): the cover thumb container size of the topic card

* fix(ui): handbook popup overlay index

* enhance(ux): preivew images with lightbox modal for the handbook content

* enhance(ux): bottom border for the handbook content header when then content body scrolled

* fix: missing i18n

* improve(handbook): polish ui details

* fix: lint

* enhance(handbook): polish details

* fix(ui): incorrect safety init

* fix(ui): missing key for the help menu items

* enhance(ui): disable resize for the handbook popup container

* chore: build libs core

* fix(ui): incorrect shortcuts label

* enhance(handbook): cache discord online number

* enhance(handbook): fix heading level sizes

* enhance(handbook): improve paragraph spacing

* enhance(handbook): improve margins of media elements

* enhance(handbook): polish discord button

* enhance(plugin): make headings/font weights/colors look like in the design

* enhance(handbook): writing mode option is only available for develop mode

* enhance(handbook): polish handbook dashboard page

* enhance(handbook): typos

* enhance(ux): get discord online users count from logseq server

* fix(handbooks): incorrect var name

* enhance(handbook): polish details

---------

Co-authored-by: Bad3r <bad3r@protonmail.com>
Co-authored-by: situ2001 <yongcong2001@outlook.com>
Co-authored-by: Tienson Qin <tiensonqin@gmail.com>
Co-authored-by: Konstantinos Kaloutas <konstantinos@logseq.com>

src/main/frontend/components/container.css

@@ -487,14 +487,6 @@
   }
 }
 
-html[data-theme='dark'] {
-  #left-sidebar {
-    > .shade-mask {
-      background-color: rgba(0, 0, 0, .15);
-    }
-  }
-}
-
 .settings-modal {
   @apply -m-8 rounded-lg;
   /* box-shadow: inset 0 0 0 1px var(--ls-border-color); */
@@ -527,13 +519,36 @@ html[data-theme='dark'] {
     @apply fixed bottom-4 right-4 sm:right-8;
 
     > .inner {
-      @apply font-bold
-      rounded-full h-8 w-8 flex items-center justify-center font-bold
-      select-none cursor-help;
+      @apply rounded-full h-8 w-8 flex items-center justify-center
+      font-bold select-none cursor-help;
 
       background-color: var(--ls-secondary-background-color);
     }
   }
+
+  &-menu-popup {
+    @apply fixed bottom-14 right-8 z-10 border
+    rounded-lg min-w-[260px] shadow;
+
+    background-color: var(--ls-secondary-background-color);
+    border-color: var(--ls-border-color);
+
+    > .list-wrap {
+      @apply flex flex-col pt-3;
+
+      .it {
+        color: var(--ls-primary-text-color);
+
+        &:active, &:hover {
+          background-color: var(--ls-tertiary-background-color);
+        }
+      }
+    }
+  }
+
+  &-handbook-btn {
+    @apply bottom-16;
+  }
 }
 
 .cp__right-sidebar {
@@ -754,3 +769,11 @@ a.ui__modal-close, a.close {
 a.ui__modal-close:hover, a.close:hover {
   opacity: 1;
 }
+
+html[data-theme='dark'] {
+  #left-sidebar {
+    > .shade-mask {
+      background-color: rgba(0, 0, 0, .15);
+    }
+  }
+}