diff --git a/frontend/resources/locales.json b/frontend/resources/locales.json index f07eae849..903ebc0e7 100644 --- a/frontend/resources/locales.json +++ b/frontend/resources/locales.json @@ -460,6 +460,16 @@ "es" : "+ Nuevo proyecto" } }, + "dashboard.title-search" : { + "used-in" : [ "src/app/main/ui/dashboard/search.cljs:37" ], + "translations" : { + "en" : "Search results", + "fr" : "Résultats de recherche", + "ru" : "Результаты поиска", + "es" : "Resultados de búsqueda" + } + }, + "dashboard.no-matches-for" : { "used-in" : [ "src/app/main/ui/dashboard/search.cljs:48" ], "translations" : { diff --git a/frontend/resources/styles/main/partials/dashboard-sidebar.scss b/frontend/resources/styles/main/partials/dashboard-sidebar.scss index 1b649be29..d2803a37d 100644 --- a/frontend/resources/styles/main/partials/dashboard-sidebar.scss +++ b/frontend/resources/styles/main/partials/dashboard-sidebar.scss @@ -56,7 +56,7 @@ display: flex; width: 100%; border: 1px solid $color-gray-10; - border-radius: 6px; + border-radius: $br-medium; align-items: center; } @@ -254,13 +254,14 @@ .sidebar-search { align-items: center; + background-color: $color-white; border: 1px solid $color-gray-10; - border-radius: 4px; + border-radius: $br-medium; display: flex; margin: 5px 15px; .input-text { - background: $color-white; + background: transparent; border: 0; color: $color-gray-60; font-size: $fs14; diff --git a/frontend/src/app/main/ui/dashboard/search.cljs b/frontend/src/app/main/ui/dashboard/search.cljs index eeb4aff63..0360983fa 100644 --- a/frontend/src/app/main/ui/dashboard/search.cljs +++ b/frontend/src/app/main/ui/dashboard/search.cljs @@ -17,6 +17,7 @@ [okulary.core :as l] [rumext.alpha :as mf])) + (def result-ref (l/derived (l/in [:dashboard-local :search-result]) st/state)) @@ -30,23 +31,28 @@ (st/emitf (dd/search-files {:team-id (:id team) :search-term search-term}))) - [:section.dashboard-container.search - (cond - (empty? search-term) - [:div.grid-empty-placeholder - [:div.icon i/search] - [:div.text (t locale "dashboard.type-something")]] + [:* + [:header.dashboard-header + [:div.dashboard-title + [:h1 (t locale "dashboard.title-search")]]] - (nil? result) - [:div.grid-empty-placeholder - [:div.icon i/search] - [:div.text (t locale "dashboard.searching-for" search-term)]] + [:section.dashboard-container.search + (cond + (empty? search-term) + [:div.grid-empty-placeholder + [:div.icon i/search] + [:div.text (t locale "dashboard.type-something")]] - (empty? result) - [:div.grid-empty-placeholder - [:div.icon i/search] - [:div.text (t locale "dashboard.no-matches-for" search-term)]] + (nil? result) + [:div.grid-empty-placeholder + [:div.icon i/search] + [:div.text (t locale "dashboard.searching-for" search-term)]] - :else - [:& grid {:files result - :hide-new? true}])])) + (empty? result) + [:div.grid-empty-placeholder + [:div.icon i/search] + [:div.text (t locale "dashboard.no-matches-for" search-term)]] + + :else + [:& grid {:files result + :hide-new? true}])]]))