Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-08 16:18:11 -05:00
Code Issues Activity

🐛 Show lens icon in search dashboard

Browse source
This commit is contained in:
alonso.torres 2021-01-28 14:56:46 +01:00
parent fd620a858c
commit 81480f203d
2 changed files with 22 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
frontend/resources/styles/main/partials/dashboard-sidebar.scss
View file

@ -277,7 +277,7 @@
border-color: $color-black;
}
.clear-search {
.search, .clear-search {
align-items: center;
cursor: pointer;
display: flex;
@ -289,7 +289,6 @@
svg {
fill: $color-gray-30;
height: 15px;
transform: rotate(45deg);
width: 15px;
&:hover {
@ -297,6 +296,10 @@
}
}
}
.clear-search svg {
transform: rotate(45deg);
}
}
&.profile-bar {

20
frontend/src/app/main/ui/dashboard/sidebar.cljs
View file

@ -75,12 +75,14 @@
(mf/defc sidebar-search
[{:keys [search-term team-id locale] :as props}]
(let [search-term (or search-term "")
focused? (mf/use-state false)
emit! (mf/use-memo #(f/debounce st/emit! 500))
on-search-focus
(mf/use-callback
(mf/deps team-id)
(fn [event]
(reset! focused? true)
(let [target (dom/get-target event)
value (dom/get-value target)]
(dom/select-text! target)
@ -88,6 +90,11 @@
(emit! (rt/nav :dashboard-search {:team-id team-id} {}))
(emit! (rt/nav :dashboard-search {:team-id team-id} {:search-term value}))))))
on-search-blur
(mf/use-callback
(fn [event]
(reset! focused? false)))
on-search-change
(mf/use-callback
(mf/deps team-id)
@ -114,11 +121,18 @@
:default-value search-term
:auto-complete "off"
:on-focus on-search-focus
:on-blur on-search-blur
:on-change on-search-change
:ref #(when % (set! (.-value %) search-term))}]
[:div.clear-search
{:on-click on-clear-click}
i/close]]))
(if (or @focused? (not (empty? search-term)))
[:div.clear-search
{:on-click on-clear-click}
i/close]
[:div.search
{:on-click on-clear-click}
i/search])]))
(mf/defc teams-selector-dropdown
[{:keys [team profile locale] :as props}]