From a291d431058c7fa193ad58eb6a87217270d55d27 Mon Sep 17 00:00:00 2001
From: syam babu <syam@dexlock.com>
Date: Mon, 26 Feb 2024 13:12:12 +0530
Subject: [PATCH 1/4] fix: closes #955. fixed issue with stretched images in
 listing page

---
 src/components/List/ListItem.jsx/ListItem.jsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/List/ListItem.jsx/ListItem.jsx b/src/components/List/ListItem.jsx/ListItem.jsx
index a4164428..45a3245b 100644
--- a/src/components/List/ListItem.jsx/ListItem.jsx
+++ b/src/components/List/ListItem.jsx/ListItem.jsx
@@ -6,7 +6,6 @@ import { LinkOutlined } from '@ant-design/icons';
 import moment from 'moment-timezone';
 import i18n from 'i18next';
 import Username from '../../Username/Username';
-
 import ArtsDataLink from '../../Tags/ArtsDataLink/ArtsDataLink';
 
 function ListItem(props) {
@@ -45,7 +44,7 @@ function ListItem(props) {
               <img
                 src={logo}
                 className="event-list-image"
-                style={{ height: '40px', width: '40px' }}
+                style={{ height: '40px', width: '40px', objectFit: 'cover' }}
                 data-cy="image-entity-logo"
               />
             </div>

From 281393bbce714fe627ef4a4cc572228fe172a4af Mon Sep 17 00:00:00 2001
From: syam babu <syam@dexlock.com>
Date: Mon, 26 Feb 2024 18:51:25 +0530
Subject: [PATCH 2/4] fix: updated image fit from cover to contain to avoid
 image stretching

---
 src/components/List/ListItem.jsx/ListItem.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/List/ListItem.jsx/ListItem.jsx b/src/components/List/ListItem.jsx/ListItem.jsx
index 45a3245b..aee102db 100644
--- a/src/components/List/ListItem.jsx/ListItem.jsx
+++ b/src/components/List/ListItem.jsx/ListItem.jsx
@@ -44,7 +44,7 @@ function ListItem(props) {
               <img
                 src={logo}
                 className="event-list-image"
-                style={{ height: '40px', width: '40px', objectFit: 'cover' }}
+                style={{ height: '40px', width: '40px', objectFit: 'contain' }}
                 data-cy="image-entity-logo"
               />
             </div>

From 0f3e6f96092286a00ce25316d09e53584980923a Mon Sep 17 00:00:00 2001
From: syam babu <syam@dexlock.com>
Date: Tue, 27 Feb 2024 16:59:05 +0530
Subject: [PATCH 3/4] fix: reverted back to object-fit cover fot list item
 images

---
 src/components/List/ListItem.jsx/ListItem.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/List/ListItem.jsx/ListItem.jsx b/src/components/List/ListItem.jsx/ListItem.jsx
index aee102db..45a3245b 100644
--- a/src/components/List/ListItem.jsx/ListItem.jsx
+++ b/src/components/List/ListItem.jsx/ListItem.jsx
@@ -44,7 +44,7 @@ function ListItem(props) {
               <img
                 src={logo}
                 className="event-list-image"
-                style={{ height: '40px', width: '40px', objectFit: 'contain' }}
+                style={{ height: '40px', width: '40px', objectFit: 'cover' }}
                 data-cy="image-entity-logo"
               />
             </div>

From 49229f6c9b618cc63779aeb1e167222782c25b48 Mon Sep 17 00:00:00 2001
From: syam babu <syam@dexlock.com>
Date: Tue, 27 Feb 2024 19:06:06 +0530
Subject: [PATCH 4/4] fix: added object-fit cover to images in read-only page

---
 .../Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx   | 2 +-
 src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx           | 2 +-
 src/pages/Dashboard/PlaceReadOnly/PlaceReadOnly.jsx             | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx b/src/pages/Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx
index 1e768aaa..9d799d9f 100644
--- a/src/pages/Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx
+++ b/src/pages/Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx
@@ -523,7 +523,7 @@ function OrganizationsReadOnly() {
                     src={organizationData?.logo?.original?.uri}
                     alt="avatar"
                     style={{
-                      objectFit: 'cover',
+                      objectFit: 'contain',
                       width: '151px',
                       height: '151px',
                     }}
diff --git a/src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx b/src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx
index 58c416ef..6dd158db 100644
--- a/src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx
+++ b/src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx
@@ -421,7 +421,7 @@ function PersonReadOnly() {
                         style={{
                           width: '151px',
                           height: '151px',
-                          objectFit: 'cover',
+                          objectFit: 'contain',
                         }}
                         data-cy="image-person-original"
                       />
diff --git a/src/pages/Dashboard/PlaceReadOnly/PlaceReadOnly.jsx b/src/pages/Dashboard/PlaceReadOnly/PlaceReadOnly.jsx
index bdb620cc..bd7649eb 100644
--- a/src/pages/Dashboard/PlaceReadOnly/PlaceReadOnly.jsx
+++ b/src/pages/Dashboard/PlaceReadOnly/PlaceReadOnly.jsx
@@ -427,7 +427,7 @@ function PlaceReadOnly() {
                     style={{
                       width: '151px',
                       height: '151px',
-                      objectFit: 'cover',
+                      objectFit: 'contain',
                     }}
                   />
                 </div>