mirror of
https://github.com/penpot/penpot.git
synced 2025-05-22 23:16:10 +02:00
add projects search styles
This commit is contained in:
parent
b131dea579
commit
5d0e57acb7
2 changed files with 37 additions and 18 deletions
|
@ -28,22 +28,44 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-search {
|
.dashboard-search {
|
||||||
cursor: pointer;
|
align-items: center;
|
||||||
margin-left: $big;
|
display: flex;
|
||||||
|
margin-left: $small;
|
||||||
|
|
||||||
svg {
|
.input-text {
|
||||||
fill: $color-gray-dark;
|
background: rgba(255,255,255,.4);
|
||||||
height: 20px;
|
border: 0;
|
||||||
width: 20px;
|
color: $dark-ui-text;
|
||||||
|
padding: 4px 8px;
|
||||||
|
margin: 0;
|
||||||
|
max-width: 160px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.clear-search {
|
||||||
|
align-items: center;
|
||||||
|
background: rgba(255,255,255,.4);
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
height: 28px;
|
||||||
|
padding: 0 5px;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
fill: $light-ui-icons;
|
||||||
|
height: 15px;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
width: 15px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
fill: $color-danger;
|
||||||
|
}
|
||||||
|
|
||||||
&:hover {
|
|
||||||
fill: $color-gray-darker;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
&.library-gap {
|
&.library-gap {
|
||||||
padding: $small $medium $small 270px;
|
padding: $small $medium $small 270px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -192,16 +192,16 @@
|
||||||
(let [change-term #(rs/emit! (dd/set-project-filtering (.-value (.-target %))))
|
(let [change-term #(rs/emit! (dd/set-project-filtering (.-value (.-target %))))
|
||||||
clear-term #(rs/emit! (dd/clear-project-filtering))]
|
clear-term #(rs/emit! (dd/clear-project-filtering))]
|
||||||
(html
|
(html
|
||||||
[:form
|
[:form.dashboard-search
|
||||||
[:input
|
[:input.input-text
|
||||||
{:type "text"
|
{:type "text"
|
||||||
:on-change change-term
|
:on-change change-term
|
||||||
:auto-focus true
|
:auto-focus true
|
||||||
|
:placeholder "Search..."
|
||||||
:value (rum/react project-filtering-l)}]
|
:value (rum/react project-filtering-l)}]
|
||||||
[:input
|
[:div.clear-search
|
||||||
{:type "button"
|
{:on-click clear-term}
|
||||||
:on-click clear-term
|
i/close]])))
|
||||||
:value "X"}]])))
|
|
||||||
|
|
||||||
(def project-search
|
(def project-search
|
||||||
(mx/component
|
(mx/component
|
||||||
|
@ -218,9 +218,7 @@
|
||||||
[:div.dashboard-info
|
[:div.dashboard-info
|
||||||
[:span.dashboard-projects (tr "ds.num-projects" (t/c pcount))]
|
[:span.dashboard-projects (tr "ds.num-projects" (t/c pcount))]
|
||||||
(project-sorting)
|
(project-sorting)
|
||||||
(project-search)]
|
(project-search)]])))
|
||||||
[:div.dashboard-search
|
|
||||||
i/search]])))
|
|
||||||
|
|
||||||
(def menu
|
(def menu
|
||||||
(mx/component
|
(mx/component
|
||||||
|
@ -299,4 +297,3 @@
|
||||||
{:render grid-render
|
{:render grid-render
|
||||||
:name "grid"
|
:name "grid"
|
||||||
:mixins [rum/reactive]}))
|
:mixins [rum/reactive]}))
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue