From 47de75608011f299824c53818ba25559fc5bc6a8 Mon Sep 17 00:00:00 2001
From: Juan de la Cruz <juan.delacruz@kaleidos.net>
Date: Mon, 9 Mar 2020 11:54:35 +0100
Subject: [PATCH] refactor dashboard sidebar

---
 .../styles/main/partials/dashboard-bar.scss   |  3 +-
 .../styles/main/partials/library-bar.scss     | 39 ++++++++++++++++---
 .../src/uxbox/main/ui/dashboard/projects.cljs | 15 +++++--
 3 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/frontend/resources/styles/main/partials/dashboard-bar.scss b/frontend/resources/styles/main/partials/dashboard-bar.scss
index 093a8af921..2694e95810 100644
--- a/frontend/resources/styles/main/partials/dashboard-bar.scss
+++ b/frontend/resources/styles/main/partials/dashboard-bar.scss
@@ -65,8 +65,9 @@
       background: $color-gray-50;
       cursor: pointer;
       display: flex;
-      height: 28px;
+      height: 22px;
       padding: 0 5px;
+      width: 22px;
 
       svg {
         fill: $color-gray-30;
diff --git a/frontend/resources/styles/main/partials/library-bar.scss b/frontend/resources/styles/main/partials/library-bar.scss
index 645eacd909..d5301b3f6d 100644
--- a/frontend/resources/styles/main/partials/library-bar.scss
+++ b/frontend/resources/styles/main/partials/library-bar.scss
@@ -60,11 +60,20 @@
       padding-bottom: 20px;
 
       li {
+        align-items: center;
         cursor: pointer;
         display: flex;
-        flex-direction: column;
         flex-shrink: 0;
-        padding: $small $medium;
+        padding: $medium $small;
+
+        svg {
+          border-radius: 3px;
+          fill: $color-black;
+          height: 24px;
+          margin-right: $small;
+          padding: $x-small;
+          width: 24px;
+        }
 
         span.element-title {
           color: $color-gray-60;
@@ -76,7 +85,15 @@
   
         &.recent-projects {
           border-top: 1px solid $color-gray-10;
-          border-bottom: 1px solid $color-gray-10;
+          
+          svg {
+            background-color: $color-black;
+            fill: $color-white;
+          }
+          
+          span {
+            font-size: $fs15;
+          }
         }
 
         input.element-title {
@@ -110,6 +127,10 @@
 
         &.current {
 
+          svg {
+            fill: $color-black;
+          }
+
           span.element-title,
           .element-subtitle {
             color: $color-gray-60;
@@ -151,8 +172,8 @@
 
     svg {
       fill: $color-gray-60;
-      height: 16px;
-      width: 16px;
+      height: 13px;
+      width: 13px;
     }
 
     &:hover {
@@ -182,12 +203,18 @@
     width: 100%;
   }
 
+  &:focus,
+  &:focus-within {
+    border-color: $color-black;
+  }
+
   .clear-search {
     align-items: center;
     cursor: pointer;
     display: flex;
-    height: 28px;
+    height: 22px;
     padding: 0 5px;
+    width: 22px;
 
     svg {
       fill: $color-gray-30;
diff --git a/frontend/src/uxbox/main/ui/dashboard/projects.cljs b/frontend/src/uxbox/main/ui/dashboard/projects.cljs
index 1dbb1c28c8..2e67d2cda7 100644
--- a/frontend/src/uxbox/main/ui/dashboard/projects.cljs
+++ b/frontend/src/uxbox/main/ui/dashboard/projects.cljs
@@ -200,15 +200,22 @@
       [:ul.library-elements
        [:li.recent-projects #_{:on-click #(st/emit! (udp/go-to-project nil))
                                :class-name (when (nil? id) "current")}
-        [:span.element-title "Recent"]]
+        i/user
+        [:span.element-title "Personal"]]
 
-       [:li.recent-projects {:on-click #(st/emit! (udp/go-to-project nil))
+       [:li {:on-click #(st/emit! (udp/go-to-project nil))
                              :class-name (when (nil? id) "current")}
+        i/file-html
         [:span.element-title "Drafts"]]
 
+       [:li {:on-click #(st/emit! (udp/go-to-project nil))
+                             :class-name (when (nil? id) "current")}
+        i/icon-set
+        [:span.element-title "Libraries"]]
+
        [:div.projects-row
-        [:span "PROJECTS/TEAMS TODO"]
-        #_[:a.add-project {:on-click #(st/emit! udp/create-project)}
+        [:span "PROJECTS"]
+        [:a.add-project {:on-click #(st/emit! udp/create-project)}
          i/close]]
 
        #_(for [item projects]