css fixes

Author: shivani170

src/Common/ClipboardButton/ClipboardButton.tsx

@@ -47,7 +47,7 @@ export default function ClipboardButton({
     const handleDisableTippy = () => setEnableTippy(false)
     const handleCopyContent = useCallback(
         (e?) => {
-            stopPropagation(e)
+           if(e) stopPropagation(e)
             copyToClipboard(content, handleTextCopied)
         },
         [content],

src/Shared/Components/ArtifactInfoModal/ArtifactInfoModal.component.tsx

@@ -99,7 +99,12 @@ const ArtifactInfoModal = ({
                         {isArtifactInfoAvailable ? (
                             <div className="select-material p-16 flexbox-col dc__gap-12">
                                 {artifactInfo.materials.map((material) => (
-                                    <MaterialHistory material={material} pipelineName="" key={material.id} />
+                                    <MaterialHistory
+                                        material={material}
+                                        pipelineName=""
+                                        key={material.id}
+                                        isCommitInfoModal
+                                    />
                                 ))}
                                 <div className="dc__dashed_icon_grid-container">
                                     <hr className="dc__dotted-line" />

src/Shared/Components/GitCommitInfoGeneric/GitCommitInfoGeneric.tsx

@@ -246,7 +246,7 @@ const GitCommitInfoGeneric = ({
                                             </div>
                                         </a>
                                         <span
-                                            className="git-commit-info-generic__copy dc__visibility-hidden"
+                                            className="git-commit-info-generic__copy dc__visibility-hidden p-2"
                                             data-testid="git-commit-copy"
                                         >
                                             <ClipboardButton content={_lowerCaseCommitInfo.commit} />
@@ -261,7 +261,9 @@ const GitCommitInfoGeneric = ({
                                 data-testid={`${_lowerCaseCommitInfo.message.trim()}-${isExcluded ? 'excluded' : 'included'}`}
                                 className="material-history__text lh-20 flex left dc__gap-8 top material-history-text--padded dc__word-break-all"
                             >
-                                <span className="fs-13 fw-6 lh-20 cn-9">{_lowerCaseCommitInfo.message}</span>
+                                <span className="fs-13 fw-6 lh-20 cn-9 dc__ellipsis-right__3rd-line">
+                                    {_lowerCaseCommitInfo.message}
+                                </span>
                             </div>
                         ) : null}
                         <div className="flexbox-col dc__gap-4">

src/Shared/Components/GitCommitInfoGeneric/GitMaterialInfoHeader.tsx

@@ -48,7 +48,10 @@ const GitMaterialInfoHeader = ({
         >
             <div className={getGitIcon(repoUrl)} />
             <div className="flex left left dc__gap-4 fs-13">
-                <div className="repo cn-9 fw-6" data-testid={`deployment-history-source-code-repo${index}`}>
+                <div
+                    className="repo cn-9 fw-6 dc__mxw-250 dc__ellipsis-right"
+                    data-testid={`deployment-history-source-code-repo${index}`}
+                >
                     {repo}
                 </div>
                 <div className="branch flex left cn-7 dc__gap-4">

src/Shared/Components/MaterialHistory/MaterialHistory.component.tsx

@@ -18,7 +18,13 @@ import { SourceTypeMap } from '../../../Common'
 import { GitCommitInfoGeneric } from '../GitCommitInfoGeneric'
 import { MaterialHistoryProps } from './types'
 
-const MaterialHistory = ({ material, pipelineName, ciPipelineId, selectCommit }: MaterialHistoryProps) => {
+const MaterialHistory = ({
+    material,
+    pipelineName,
+    ciPipelineId,
+    selectCommit,
+    isCommitInfoModal,
+}: MaterialHistoryProps) => {
     const onClickMaterialHistory = (e, _commitId, isExcluded) => {
         e.stopPropagation()
         if (selectCommit && !isExcluded) {
@@ -53,10 +59,12 @@ const MaterialHistory = ({ material, pipelineName, ciPipelineId, selectCommit }:
                 const historyList = materialHistoryMapWithTime[date]
                 return (
                     <>
-                        <div className="flex left dc__gap-8">
-                            <span className="fs-12 lh-18 cn-7 fw-6 w-126">{date}</span>
-                            <div className="h-1 bcn-2 w-100" />
-                        </div>
+                        {!isCommitInfoModal && (
+                            <div className="flex left dc__gap-8">
+                                <span className="fs-12 lh-18 cn-7 fw-6 w-126">{date}</span>
+                                <div className="h-1 bcn-2 w-100" />
+                            </div>
+                        )}
 
                         {historyList?.map((history, index) => {
                             const _commitId =
@@ -68,7 +76,7 @@ const MaterialHistory = ({ material, pipelineName, ciPipelineId, selectCommit }:
                                 <div
                                     data-testid={`material-history-${index}`}
                                     key={_commitId}
-                                    className={`material-history w-auto cursor ${history.isSelected ? 'material-history-selected' : ''}`}
+                                    className={`material-history w-auto cursor ${!history.excluded && !isCommitInfoModal ? 'cursor material-history__box-shadow' : ''} ${history.isSelected ? 'material-history-selected' : ''}`}
                                     onClick={(e) => onClickMaterialHistory(e, _commitId, history.excluded)}
                                 >
                                     <GitCommitInfoGeneric

src/Shared/Components/MaterialHistory/types.ts

@@ -21,4 +21,5 @@ export interface MaterialHistoryProps {
     pipelineName: string
     ciPipelineId?: string
     selectCommit?: (materialId: string, commit: string, ciPipelineId?: string) => void
+    isCommitInfoModal?: boolean
 }