From 4d293a4d7728898523efb62993ed4de7f3b1bcc8 Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Mon, 20 Sep 2021 13:32:34 +0300
Subject: [PATCH] fix icons
---
editors/demo/src/Editors.js | 2 +-
.../src/components/ToolGroupComponent.js | 2 +-
.../ExpandedFindAndReplaceComponent.js | 10 ++-----
.../trackChanges/TrackChangesBox.js | 28 +++++++++++--------
.../src/helpers/Icon.js | 1 -
wax-prosemirror-components/src/icons/icons.js | 7 +++++
6 files changed, 28 insertions(+), 22 deletions(-)
diff --git a/editors/demo/src/Editors.js b/editors/demo/src/Editors.js
index 977ed5cc4..fa52e3550 100644
--- a/editors/demo/src/Editors.js
+++ b/editors/demo/src/Editors.js
@@ -54,7 +54,7 @@ const Editors = () => {
case 'ncbi':
break;
default:
- return <HHMI />;
+ return <Editoria />;
}
};
diff --git a/wax-prosemirror-components/src/components/ToolGroupComponent.js b/wax-prosemirror-components/src/components/ToolGroupComponent.js
index 48d71f905..cce0f8b1c 100644
--- a/wax-prosemirror-components/src/components/ToolGroupComponent.js
+++ b/wax-prosemirror-components/src/components/ToolGroupComponent.js
@@ -5,8 +5,8 @@ import styled from 'styled-components';
import Dropdown from '../ui/buttons/Dropdown';
const Wrapper = styled.div`
- display: inline-flex;
align-items: center;
+ display: inline-flex;
padding: 0 4px;
> button,
diff --git a/wax-prosemirror-components/src/components/findAndReplace/ExpandedFindAndReplaceComponent.js b/wax-prosemirror-components/src/components/findAndReplace/ExpandedFindAndReplaceComponent.js
index 37436a96a..d5f2f5b36 100644
--- a/wax-prosemirror-components/src/components/findAndReplace/ExpandedFindAndReplaceComponent.js
+++ b/wax-prosemirror-components/src/components/findAndReplace/ExpandedFindAndReplaceComponent.js
@@ -1,12 +1,6 @@
/* eslint react/prop-types: 0 */
-import React, {
- useState,
- useRef,
- useContext,
- useCallback,
- useEffect,
-} from 'react';
-import { each, eachRight, debounce } from 'lodash';
+import React, { useState, useRef, useContext, useEffect } from 'react';
+import { each, eachRight } from 'lodash';
import { WaxContext } from 'wax-prosemirror-core';
import { DocumentHelpers } from 'wax-prosemirror-utilities';
import styled from 'styled-components';
diff --git a/wax-prosemirror-components/src/components/trackChanges/TrackChangesBox.js b/wax-prosemirror-components/src/components/trackChanges/TrackChangesBox.js
index d385794bb..b1717efc3 100644
--- a/wax-prosemirror-components/src/components/trackChanges/TrackChangesBox.js
+++ b/wax-prosemirror-components/src/components/trackChanges/TrackChangesBox.js
@@ -3,9 +3,7 @@ import React from 'react';
import styled, { css } from 'styled-components';
import DateParser from '../../helpers/DateParser';
-import icons from '../../icons/icons';
-
-const { check, times } = icons;
+import Icon from '../../helpers/Icon';
const activeBorder = css`
border-color: #bfc4cd;
@@ -63,9 +61,18 @@ const ActionWrapper = styled.div`
margin-bottom: 5px;
`;
+const StyledIcon = styled(Icon)`
+ bottom: 2px;
+ cursor: pointer;
+ height: 16px;
+ position: relative;
+ right: 2px;
+ width: 16px;
+`;
+
const Text = styled.span``;
-const Icon = styled.div`
+const Icons = styled.div`
border-radius: 3px;
display: inline-block;
height: 20px;
@@ -80,17 +87,16 @@ const Icon = styled.div`
const IconButton = props => {
// eslint-disable-next-line react/prop-types
- const { icon, onClick } = props;
-
+ const { name, onClick } = props;
const handleClick = e => {
e.stopPropagation();
onClick();
};
return (
- <Icon onClick={handleClick} type="button">
- {icon}
- </Icon>
+ <Icons onClick={handleClick} type="button">
+ <StyledIcon name={name.toString()} />
+ </Icons>
);
};
@@ -170,8 +176,8 @@ const TrackChangesBox = props => {
</Info>
{active && (
<Tools>
- <IconButton icon={check} onClick={onClickAccept} />
- <IconButton icon={times} onClick={onClickReject} />
+ <IconButton name="checkTrack" onClick={onClickAccept} />
+ <IconButton name="reject" onClick={onClickReject} />
</Tools>
)}
</HeadWrapper>
diff --git a/wax-prosemirror-components/src/helpers/Icon.js b/wax-prosemirror-components/src/helpers/Icon.js
index 0fedb3d64..5fe228cab 100644
--- a/wax-prosemirror-components/src/helpers/Icon.js
+++ b/wax-prosemirror-components/src/helpers/Icon.js
@@ -9,7 +9,6 @@ import icons from '../icons/icons';
const SVGIcon = props => {
const { className, name } = props;
-
const Component = icons[name];
return <Component className={className} />;
};
diff --git a/wax-prosemirror-components/src/icons/icons.js b/wax-prosemirror-components/src/icons/icons.js
index 2df0c38b4..73859b955 100644
--- a/wax-prosemirror-components/src/icons/icons.js
+++ b/wax-prosemirror-components/src/icons/icons.js
@@ -261,6 +261,13 @@ export default {
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
</Svg>
),
+ reject: ({ className }) => (
+ <Svg className={className} fill="none" viewBox="0 0 24 24">
+ <title> Reject </title>
+ <path d="M0 0h24v24H0V0z" fill="none" />
+ <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
+ </Svg>
+ ),
removeTag: ({ className }) => (
<Svg className={className} fill="none" viewBox="0 0 24 24">
<title> remove tag </title>
--
GitLab