diff --git a/frontend/src/component/changeRequest/ChangeRequests/ChangeRequests.tsx b/frontend/src/component/changeRequest/ChangeRequests/ChangeRequests.tsx
index 6c5a884227..ebcf6b8392 100644
--- a/frontend/src/component/changeRequest/ChangeRequests/ChangeRequests.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequests/ChangeRequests.tsx
@@ -45,6 +45,7 @@ const StyledPaginatedTable = styled(
td: {
verticalAlign: 'top',
+ maxWidth: '250px',
},
}));
@@ -105,7 +106,7 @@ const ChangeRequestsInner = () => {
columnHelper.accessor('id', {
id: 'Title',
header: 'Title',
- meta: { width: '300px' },
+ meta: { width: '35%' },
cell: GlobalChangeRequestTitleCell,
}),
columnHelper.accessor('features', {
@@ -134,20 +135,20 @@ const ChangeRequestsInner = () => {
columnHelper.accessor('createdBy', {
id: 'By',
header: 'By',
- meta: { width: '180px', align: 'left' },
+ meta: { width: '10%' },
enableSorting: false,
cell: ({ getValue }) => ,
}),
columnHelper.accessor('createdAt', {
id: 'Submitted',
header: 'Submitted',
- meta: { width: '100px' },
+ meta: { width: '5%' },
cell: ({ getValue }) => ,
}),
columnHelper.accessor('environment', {
id: 'Environment',
header: 'Environment',
- meta: { width: '100px' },
+ meta: { width: '10%' },
cell: ({ getValue }) => (
),
@@ -155,7 +156,7 @@ const ChangeRequestsInner = () => {
columnHelper.accessor('state', {
id: 'Status',
header: 'Status',
- meta: { width: '170px' },
+ meta: { width: '10%' },
cell: ({ getValue, row }) => (
),
diff --git a/frontend/src/component/changeRequest/ChangeRequests/GlobalChangeRequestTitleCell.tsx b/frontend/src/component/changeRequest/ChangeRequests/GlobalChangeRequestTitleCell.tsx
index af356ded93..b065fb97da 100644
--- a/frontend/src/component/changeRequest/ChangeRequests/GlobalChangeRequestTitleCell.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequests/GlobalChangeRequestTitleCell.tsx
@@ -57,7 +57,7 @@ export const GlobalChangeRequestTitleCell = ({
const crPath = `${projectPath}/change-requests/${id}`;
return (
-
+
{projectName}
diff --git a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/FeaturesCell.tsx b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/FeaturesCell.tsx
index 57946fe545..14482abfe4 100644
--- a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/FeaturesCell.tsx
+++ b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/FeaturesCell.tsx
@@ -1,16 +1,15 @@
import { Box, styled } from '@mui/material';
import { Link } from 'react-router-dom';
-import type { VFC } from 'react';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { TooltipLink } from 'component/common/TooltipLink/TooltipLink';
import { useSearchHighlightContext } from 'component/common/Table/SearchHighlightContext/SearchHighlightContext';
import { Highlighter } from 'component/common/Highlighter/Highlighter';
import { Truncator } from 'component/common/Truncator/Truncator';
+import type { FC } from 'react';
const StyledBox = styled(Box)(({ theme }) => ({
display: 'flex',
flexDirection: 'column',
- width: '300px',
padding: theme.spacing(1, 0, 1, 2),
}));
@@ -41,7 +40,7 @@ interface FeaturesCellProps {
project: string;
}
-export const FeaturesCell: VFC = ({ value, project }) => {
+export const FeaturesCell: FC = ({ value, project }) => {
const { searchQuery } = useSearchHighlightContext();
const featureNames = value?.map((feature: any) => feature.name);
return (