lepture/mistune

task list should have a css class

cu opened this issue · 2 comments

cu commented

The task list is implemented as an unordered list of list items having a checkbox input:

<ul>
<li class="task-list-item"><input class="task-list-item-checkbox" type="checkbox" disabled checked/>item 1</li>
<li class="task-list-item"><input class="task-list-item-checkbox" type="checkbox" disabled/>item 2</li>
</ul>

I would like to be able to style the task list separately from other unordered lists but I can't since the <ul> element has no class and there is no such thing as a parent selector in CSS as far as I can tell.

I took a look at the plugin to see if I could fix this myself but I don't see where the <ul> element is being emitted in the renderer.

@cu You can use a custom renderer like this:

    def list(self, text, ordered, level, start=None):
        if ordered:
            html = '<ol'
            if start is not None:
                html += ' start="' + str(start) + '"'
            return html + '>\n' + text + '</ol>\n'

        if 'task-list-item' in text:
            return '<ul class="has-task">\n' + text + '</ul>\n'
        return '<ul>\n' + text + '</ul>\n'
cu commented

Thank you, I will give that a try.