3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-19 06:06:10 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Improve dashboard and onboarding css

Browse source
This commit is contained in:
Eva 2022-08-03 13:38:17 +02:00
parent 390ad34b13
commit e863ef7dbf
11 changed files with 149 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

36
frontend/src/app/main/ui/dashboard/files.cljs
View file

@ -6,6 +6,7 @@
(ns app.main.ui.dashboard.files
(:require
[app.common.math :as mth]
[app.main.data.dashboard :as dd]
[app.main.data.events :as ev]
[app.main.refs :as refs]
@ -16,6 +17,8 @@
[app.main.ui.icons :as i]
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
[app.util.webapi :as wapi]
[beicon.core :as rx]
[cuerdas.core :as str]
[rumext.alpha :as mf]))
@ -93,6 +96,17 @@
(mf/defc files-section
[{:keys [project team] :as props}]
(let [files-map (mf/deref refs/dashboard-files)
width (mf/use-state nil)
rowref (mf/use-ref)
itemsize (if (>= @width 1030)
280
230)
ratio (if (some? @width) (/ @width itemsize) 0)
nitems (mth/floor ratio)
limit (min 10 nitems)
limit (max 1 limit)
files (->> (vals files-map)
(filter #(= (:id project) (:project-id %)))
(sort-by :modified-at)
@ -104,6 +118,23 @@
(dom/prevent-default event)
(st/emit! (with-meta (dd/create-file {:project-id (:id project)})
{::ev/origin origin}))))]
(mf/use-effect
(fn []
(let [node (mf/ref-val rowref)
mnt? (volatile! true)
sub (->> (wapi/observe-resize node)
(rx/observe-on :af)
(rx/subs (fn [entries]
(let [row (first entries)
row-rect (.-contentRect ^js row)
row-width (.-width ^js row-rect)]
(when @mnt?
(reset! width row-width))))))]
(fn []
(vreset! mnt? false)
(rx/dispose! sub)))))
(mf/use-effect
(mf/deps project)
@ -123,9 +154,10 @@
[:*
[:& header {:team team :project project
:on-create-clicked on-create-clicked}]
[:section.dashboard-container.no-bg
[:section.dashboard-container.no-bg {:ref rowref}
[:& grid {:project project
:files files
:on-create-clicked on-create-clicked
:origin :files}]]]))
:origin :files
:limit limit}]]]))