diff --git a/webapp/src/components/boardCard.tsx b/webapp/src/components/boardCard.tsx index 9664ae0b5..ad780846a 100644 --- a/webapp/src/components/boardCard.tsx +++ b/webapp/src/components/boardCard.tsx @@ -11,6 +11,8 @@ import mutator from '../mutator' import MenuWrapper from '../widgets/menuWrapper' import Menu from '../widgets/menu' import OptionsIcon from '../widgets/icons/options' +import DeleteIcon from '../widgets/icons/delete' +import DuplicateIcon from '../widgets/icons/duplicate' import PropertyValueElement from './propertyValueElement' @@ -89,11 +91,13 @@ class BoardCard extends React.Component {
} id='delete' name={intl.formatMessage({id: 'BoardCard.delete', defaultMessage: 'Delete'})} onClick={() => mutator.deleteBlock(card, 'delete card')} /> } id='duplicate' name={intl.formatMessage({id: 'BoardCard.duplicate', defaultMessage: 'Duplicate'})} onClick={() => mutator.insertBlock(MutableBlock.duplicate(card), 'duplicate card')} diff --git a/webapp/src/widgets/icons/delete.scss b/webapp/src/widgets/icons/delete.scss new file mode 100644 index 000000000..f3971ef38 --- /dev/null +++ b/webapp/src/widgets/icons/delete.scss @@ -0,0 +1,6 @@ +.DeleteIcon { + fill: rgba(var(--main-fg), 0.7); + stroke: none; + width: 24px; + height: 24px; +} diff --git a/webapp/src/widgets/icons/delete.tsx b/webapp/src/widgets/icons/delete.tsx new file mode 100644 index 000000000..8c4f098a3 --- /dev/null +++ b/webapp/src/widgets/icons/delete.tsx @@ -0,0 +1,20 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import React from 'react' + +import './delete.scss' + +export default function DeleteIcon(): JSX.Element { + return ( + + + + ) +} diff --git a/webapp/src/widgets/icons/duplicate.scss b/webapp/src/widgets/icons/duplicate.scss new file mode 100644 index 000000000..a6ac80689 --- /dev/null +++ b/webapp/src/widgets/icons/duplicate.scss @@ -0,0 +1,6 @@ +.DuplicateIcon { + fill: rgba(var(--main-fg), 0.7); + stroke: none; + width: 24px; + height: 24px; +} diff --git a/webapp/src/widgets/icons/duplicate.tsx b/webapp/src/widgets/icons/duplicate.tsx new file mode 100644 index 000000000..39c683ab7 --- /dev/null +++ b/webapp/src/widgets/icons/duplicate.tsx @@ -0,0 +1,20 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import React from 'react' + +import './duplicate.scss' + +export default function DuplicateIcon(): JSX.Element { + return ( + + + + ) +} diff --git a/webapp/src/widgets/menu/menu.scss b/webapp/src/widgets/menu/menu.scss index cc6cc45f9..303deaad5 100644 --- a/webapp/src/widgets/menu/menu.scss +++ b/webapp/src/widgets/menu/menu.scss @@ -47,5 +47,10 @@ .SubmenuTriangleIcon { fill: rgba(var(--main-fg), 0.7); } + .Icon { + width: 16px; + height: 16px; + margin-right: 3px; + } } } diff --git a/webapp/src/widgets/menu/textOption.tsx b/webapp/src/widgets/menu/textOption.tsx index 80784b32f..227c990b6 100644 --- a/webapp/src/widgets/menu/textOption.tsx +++ b/webapp/src/widgets/menu/textOption.tsx @@ -20,8 +20,8 @@ export default class TextOption extends React.PureComponent { className='MenuOption TextOption menu-option' onClick={this.handleOnClick} > -
{name}
{icon} +
{name}
) }