article details icon change

Author: Rohit0301

openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.component.tsx

@@ -12,21 +12,21 @@
  */
 
 import {
-    Badge,
-    Box,
-    Button,
-    ButtonUtility,
-    Card,
-    Dot,
-    Dropdown,
-    Skeleton,
-    Tabs,
-    Tooltip,
-    TooltipTrigger,
-    Typography,
+  Badge,
+  Box,
+  Button,
+  ButtonUtility,
+  Card,
+  Dot,
+  Dropdown,
+  Skeleton,
+  Tabs,
+  Tooltip,
+  TooltipTrigger,
+  Typography,
 } from '@openmetadata/ui-core-components';
 import {
-    UploadCloud01,
+  UploadCloud01,
 } from '@untitledui/icons';
 import { AxiosError } from 'axios';
 import classNames from 'classnames';
@@ -65,8 +65,8 @@ import { useApplicationStore } from '../../../hooks/useApplicationStore';
 import { useEntityRules } from '../../../hooks/useEntityRules';
 import { useFqn } from '../../../hooks/useFqn';
 import {
-    ContentChangeState,
-    RecentlyViewedQuickLinks,
+  ContentChangeState,
+  RecentlyViewedQuickLinks,
 } from '../../../interface/knowledge-center.interface';
 import { deleteKnowledgePage } from '../../../rest/knowledgeCenterAPI';
 import contextCenterClassBase from '../../../utils/ContextCenterClassBase';
@@ -397,9 +397,9 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                       onUpdate={handleDomainSave}>
                       <ButtonUtility
                         className="tw:p-1"
-                        color="secondary"
+                        color="tertiary"
                         data-testid="edit-domain-btn"
-                        icon={<EditIcon height={11} width={11} className="tw:text-gray-500 tw:hover:text-gray-600" />}
+                        icon={<EditIcon height={14} width={14} />}
                         tooltip={t('label.edit-entity', {
                           entity: t('label.domain'),
                         })}
@@ -454,9 +454,9 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                       onUpdate={handleOwnerSave}>
                       <ButtonUtility
                         className="tw:p-1"
-                        color="secondary"
+                        color="tertiary"
                         data-testid="edit-owner-btn"
-                        icon={<EditIcon height={11} width={11} className="tw:text-gray-500 tw:hover:text-gray-600" />}
+                        icon={<EditIcon height={14} width={14} />}
                         tooltip={t('label.edit-entity', {
                           entity: t('label.owner-plural'),
                         })}
@@ -534,12 +534,12 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                   disabled={knowledgePage?.deleted || voteLoading !== null}
                   icon={
                     voteStatus === QueryVoteType.votedUp ? <ThumbsUpActiveIcon
-                      height={18}
-                      width={18}
+                      height={20}
+                      width={20}
                     /> :
                     <ThumbsUpIcon
-                      height={18}
-                      width={18}
+                      height={20}
+                      width={20}
                     />
                   }
                   tooltip={t('label.up-vote')}
@@ -558,12 +558,12 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                   disabled={knowledgePage?.deleted || voteLoading !== null}
                   icon={
                      voteStatus === QueryVoteType.votedDown ? <ThumbsDownActiveIcon
-                      height={18}
-                      width={18}
+                      height={20}
+                      width={20}
                     /> :
                     <ThumbsDownIcon
-                      height={18}
-                      width={18}
+                      height={20}
+                      width={20}
                     />
                   }
                   tooltip={t('label.down-vote')}
@@ -574,7 +574,7 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                 <ButtonUtility
                   color="tertiary"
                   data-testid="conversation"
-                  icon={<ChatIcon height={18} width={18} />}
+                  icon={<ChatIcon height={20} width={20} />}
                   tooltip={t('label.conversation')}
                   onClick={handleOpenConversation}
                 />
@@ -584,7 +584,7 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
                 color="tertiary"
                 data-testid="follow-btn"
                 disabled={isFollowLoading || knowledgePage?.deleted}
-                icon={isFollowing ? <FollowActiveIcon height={18} width={18} /> : <FollowIcon height={18} width={18} /> }
+                icon={isFollowing ? <FollowActiveIcon height={20} width={20} /> : <FollowIcon height={20} width={20} /> }
                 tooltip={isFollowing ? t('label.un-follow') : t('label.follow')}
                 onClick={handleFollowClick}
               />
@@ -593,15 +593,15 @@ const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
               color="tertiary"
               testId="copy-btn"
               url={window.location.href}>
-              <CopyIcon height={18} width={18} />
+              <CopyIcon height={20} width={20} />
             </CopyLinkButton>
 
             {permissions?.Delete && (
               <Dropdown.Root>
                  <ButtonUtility
                   color="tertiary"
                   data-testid="edit-memory-btn"
-                  icon={ <DotsVerticalIcon height={18} width={18} />}
+                  icon={ <DotsVerticalIcon height={20} width={20} />}
                   size="sm"
                   tooltip={t('label.manage-entity', {
                               entity: t('label.article'),