Fix task badge icon size (#10162)

This commit is contained in:
Ashish Gupta 2023-02-10 10:43:58 +05:30 committed by GitHub
parent f33430c533
commit b6e6deed9a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 18 additions and 10 deletions

View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="360" height="360" fill="none"><path fill="#7147E8" d="M259.568 122.885c5.494 5.493 5.494 14.397 0 19.888l-94.339 94.342c-5.493 5.491-14.395 5.491-19.888 0l-44.909-44.912c-5.494-5.49-5.494-14.395 0-19.885 5.49-5.493 14.394-5.493 19.885 0l34.967 34.967 84.396-84.4c5.494-5.491 14.398-5.491 19.888 0ZM360 180c0 99.495-80.519 180-180 180C80.505 360 0 279.481 0 180 0 80.505 80.519 0 180 0c99.495 0 180 80.519 180 180Zm-28.125 0c0-83.95-67.937-151.875-151.875-151.875C96.05 28.125 28.125 96.062 28.125 180c0 83.949 67.937 151.875 151.875 151.875 83.949 0 151.875-67.937 151.875-151.875Z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 360" fill="none"><path fill="#7147E8" d="M259.568 122.885c5.494 5.493 5.494 14.397 0 19.888l-94.339 94.342c-5.493 5.491-14.395 5.491-19.888 0l-44.909-44.912c-5.494-5.49-5.494-14.395 0-19.885 5.49-5.493 14.394-5.493 19.885 0l34.967 34.967 84.396-84.4c5.494-5.491 14.398-5.491 19.888 0ZM360 180c0 99.495-80.519 180-180 180C80.505 360 0 279.481 0 180 0 80.505 80.519 0 180 0c99.495 0 180 80.519 180 180Zm-28.125 0c0-83.95-67.937-151.875-151.875-151.875C96.05 28.125 28.125 96.062 28.125 180c0 83.949 67.937 151.875 151.875 151.875 83.949 0 151.875-67.937 151.875-151.875Z"/></svg>

Before

Width:  |  Height:  |  Size: 637 B

After

Width:  |  Height:  |  Size: 634 B

View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="361" height="361" fill="none"><path fill="#7147E8" fill-rule="evenodd" d="M.134 180.133c0-99.41 80.589-180 180-180 99.412 0 180 80.59 180 180 0 99.413-80.588 180-180 180-99.411 0-180-80.587-180-180Zm180-152.307c-84.117 0-152.308 68.19-152.308 152.307 0 84.118 68.19 152.308 152.308 152.308s152.307-68.19 152.307-152.308c0-84.117-68.189-152.307-152.307-152.307Zm0 193.846c22.941 0 41.539-18.598 41.539-41.539 0-22.941-18.598-41.538-41.539-41.538-22.941 0-41.538 18.597-41.538 41.538 0 22.941 18.597 41.539 41.538 41.539Z" clip-rule="evenodd"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 361 361" fill="none"><path fill="#7147E8" fill-rule="evenodd" d="M.134 180.133c0-99.41 80.589-180 180-180 99.412 0 180 80.59 180 180 0 99.413-80.588 180-180 180-99.411 0-180-80.587-180-180Zm180-152.307c-84.117 0-152.308 68.19-152.308 152.307 0 84.118 68.19 152.308 152.308 152.308s152.307-68.19 152.307-152.308c0-84.117-68.189-152.307-152.307-152.307Zm0 193.846c22.941 0 41.539-18.598 41.539-41.539 0-22.941-18.598-41.538-41.539-41.538-22.941 0-41.538 18.597-41.538 41.538 0 22.941 18.597 41.539 41.538 41.539Z" clip-rule="evenodd"/></svg>

Before

Width:  |  Height:  |  Size: 595 B

After

Width:  |  Height:  |  Size: 592 B

View File

@ -42,6 +42,10 @@
}
.task-badge {
position: absolute;
left: 16px;
top: -12px;
padding: 0 8px;
background: #f1edfd;
border: 1px solid #c6b5f6;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.06);

View File

@ -11,12 +11,14 @@
* limitations under the License.
*/
import { Popover } from 'antd';
import Icon from '@ant-design/icons';
import { Popover, Space, Typography } from 'antd';
import { isEqual } from 'lodash';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { ReactComponent as IconTaskClose } from '../../../assets/svg/complete.svg';
import { ReactComponent as IconTaskOpen } from '../../../assets/svg/in-progress.svg';
import { ThreadTaskStatus } from '../../../generated/entity/feed/thread';
import SVGIcons, { Icons } from '../../../utils/SvgUtils';
import './Badge.less';
const TaskBadge = ({ status }: { status: ThreadTaskStatus }) => {
@ -34,14 +36,16 @@ const TaskBadge = ({ status }: { status: ThreadTaskStatus }) => {
overlayClassName="ant-popover-task-status"
trigger="hover"
zIndex={9999}>
<span className="tw-px-2 tw-absolute tw-left-4 tw--top-3 tw-flex task-badge">
<SVGIcons
<Space align="center" className="task-badge" size={4}>
<Icon
alt="task-status"
icon={isTaskOpen ? Icons.TASK_OPEN : Icons.TASK_CLOSED}
width="12px"
component={isTaskOpen ? IconTaskOpen : IconTaskClose}
style={{ fontSize: '12px' }}
/>
<span className="tw-pl-1">{t('label.task')}</span>
</span>
<Typography.Text className="text-primary">
{t('label.task')}
</Typography.Text>
</Space>
</Popover>
);
};