mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-25 12:56:41 +07:00
fixed text editor appearance
This commit is contained in:
parent
a37bc76965
commit
57f90ee46b
5 changed files with 19 additions and 6 deletions
|
@ -17,6 +17,7 @@ type IProps = typeof mapDispatchToProps & {};
|
||||||
|
|
||||||
const SubmitBarUnconnected: FC<IProps> = ({ nodeCreate }) => {
|
const SubmitBarUnconnected: FC<IProps> = ({ nodeCreate }) => {
|
||||||
const onOpenImageEditor = useCallback(() => nodeCreate(NODE_TYPES.IMAGE), [nodeCreate]);
|
const onOpenImageEditor = useCallback(() => nodeCreate(NODE_TYPES.IMAGE), [nodeCreate]);
|
||||||
|
const onOpenTextEditor = useCallback(() => nodeCreate(NODE_TYPES.TEXT), [nodeCreate]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.wrap}>
|
<div className={styles.wrap}>
|
||||||
|
@ -24,6 +25,10 @@ const SubmitBarUnconnected: FC<IProps> = ({ nodeCreate }) => {
|
||||||
<div onClick={onOpenImageEditor}>
|
<div onClick={onOpenImageEditor}>
|
||||||
<Icon icon="image" />
|
<Icon icon="image" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div onClick={onOpenTextEditor}>
|
||||||
|
<Icon icon="image" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={styles.button}>
|
<div className={styles.button}>
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
padding-bottom: 60px;
|
& > div {
|
||||||
|
padding-bottom: 64px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -13,12 +13,14 @@ import { EditorPanel } from '~/components/editors/EditorPanel';
|
||||||
import * as NODE_ACTIONS from '~/redux/node/actions';
|
import * as NODE_ACTIONS from '~/redux/node/actions';
|
||||||
import { selectUploads } from '~/redux/uploads/selectors';
|
import { selectUploads } from '~/redux/uploads/selectors';
|
||||||
import { ERROR_LITERAL } from '~/constants/errors';
|
import { ERROR_LITERAL } from '~/constants/errors';
|
||||||
import { NODE_EDITORS } from '~/redux/node/constants';
|
import { NODE_EDITORS, EMPTY_NODE } from '~/redux/node/constants';
|
||||||
|
|
||||||
const mapStateToProps = state => {
|
const mapStateToProps = state => {
|
||||||
const { editor, errors } = selectNode(state);
|
const { editor, errors } = selectNode(state);
|
||||||
const { statuses, files } = selectUploads(state);
|
const { statuses, files } = selectUploads(state);
|
||||||
|
|
||||||
|
console.log('mss', { editor });
|
||||||
|
|
||||||
return { editor, statuses, files, errors };
|
return { editor, statuses, files, errors };
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -41,9 +43,11 @@ const EditorDialogUnconnected: FC<IProps> = ({
|
||||||
onRequestClose,
|
onRequestClose,
|
||||||
type,
|
type,
|
||||||
}) => {
|
}) => {
|
||||||
const [data, setData] = useState(editor);
|
const [data, setData] = useState(EMPTY_NODE);
|
||||||
const [temp, setTemp] = useState([]);
|
const [temp, setTemp] = useState([]);
|
||||||
|
|
||||||
|
useEffect(() => setData(editor), [editor]);
|
||||||
|
|
||||||
const setTitle = useCallback(
|
const setTitle = useCallback(
|
||||||
title => {
|
title => {
|
||||||
setData({ ...data, title });
|
setData({ ...data, title });
|
||||||
|
@ -53,10 +57,12 @@ const EditorDialogUnconnected: FC<IProps> = ({
|
||||||
|
|
||||||
const onSubmit = useCallback(
|
const onSubmit = useCallback(
|
||||||
(event: FormEvent) => {
|
(event: FormEvent) => {
|
||||||
|
console.log({ data, editor });
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
return;
|
||||||
nodeSave(data);
|
nodeSave(data);
|
||||||
},
|
},
|
||||||
[data, nodeSave]
|
[data, nodeSave, editor]
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
@ -44,7 +44,7 @@ const setTags = (state: INodeState, { tags }: ReturnType<typeof nodeSetTags>) =>
|
||||||
assocPath(['current', 'tags'], tags, state);
|
assocPath(['current', 'tags'], tags, state);
|
||||||
|
|
||||||
const setEditor = (state: INodeState, { editor }: ReturnType<typeof nodeSetEditor>) =>
|
const setEditor = (state: INodeState, { editor }: ReturnType<typeof nodeSetEditor>) =>
|
||||||
assocPath(['current', 'editor'], editor, state);
|
assocPath(['editor'], editor, state);
|
||||||
|
|
||||||
export const NODE_HANDLERS = {
|
export const NODE_HANDLERS = {
|
||||||
[NODE_ACTIONS.SET_SAVE_ERRORS]: setSaveErrors,
|
[NODE_ACTIONS.SET_SAVE_ERRORS]: setSaveErrors,
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
|
|
||||||
&.focused {
|
&.focused {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
z-index: 999;
|
// z-index: 999;
|
||||||
|
|
||||||
&.has_status .status {
|
&.has_status .status {
|
||||||
flex-basis: 0;
|
flex-basis: 0;
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue