From dcf37edc103315fecda60008dab7f522f692e4a3 Mon Sep 17 00:00:00 2001 From: Tienson Qin Date: Sun, 18 Apr 2021 10:54:37 +0800 Subject: [PATCH] fix: several issues related to graph fixed position: sticky not working on safari --- resources/css/common.css | 1 + src/main/frontend/components/page.cljs | 3 +- .../frontend/components/right_sidebar.cljs | 20 ++++++------ src/main/frontend/components/sidebar.cljs | 6 ++-- src/main/frontend/components/sidebar.css | 6 +--- src/main/frontend/format/block.cljs | 5 ++- src/main/frontend/handler/graph.cljs | 31 +++++++++++++++---- src/main/frontend/state.cljs | 2 +- 8 files changed, 48 insertions(+), 26 deletions(-) diff --git a/resources/css/common.css b/resources/css/common.css index df3c1ea9d..2c86f5e7f 100644 --- a/resources/css/common.css +++ b/resources/css/common.css @@ -68,6 +68,7 @@ html[data-theme='dark'] { --ls-page-inline-code-color: var(--ls-primary-text-color); --ls-page-inline-code-bg-color: #01222a; --ls-scrollbar-foreground-color: rgba(255, 255, 255, 0.05); + --ls-scrollbar-background-color: rgba(30, 60, 67, 0.1); --ls-scrollbar-thumb-hover-color: rgba(255, 255, 255, 0.2); --ls-head-text-color: var(--ls-link-text-color); --ls-icon-color: var(--ls-link-text-color); diff --git a/src/main/frontend/components/page.cljs b/src/main/frontend/components/page.cljs index c16aa695d..727cf1334 100644 --- a/src/main/frontend/components/page.cljs +++ b/src/main/frontend/components/page.cljs @@ -439,6 +439,7 @@ (defonce graph-ref (atom nil)) (defonce show-journal? (atom false)) + (rum/defcs global-graph < rum/reactive (mixins/event-mixin (fn [state] @@ -466,7 +467,7 @@ :ref-atom graph-ref})) [:div.ls-center.mt-20 [:p.opacity-70.font-medium "Empty"]]) - [:div.absolute.top-15.left-5 + [:div.absolute.top-10.left-5 [:div.flex.flex-col [:a.text-sm.font-medium {:on-click (fn [_e] diff --git a/src/main/frontend/components/right_sidebar.cljs b/src/main/frontend/components/right_sidebar.cljs index ad8ee9e29..96da23aba 100644 --- a/src/main/frontend/components/right_sidebar.cljs +++ b/src/main/frontend/components/right_sidebar.cljs @@ -183,7 +183,7 @@ (build-sidebar-item repo idx db-id block-type block-data t))] (when item (let [collapse? (state/sub [:ui/sidebar-collapsed-blocks db-id])] - [:div.sidebar-item.content.color-level.px-4 + [:div.sidebar-item.content.color-level.px-4.shadow-lg (let [[title component] item] [:div.flex.flex-col [:div.flex.flex-row.justify-between @@ -264,10 +264,11 @@ [:div#right-sidebar.cp__right-sidebar.h-screen {:class (if sidebar-open? "open" "closed")} (if sidebar-open? - [:div.cp__right-sidebar-inner.flex.flex-col.h-full + [:div.cp__right-sidebar-inner.flex.flex-col.h-full#right-sidebar-container (sidebar-resizer) - [:div.cp__right-sidebar-topbar.flex.flex-row.justify-between.items-center.px-4.h-12 + [:div + [:div.cp__right-sidebar-topbar.flex.flex-row.justify-between.items-center.px-4.h-12 [:div.cp__right-sidebar-settings.hide-scrollbar {:key "right-sidebar-settings"} [:div.ml-4.text-sm [:a.cp__right-sidebar-settings-btn {:on-click (fn [e] @@ -296,10 +297,11 @@ (t :right-side-bar/help)]]] (when sidebar-open? - [:div.mr-1 {:style {:z-index 999}} + [:div.mr-1.flex.align-items {:style {:z-index 999}} (toggle)])] - [:.sidebar-item-list.flex-1 - (for [[idx [repo db-id block-type block-data]] (medley/indexed blocks)] - (rum/with-key - (sidebar-item repo idx db-id block-type block-data t) - (str "sidebar-block-" idx)))]])]))) + + [:.sidebar-item-list.flex-1 + (for [[idx [repo db-id block-type block-data]] (medley/indexed blocks)] + (rum/with-key + (sidebar-item repo idx db-id block-type block-data t) + (str "sidebar-block-" idx)))]]])]))) diff --git a/src/main/frontend/components/sidebar.cljs b/src/main/frontend/components/sidebar.cljs index 8e278d23f..19eacb89d 100644 --- a/src/main/frontend/components/sidebar.cljs +++ b/src/main/frontend/components/sidebar.cljs @@ -117,6 +117,7 @@ (when (state/sub :ui/left-sidebar-open?) (sidebar-nav route-match nil))] [:div#main-content-container.w-full.flex.justify-center + {:margin-top (if global-graph-pages? 0 "2rem")} [:div.cp__sidebar-main-content {:data-is-global-graph-pages global-graph-pages? :data-is-full-width (or global-graph-pages? @@ -334,7 +335,8 @@ :route-match route-match}) [:div.#app-container.h-screen.flex [:div.flex-1.h-full.flex.flex-col.overflow-y-auto#left-container.relative - [(header/header {:open-fn open-fn + [:div + (header/header {:open-fn open-fn :white? white? :current-repo current-repo :logged? logged? @@ -344,7 +346,6 @@ :default-home default-home :new-block-mode new-block-mode}) - (main {:route-match route-match :global-graph-pages? global-graph-pages? :logged? logged? @@ -356,7 +357,6 @@ :main-content main-content})]] (right-sidebar/sidebar)] - (ui/notification) (ui/modal) (settings-modal settings-open?) diff --git a/src/main/frontend/components/sidebar.css b/src/main/frontend/components/sidebar.css index 37d2f65bc..fc6b6333c 100644 --- a/src/main/frontend/components/sidebar.css +++ b/src/main/frontend/components/sidebar.css @@ -17,7 +17,6 @@ #main-content-container { font-size: 1em; - margin-top: 2rem; padding: 1rem; } @@ -180,10 +179,7 @@ .sidebar-item { padding-top: 24px; padding-bottom: 24px; - - &:first-child { - border-top: none; - } + margin-bottom: 8px; .close { transform: scale(0.8); diff --git a/src/main/frontend/format/block.cljs b/src/main/frontend/format/block.cljs index 89fef1802..415219ebd 100644 --- a/src/main/frontend/format/block.cljs +++ b/src/main/frontend/format/block.cljs @@ -265,7 +265,10 @@ (concat title body)) (let [ref-pages (remove string/blank? @ref-pages) children-pages (->> (mapcat (fn [p] - (if (string/includes? p "/") + (when (and (string/includes? p "/") + (not (string/starts-with? p "../")) + (not (string/starts-with? p "./")) + (not (string/starts-with? p "http"))) ;; Don't create the last page for now (butlast (string/split p #"/")))) ref-pages) diff --git a/src/main/frontend/handler/graph.cljs b/src/main/frontend/handler/graph.cljs index 31fb61828..3d0d18627 100644 --- a/src/main/frontend/handler/graph.cljs +++ b/src/main/frontend/handler/graph.cljs @@ -50,6 +50,19 @@ pages) (remove nil?)))) +(defn- uuid-or-asset? + [id] + (or (util/uuid-string? id) + (string/starts-with? id "../assets/") + (= id "..") + (string/starts-with? id "assets/"))) + +(defn- remove-uuids-and-files! + [nodes] + (remove + (fn [node] (uuid-or-asset? (:id node))) + nodes)) + (defn- normalize-page-name [{:keys [nodes links] :as g}] (let [all-pages (->> (set (apply concat @@ -61,10 +74,15 @@ names (zipmap (map :page/name names) (map (fn [x] (get x :page/original-name (:page/name x))) names)) nodes (mapv (fn [node] (assoc node :id (get names (:id node)))) nodes) - links (mapv (fn [{:keys [source target]}] - {:source (get names source) - :target (get names target)}) - links)] + links (->> + (mapv (fn [{:keys [source target]}] + (when (and (not (uuid-or-asset? source)) + (not (uuid-or-asset? target))) + {:source (get names source) + :target (get names target)})) + links) + (remove nil?)) + nodes (remove-uuids-and-files! nodes)] {:nodes nodes :links links})) @@ -187,5 +205,6 @@ (distinct) ;; FIXME: get block tags (build-nodes dark? block edges #{}))] - {:nodes nodes - :links edges})))) + (normalize-page-name + {:nodes nodes + :links edges}))))) diff --git a/src/main/frontend/state.cljs b/src/main/frontend/state.cljs index 18f9dfd11..75354d167 100644 --- a/src/main/frontend/state.cljs +++ b/src/main/frontend/state.cljs @@ -641,7 +641,7 @@ ; FIXME: No need to call `distinct`? (distinct)))) (open-right-sidebar!) - (when-let [elem (gdom/getElement "right-sidebar")] + (when-let [elem (gdom/getElement "right-sidebar-container")] (util/scroll-to elem 0)))) (defn sidebar-remove-block!