Skip to content

Commit 2306464

Browse files
megayumegayu
committed
feat(page): improve error screen layout and styling for better user experience
1 parent c54c54b commit 2306464

2 files changed

Lines changed: 74 additions & 64 deletions

File tree

‎src/main/frontend/page.cljs‎

Lines changed: 73 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -37,69 +37,79 @@
3737
[:div#left-container
3838
[:div#main-container.cp__sidebar-main-layout.flex-1.flex
3939
[:div#main-content-container.scrollbar-spacing.w-full.flex.justify-center
40-
[:div.cp__sidebar-main-content
41-
[:div.ls-center
42-
[:div.icon-box.p-1.rounded.mb-3 (ui/icon "bug" {:style {:font-size ui/icon-size}})]
43-
[:div.text-xl.font-bold
44-
(t :page/something-went-wrong)]
45-
[:div.mt-2.mb-2 (t :page/logseq-is-having-a-problem)]
46-
[:div
47-
;; TODO: Enable once multi-window case doesn't result in possible data loss
48-
#_[:div.flex.flex-row.justify-between.align-items.mb-2
49-
[:div.flex.flex-col.items-start
50-
[:div.text-2xs.uppercase (t :page/step "1")]
51-
[:div [:span.font-bold (t :plugin/reload)] (str " " (t :page/the-app))]]
52-
[:div (ui/icon "command") (ui/icon "letter-r")]]
53-
[:div.flex.flex-row.justify-between.align-items.mb-2.items-center.py-4
54-
[:div.flex.flex-col.items-start
55-
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "1")]
56-
[:div [:span.highlighted.font-bold (t :page/rebuild)] [:span.toned-down (str " " (t :page/search-index))]]]
57-
[:div
58-
(ui/button (t :page/try)
59-
:small? true
60-
:on-click (fn []
61-
(search-handler/rebuild-indices! true)))]]
62-
[:div.flex.flex-row.justify-between.align-items.mb-2.items-center.separator-top.py-4
63-
[:div.flex.flex-col.items-start
64-
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "2")]
65-
[:div [:span.highlighted.font-bold (t :page/relaunch)] [:span.toned-down (str " " (t :page/the-app))]]]
66-
[:div.text-xs.toned-down (t :page/relaunch-desc)]]
67-
[:div (shui/shortcut ["cmd" (if (util/electron?) "q" "r")])]]
68-
[:div.flex.flex-row.justify-between.align-items.mb-4.items-center.separator-top.py-4
69-
[:div.flex.flex-col.items-start.mr-2
70-
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "3")]
71-
[:div [:span.highlighted.font-bold (t :ui/export)] [:span.toned-down (str " " (t :page/current-graph-as-sqlite-db))]]
72-
[:div.text-xs.toned-down (t :page/send-db-for-debugging)]
73-
[:a#download-as-sqlite-db.hidden]]
74-
[:div
75-
(ui/button (t :export/graph)
76-
:small? true
77-
:on-click #(export/export-repo-as-sqlite-db! current-repo))]]
78-
79-
[:div.flex.flex-row.justify-between.align-items.mb-4.items-center.separator-top.py-4
80-
[:div.flex.flex-col.items-start
81-
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "4")]
82-
[:div [:span.highlighted.font-bold (t :page/clear)] [:span.toned-down (str " " (t :page/local-storage))]]
83-
[:div.text-xs.toned-down (t :page/clear-local-storage-desc)]]
84-
[:div
85-
(ui/button (t :page/try)
86-
:small? true
87-
:on-click (fn []
88-
(.clear js/localStorage)
89-
(notification/show! (t :page/cleared) :success)))]]]
90-
[:div
91-
[:p
92-
(interpolate-sentence
93-
(t :page/open-all-graphs-desc)
94-
:links
95-
[{:on-click (fn []
96-
(set! (.-href js/window.location) (rfe/href :graphs))
97-
(.reload js/window.location))}])]
98-
[:p
99-
(interpolate-sentence
100-
(t :page/open-issue-desc)
101-
:links
102-
[{:href "https://github.com/logseq/logseq/issues/new?labels=from:in-app&template=bug_report.yaml"}])]]]]]]]
40+
[:div.cp__sidebar-main-content
41+
[:div.flex.justify-center.px-4.py-10.sm:px-6.sm:py-14
42+
[:div.w-full.max-w-3xl.flex.flex-col.gap-10.sm:gap-14
43+
[:div.w-full.max-w-2xl.mx-auto
44+
[:div.flex.flex-col.items-start.gap-3.mb-6
45+
[:div.icon-box.p-1.rounded (ui/icon "bug" {:style {:font-size ui/icon-size}})]
46+
[:div.text-2xl.font-bold (t :page/something-went-wrong)]
47+
[:div.text-lg.leading-8 (t :page/logseq-is-having-a-problem)]]
48+
[:div
49+
;; TODO: Enable once multi-window case doesn't result in possible data loss
50+
#_[:div.flex.flex-row.justify-between.align-items.mb-2
51+
[:div.flex.flex-col.items-start
52+
[:div.text-2xs.uppercase (t :page/step "1")]
53+
[:div [:span.font-bold (t :plugin/reload)] (str " " (t :page/the-app))]]
54+
[:div (ui/icon "command") (ui/icon "letter-r")]]
55+
[:div.flex.flex-col.gap-4.sm:flex-row.sm:items-center.sm:justify-between.py-4
56+
[:div.flex.flex-col.items-start.pr-4
57+
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "1")]
58+
[:div.leading-8
59+
[:span.highlighted.font-bold (t :page/rebuild)]
60+
[:span.toned-down (str " " (t :page/search-index))]]]
61+
[:div.sm:self-start
62+
(ui/button (t :page/try)
63+
:small? true
64+
:on-click (fn []
65+
(search-handler/rebuild-indices! true)))]]
66+
[:div.flex.flex-col.gap-4.sm:flex-row.sm:items-center.sm:justify-between.separator-top.py-4
67+
[:div.flex.flex-col.items-start.pr-4
68+
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "2")]
69+
[:div.leading-8
70+
[:span.highlighted.font-bold (t :page/relaunch)]
71+
[:span.toned-down (str " " (t :page/the-app))]]
72+
[:div.text-xs.leading-6.toned-down (t :page/relaunch-desc)]]
73+
[:div.sm:self-start
74+
(shui/shortcut ["cmd" (if (util/electron?) "q" "r")])]]
75+
[:div.flex.flex-col.gap-4.sm:flex-row.sm:items-center.sm:justify-between.separator-top.py-4
76+
[:div.flex.flex-col.items-start.pr-4
77+
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "3")]
78+
[:div.leading-8
79+
[:span.highlighted.font-bold (t :ui/export)]
80+
[:span.toned-down (str " " (t :page/current-graph-as-sqlite-db))]]
81+
[:div.text-xs.leading-6.toned-down (t :page/send-db-for-debugging)]
82+
[:a#download-as-sqlite-db.hidden]]
83+
[:div.sm:self-start
84+
(ui/button (t :export/graph)
85+
:small? true
86+
:on-click #(export/export-repo-as-sqlite-db! current-repo))]]
87+
[:div.flex.flex-col.gap-4.sm:flex-row.sm:items-center.sm:justify-between.separator-top.py-4
88+
[:div.flex.flex-col.items-start.pr-4
89+
[:div.text-2xs.font-bold.uppercase.toned-down (t :page/step "4")]
90+
[:div.leading-8
91+
[:span.highlighted.font-bold (t :page/clear)]
92+
[:span.toned-down (str " " (t :page/local-storage))]]
93+
[:div.text-xs.leading-6.toned-down (t :page/clear-local-storage-desc)]]
94+
[:div.sm:self-start
95+
(ui/button (t :page/try)
96+
:small? true
97+
:on-click (fn []
98+
(.clear js/localStorage)
99+
(notification/show! (t :page/cleared) :success)))]]]
100+
[:div.max-w-2xl.mx-auto.mt-6.space-y-2.text-base.leading-8
101+
[:p.m-0
102+
(interpolate-sentence
103+
(t :page/open-all-graphs-desc)
104+
:links
105+
[{:on-click (fn []
106+
(set! (.-href js/window.location) (rfe/href :graphs))
107+
(.reload js/window.location))}])]
108+
[:p.m-0
109+
(interpolate-sentence
110+
(t :page/open-issue-desc)
111+
:links
112+
[{:href "https://github.com/logseq/logseq/issues/new?labels=from:in-app&template=bug_report.yaml"}])]]]]]]]]]]
103113
(ui/notification)]))
104114

105115
(rum/defc not-found

‎src/resources/dicts/zh-cn.edn‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -548,7 +548,7 @@
548548
:page/open-issue-desc "如果以上故障排除步骤无法解决您的问题，请 {{提交一个 issue}}。"
549549
:page/open-properties "展开属性"
550550
:page/rebuild "重建"
551-
:page/relaunch "重新启动"
551+
:page/relaunch "重启"
552552
:page/relaunch-desc "退出并重新打开应用。"
553553
:page/scheduled-and-deadline "计划与截止日期"
554554
:page/search-index "搜索索引"

0 commit comments

Comments
 (0)