Fixed minor style issues (#7315)

Author: bilalabbad

changelog/IFC-1780.fixed.md

@@ -0,0 +1,4 @@
+- Consistent font size for all events in the Proposed Change timeline
+- Proposed Change action buttons now keep their size and does not strectch anymore
+- Prevent overflow on the create new relationship button within the relationship input
+- fixed typos

frontend/app/src/entities/events/ui/event-card.tsx

@@ -59,7 +59,7 @@ export const EventCard = (props: EventType) => {
       <TimelineBorder />
 
       <div className="flex grow gap-3 rounded-md border border-gray-200 bg-white p-2 shadow-xs">
-        <div className="flex grow flex-col gap-2">
+        <div className="flex grow flex-col gap-2 text-sm">
           {getEventComponent(props)}
 
           <div className="flex justify-between text-gray-500">

frontend/app/src/entities/events/ui/proposed-change-events/proposed-change-event-title.tsx

@@ -43,7 +43,7 @@ export const ProposedChangeEventTitle = (props: ProposedChangeEventTitleProps) =
 
   if (event === PROPOSED_CHANGE_APPROVALS_REVOKED) {
     return (
-      <div className="text-gray-600">Changes occured in the source branch, approval revoked</div>
+      <div className="text-gray-600">Changes occurred in the source branch, approval revoked</div>
     );
   }
 

frontend/app/src/entities/nodes/relationships/ui/add-relationship-action.tsx

@@ -26,7 +26,7 @@ export const AddRelationshipAction: React.FC<AddRelationshipActionProps> = ({
         className="w-full border border-custom-blue-700/20 bg-custom-blue-700/10 text-custom-blue-700 enabled:hover:bg-custom-blue-700/20"
         onClick={() => setOpen(!open)}
       >
-        + Add new {schema.label}
+        + Add new <span className="truncate">{schema.label}</span>
       </Button>
 
       <SlideOver

frontend/app/src/entities/proposed-changes/ui/proposed-change-details.tsx

@@ -164,7 +164,7 @@ export const ProposedChangeDetails = ({ className, ...props }: HTMLAttributes<HT
         </Card>
       )}
 
-      <div className={classNames("grid grid-cols-3 gap-2", className)} {...props}>
+      <div className={classNames("grid grid-cols-3 items-start gap-2", className)} {...props}>
         <div className="col-start-1 col-end-3 space-y-2">
           {proposedChangesDetails?.description?.value && (
             <CardWithBorder contentClassName="" data-testid="pc-description">