-
Notifications
You must be signed in to change notification settings - Fork 95
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Display of spans #223
Comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi everyone
I am using draft-convert package for converting draft-js editor state to html and conversely.
convertFromHTML:
export const myConvertFromHTML = (html, metadata = {}) => {
return convertFromHTML({
htmlToStyle: (nodeName, node, currentStyle) => {
if (node.style.textAlign) {
if (node.style.fontSize) {
return currentStyle
.add(
ALIGN_${node.style.textAlign.toUpperCase()}
).add(
fontsize-${node.style.fontSize.replace(/px$/g, '')}
);} else {
return currentStyle.add(
ALIGN_${node.style.textAlign.toUpperCase()}
,);
}
}
})(html);
};
export const myConvertToHTML = contentState => {
return convertToHTML({
blockToHTML: block => {
let element;
let wrapperElement;
switch (block.type) {
case 'ordered-list-item':
element = 'li';
wrapperElement = 'ol';
break;
case 'unordered-list-item':
element = 'li';
wrapperElement = 'ul';
break;
case 'header-one':
element = 'h1';
break;
case 'header-two':
element = 'h2';
break;
case 'header-three':
element = 'h3';
break;
case 'header-four':
element = 'h4';
break;
case 'header-five':
element = 'h5';
break;
case 'header-six':
element = 'h6';
break;
default:
element = 'p';
break;
}
let finalHtml = '';
})(contentState);
};
These are my convertors. I want to check the style of each character in each block. So I create a span with specific styles for each character and put all the spans in one p tag.
But when the p tag has text alignment style. The result gives text alignment to all spans and makes display of them block. Therefore, each span is shown on separate lines.
Does anyone have an idea to solve this problem?
The text was updated successfully, but these errors were encountered: