From 80f49e06ccd931acc9574f05ba9e4997dd8a9106 Mon Sep 17 00:00:00 2001 From: Elhombretecla Date: Wed, 28 Sep 2022 15:54:58 +0200 Subject: [PATCH] :tada: add new css changes --- .../styles/main/partials/dashboard-grid.scss | 21 +++++++------- .../main/partials/dashboard-sidebar.scss | 2 +- .../styles/main/partials/dashboard.scss | 28 ++++++++++++------- .../src/app/main/ui/dashboard/sidebar.cljs | 23 +++++++++------ 4 files changed, 44 insertions(+), 30 deletions(-) diff --git a/frontend/resources/styles/main/partials/dashboard-grid.scss b/frontend/resources/styles/main/partials/dashboard-grid.scss index 4af6e1741..56f7d79e2 100644 --- a/frontend/resources/styles/main/partials/dashboard-grid.scss +++ b/frontend/resources/styles/main/partials/dashboard-grid.scss @@ -103,8 +103,8 @@ h3 { border: 1px solid transparent; color: $color-gray-60; - font-size: $fs16; - font-weight: 400; + font-size: $fs14; + font-weight: 500; overflow: hidden; padding: 0; height: 27px; @@ -120,7 +120,7 @@ } span.date { - color: $color-gray-20; + color: $color-gray-30; font-size: $fs14; overflow: hidden; text-overflow: ellipsis; @@ -146,10 +146,10 @@ .item-badge { background-color: $color-white; border: 1px solid $color-gray-20; - border-radius: 4px; + border-radius: 2px; position: absolute; - top: $size-1; - right: $size-1; + top: $size-2; + right: $size-2; height: 32px; width: 32px; display: flex; @@ -197,7 +197,7 @@ .project-th-actions { align-items: center; - bottom: 2px; + bottom: 14px; opacity: 0; display: flex; right: 5px; @@ -444,10 +444,11 @@ .create-new { background-color: white; border: 2px solid $color-gray-10; - height: 158px; - cursor: pointer; - color: $color-black; border-radius: 3px; + color: $color-black; + cursor: pointer; + height: 158px; + font-family: "worksans", sans-serif; margin: 0.5rem; &:hover { border: 2px solid $color-primary; diff --git a/frontend/resources/styles/main/partials/dashboard-sidebar.scss b/frontend/resources/styles/main/partials/dashboard-sidebar.scss index 8b6107dd1..2d7ee138e 100644 --- a/frontend/resources/styles/main/partials/dashboard-sidebar.scss +++ b/frontend/resources/styles/main/partials/dashboard-sidebar.scss @@ -377,7 +377,7 @@ span { @include text-ellipsis; color: $color-black; - margin: 10px 5px; + margin: 10px; font-size: $fs14; max-width: 160px; } diff --git a/frontend/resources/styles/main/partials/dashboard.scss b/frontend/resources/styles/main/partials/dashboard.scss index fa08c6fc7..281026024 100644 --- a/frontend/resources/styles/main/partials/dashboard.scss +++ b/frontend/resources/styles/main/partials/dashboard.scss @@ -43,9 +43,10 @@ } } .invite { - width: 180px; - height: 40px; align-self: flex-end; + height: 40px; + font-family: "worksans", sans-serif; + width: 180px; } img { width: 274px; @@ -200,7 +201,7 @@ align-items: center; justify-content: flex-start; min-height: 32px; - margin-left: 13px; + margin-left: $size-2; } .show-more { align-items: center; @@ -245,10 +246,11 @@ } .info { - font-size: $fs16; + font-size: $fs14; line-height: 1rem; - font-weight: unset; - color: $color-gray-30; + font-weight: 400; + color: $color-gray-60; + margin-left: .75rem; } .project-actions { @@ -256,8 +258,9 @@ margin-left: $size-6; .btn-small { - padding: $size-2; + height: 32px; margin: 0 $size-2; + width: 32px; } } @@ -287,9 +290,10 @@ } .recent-files-row-title-info { - color: $color-gray-30; + color: $color-gray-60; line-height: 1rem; - font-size: $fs16; + font-size: $fs14; + font-weight: 400; } .dashboard-table { @@ -453,8 +457,12 @@ font-size: 18px; font-weight: 600; color: $color-black; - margin-left: 20px; + margin-left: 18px; margin-right: 10px; + &.icon { + margin-left: 10px; + margin-right: 16px; + } } svg { width: 12px; diff --git a/frontend/src/app/main/ui/dashboard/sidebar.cljs b/frontend/src/app/main/ui/dashboard/sidebar.cljs index eb11a8eda..62fc856ab 100644 --- a/frontend/src/app/main/ui/dashboard/sidebar.cljs +++ b/frontend/src/app/main/ui/dashboard/sidebar.cljs @@ -204,7 +204,7 @@ i/search])])) (mf/defc teams-selector-dropdown - [{:keys [profile] :as props}] + [{:keys [team profile] :as props}] (let [teams (mf/deref refs/teams) on-create-clicked @@ -221,18 +221,23 @@ [:hr] [:li.team-name {:on-click (partial team-selected (:default-team-id profile))} [:span.team-icon i/logo-icon] - [:span.team-text (tr "dashboard.your-penpot")]] + [:span.team-text (tr "dashboard.your-penpot")] + (when (= (:default-team-id profile) (:id team)) + [:span.icon i/tick])] - (for [team (remove :is-default (vals teams))] - [:li.team-name {:on-click (partial team-selected (:id team)) - :key (dm/str (:id team))} + (for [team-item (remove :is-default (vals teams))] + [:li.team-name {:on-click (partial team-selected (:id team-item)) + :key (dm/str (:id team-item))} [:span.team-icon - [:img {:src (cf/resolve-team-photo-url team)}]] - [:span.team-text {:title (:name team)} (:name team)]]) + [:img {:src (cf/resolve-team-photo-url team-item)}]] + [:span.team-text {:title (:name team-item)} (:name team-item)] + (when (= (:id team-item) (:id team)) + [:span.icon i/tick])]) [:hr] - [:li.action {:on-click on-create-clicked :data-test "create-new-team"} - (tr "dashboard.create-new-team")]])) + [:li.team-name.action {:on-click on-create-clicked :data-test "create-new-team"} + [:span.team-icon i/close] + [:span.team-text (tr "dashboard.create-new-team")]]])) (s/def ::member-id ::us/uuid) (s/def ::leave-modal-form