From fef342b489978192b7fba0c0a2204214678990d3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marina=20L=C3=B3pez?= <marina.lopez.yap@gmail.com>
Date: Wed, 23 Apr 2025 22:59:07 +0200
Subject: [PATCH] :bug: Fixed team info settings alignment (#6354)

---
 CHANGES.md                                   |  1 +
 frontend/src/app/main/ui/dashboard/team.cljs | 10 +++++-----
 frontend/src/app/main/ui/dashboard/team.scss | 15 ++++++++-------
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index 2488cbb2df..5b28dd8bc3 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -27,6 +27,7 @@
 - Fix problem with import errors [Taiga #10040](https://tree.taiga.io/project/penpot/issue/10040)
 - Fix color gradient on texts [Taiga Issue #7488](https://tree.taiga.io/project/penpot/issue/7488)
 - Add support for self mentions [Taiga #10809](https://tree.taiga.io/project/penpot/issue/10809)
+- Fix team info settings alignment [Taiga #10869](https://tree.taiga.io/project/penpot/issue/10869)
 
 ## 2.6.2 (Unreleased)
 
diff --git a/frontend/src/app/main/ui/dashboard/team.cljs b/frontend/src/app/main/ui/dashboard/team.cljs
index 22a88763b1..fd0fa00184 100644
--- a/frontend/src/app/main/ui/dashboard/team.cljs
+++ b/frontend/src/app/main/ui/dashboard/team.cljs
@@ -1117,10 +1117,6 @@
      [:& 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 :block-label)}
-        (tr "dashboard.team-info")]
-       [:div {:class (stl/css :block-text)}
-        (:name team)]
        [:div {:class (stl/css :team-icon)}
         (when can-edit
           [:button {:class (stl/css :update-overlay)
@@ -1132,7 +1128,11 @@
           [:& file-uploader {:accept "image/jpeg,image/png"
                              :multi false
                              :ref finput
-                             :on-selected on-file-selected}])]]
+                             :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)}
diff --git a/frontend/src/app/main/ui/dashboard/team.scss b/frontend/src/app/main/ui/dashboard/team.scss
index 1bb18c6215..cdb45f06a5 100644
--- a/frontend/src/app/main/ui/dashboard/team.scss
+++ b/frontend/src/app/main/ui/dashboard/team.scss
@@ -27,8 +27,7 @@
 }
 
 .info-block {
-  position: relative;
-  padding-top: $s-180;
+  margin-block-start: $s-16;
 }
 
 .block-label {
@@ -63,12 +62,11 @@
 
 .team-icon {
   --update-button-opacity: 0;
-  position: absolute;
-  top: 0;
-  left: 0;
+  position: relative;
   height: $s-120;
   width: $s-120;
   padding: $s-16;
+  margin-block-end: $s-32;
 
   &:hover {
     --update-button-opacity: 1;
@@ -76,6 +74,9 @@
 }
 
 .team-image {
+  position: absolute;
+  top: 0;
+  left: 0;
   border-radius: 50%;
   width: $s-120;
   height: $s-120;
@@ -86,8 +87,8 @@
   @include buttonStyle;
   @include flexCenter;
   position: absolute;
-  top: $s-16;
-  left: $s-16;
+  top: 0;
+  left: 0;
   height: 100%;
   width: 100%;
   z-index: $z-index-modal;