diff --git a/packages/twenty-front/src/modules/object-record/record-show/components/ObjectRecordShowPageBreadcrumb.tsx b/packages/twenty-front/src/modules/object-record/record-show/components/ObjectRecordShowPageBreadcrumb.tsx index 1672c126b4..409a0f387d 100644 --- a/packages/twenty-front/src/modules/object-record/record-show/components/ObjectRecordShowPageBreadcrumb.tsx +++ b/packages/twenty-front/src/modules/object-record/record-show/components/ObjectRecordShowPageBreadcrumb.tsx @@ -11,6 +11,7 @@ import { useRecordShowPagePagination } from '@/object-record/record-show/hooks/u import { getRecordShowPageBreadcrumbPaginationLabel } from '@/object-record/record-show/utils/getRecordShowPageBreadcrumbPaginationLabel'; import { RecordTitleCell } from '@/object-record/record-title-cell/components/RecordTitleCell'; import { RecordTitleCellContainerType } from '@/object-record/record-title-cell/types/RecordTitleCellContainerType'; +import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { styled } from '@linaria/react'; import { useState } from 'react'; import { FieldMetadataType } from 'twenty-shared/types'; @@ -62,6 +63,8 @@ export const ObjectRecordShowPageBreadcrumb = ({ }) => { const [isInitialLoad, setIsInitialLoad] = useState(true); + const isMobile = useIsMobile(); + const { loading } = useFindOneRecord({ objectNameSingular, objectRecordId, @@ -114,17 +117,19 @@ export const ObjectRecordShowPageBreadcrumb = ({ return ( - { - navigateToIndexView(); - }} - > - - - - {objectLabel} - {' / '} - + {!isMobile && ( + { + navigateToIndexView(); + }} + > + + + + {objectLabel} + {' / '} + + )} - - {paginationInformation} - + {!isMobile && ( + + {paginationInformation} + + )} ); }; diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/PageCardHeader.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/PageCardHeader.tsx index c82ae45c50..2eafb4defc 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/components/PageCardHeader.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/components/PageCardHeader.tsx @@ -33,7 +33,7 @@ const StyledHeader = styled.div<{ centerTitle?: boolean }>` grid-template-columns: ${({ centerTitle }) => centerTitle ? 'minmax(0, 1fr) minmax(0, auto) minmax(0, 1fr)' - : 'minmax(0, auto) minmax(0, 1fr)'}; + : 'minmax(0, auto) minmax(min-content, 1fr)'}; min-height: ${SIDE_PANEL_TOP_BAR_HEIGHT}px; padding: 0 ${themeCssVariables.spacing[3]}; width: 100%; @@ -76,7 +76,6 @@ const StyledRight = styled.div<{ centerTitle?: boolean }>` grid-column: ${({ centerTitle }) => (centerTitle ? 3 : 2)}; justify-content: flex-end; justify-self: end; - min-width: 0; width: 100%; `;