Support for color property

It seems that the color property could not convert from docx. <span style="#ff0000">red</span> or <font color="#ff0000">red</font> But just found another library that fork from you could.(https://github.com/sbabushkin/mammoth-colors.js) Thanks for sharing this amazing library. 😍

[bigiCrab]

By imitate @mahendra119 solution, found out how to convert highlight(bg-color, I think is same)

btw, in my workflow i dont want to convert css by hand. so i made some change for conver color.

mammoth/lib/documents.js in function Run()

color: properties.color ? '#' + properties.color : null,
highlight: properties.highlight ? properties.highlight : null

mammoth/lib/document-to-html.js in function convertRun()

if (run.color) {
    paths.push(htmlPaths.element('font', {color : run.color}, {fresh: false}));
}
if (run.highlight) {
// i think set attr by style might cause some issue.
    paths.push(htmlPaths.element('mark', {'style' : 'background-color:' + run.highlight}, {fresh: false}));
}

mammoth/lib/docx/body-reader.js in function readRunProperties()

color: element.firstOrEmpty("w:color").attributes["w:val"],
highlight: element.firstOrEmpty("w:highlight").attributes["w:val"],

[mahendra119]

Plugin Maker did not provided any text color parsing. but i have changed some code inside this package to get color parsing work. I am using version 1.4.6 go to mammoth/lib/documents.js and update this code function Run(children, properties) { properties = properties || {}; return { type: types.run, children: children, styleId: properties.styleId || null, styleName: properties.styleName || null, isBold: properties.isBold, isUnderline: properties.isUnderline, isItalic: properties.isItalic, isStrikethrough: properties.isStrikethrough, isSmallCaps: properties.isSmallCaps, verticalAlignment: properties.verticalAlignment || verticalAlignment.baseline, font: properties.font || null, color: properties.color }; } I have added only last line for color property

go to mammoth/lib/document-to-html.js and find convertRun function and add these lines- if (run.color) { paths.push(htmlPaths.element(‘span’, {color : run.color}, {fresh: false})); } i have added span tag here but you can add any tag.

Next, go to mammoth/lib/docx/body-reader.js and find readRunProperties function and add this line- color: element.firstOrEmpty(“w:color”).attributes[“w:val”]

And that’s it. you will get final result like this after parsing <span color="FF0000">Hello</span> but we know this is not valid so we need to convert it in valid CSS like below (result).replace(/color="/g, ‘style="color:#’);

I didn’t got any support for background-color. hopefully plugin maker will provide support for this in next version and give an option whether user want to turn on color parsing or not, instead of disabling by default.