github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-04-28 12:48:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨ Center team settings properly (#7021)

Browse Source
This commit is contained in:
Elena Torró 2025-08-01 15:17:32 +02:00 committed by GitHub
parent 8d5ee92f16
commit f519c6ef46
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 57 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
frontend/src/app/main/ui/dashboard/team.cljs
View File

@ -1137,53 +1137,54 @@
[:*
[:& header {:section :dashboard-team-settings :team team}]
[:section {:class (stl/css :dashboard-team-settings)}
[:div {:class (stl/css :block :info-block)}
[:div {:class (stl/css :team-icon)}
(when can-edit
[:button {:class (stl/css :update-overlay)
:on-click on-image-click}
image-icon])
[:img {:class (stl/css :team-image)
:src (cfg/resolve-team-photo-url team)}]
(when can-edit
[:& file-uploader {:accept "image/jpeg,image/png"
:multi false
:ref finput
:on-selected on-file-selected}])]
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-info")]
[:div {:class (stl/css :block-text)}
(:name team)]]
[:div {:class (stl/css :settings-container)}
[:div {:class (stl/css :block :info-block)}
[:div {:class (stl/css :team-icon)}
(when can-edit
[:button {:class (stl/css :update-overlay)
:on-click on-image-click}
image-icon])
[:img {:class (stl/css :team-image)
:src (cfg/resolve-team-photo-url team)}]
(when can-edit
[:& file-uploader {:accept "image/jpeg,image/png"
:multi false
:ref finput
:on-selected on-file-selected}])]
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-info")]
[:div {:class (stl/css :block-text)}
(:name team)]]
[:div {:class (stl/css :block)}
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-members")]
[:div {:class (stl/css :block)}
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-members")]
[:div {:class (stl/css :block-content)}
[:img {:class (stl/css :owner-icon)
:src (cfg/resolve-profile-photo-url owner)}]
[:span {:class (stl/css :block-text)}
(str (:name owner) " (" (tr "labels.owner") ")")]]
[:div {:class (stl/css :block-content)}
[:img {:class (stl/css :owner-icon)
:src (cfg/resolve-profile-photo-url owner)}]
[:span {:class (stl/css :block-text)}
(str (:name owner) " (" (tr "labels.owner") ")")]]
[:div {:class (stl/css :block-content)}
user-icon
[:span {:class (stl/css :block-text)}
(tr "dashboard.num-of-members" (count members))]]]
[:div {:class (stl/css :block-content)}
user-icon
[:span {:class (stl/css :block-text)}
(tr "dashboard.num-of-members" (count members))]]]
[:div {:class (stl/css :block)}
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-projects")]
[:div {:class (stl/css :block)}
[:div {:class (stl/css :block-label)}
(tr "dashboard.team-projects")]
[:div {:class (stl/css :block-content)}
group-icon
[:span {:class (stl/css :block-text)}
(tr "labels.num-of-projects" (i18n/c (dec (:projects stats))))]]
[:div {:class (stl/css :block-content)}
group-icon
[:span {:class (stl/css :block-text)}
(tr "labels.num-of-projects" (i18n/c (dec (:projects stats))))]]
[:div {:class (stl/css :block-content)}
document-icon
[:span {:class (stl/css :block-text)}
(tr "labels.num-of-files" (i18n/c (:files stats)))]]]
[:div {:class (stl/css :block-content)}
document-icon
[:span {:class (stl/css :block-text)}
(tr "labels.num-of-files" (i18n/c (:files stats)))]]]
(when (contains? cfg/flags :subscriptions)
[:> team* {:is-owner (:is-owner permissions) :team team}])]]))
(when (contains? cfg/flags :subscriptions)
[:> team* {:is-owner (:is-owner permissions) :team team}])]]]))

20
frontend/src/app/main/ui/dashboard/team.scss
View File

@ -12,11 +12,18 @@
display: flex;
flex-direction: column;
align-items: center;
gap: $s-24;
width: 100%;
border-top: $s-1 solid var(--panel-border-color);
overflow-y: auto;
padding-inline: $s-24;
padding-inline-start: $s-20;
padding-block-start: $s-20;
}
.settings-container {
display: flex;
flex-direction: column;
align-items: center;
gap: $s-24;
}
.block {
@ -355,16 +362,17 @@
gap: $s-24;
width: 100%;
height: 100%;
padding-top: $s-16;
padding-inline-start: $s-20;
padding-block-start: $s-20;
border-top: $s-1 solid var(--panel-border-color);
overflow-y: auto;
}
.webhooks-hero-container {
display: grid;
gap: $s-32;
max-width: $s-1000;
width: $s-1000;
grid-template-rows: auto 1fr;
margin: $s-80 auto $s-20 auto;
gap: $s-24;
}
.webhooks-empty {