Nested comments not indenting

[woesoe]

I've been trying to get nested comments to work on my Wagtail/Puput blog. The comments are registered in django-admin as nested:

But the nested comments don't indent to the right, but just show up straight below the original comment:

The html-file that serves the comments is located at blog_wout\blog_wout\templates\puput\comments\django_comments.html and it looks like this:

{% load comments %}
{% load comments_xtd %}

<div>
    <h3>Comments:</h3>
    {% render_comment_form for entry %}
    {% render_xtdcomment_tree for entry%}
</div>

Any help would be greatly appreciated!

[danirus]

In v2 of django-comments-xtd the indentation depends on loading bootstrap.css. It's not very well documented. Only if you go through the tutorial or install the demo/comp project you could see that:

<link href="{% static 'django_comments_xtd/css/bootstrap.min.css' %}" rel="stylesheet">

The future v3 (I'm working on it but I can't put a release date yet) will not depend on any frontend CSS or JS framework. But for the time being this is the way to go.

[woesoe]

Hi danirus, thank you for your comment.

Adding django_comments_xtd/css/bootstrap.min.css indeed does the trick when it comes to showing the indentation etc. But since Puput already uses a bootstrap css file, webpages on my blog that show the comments section are completely changed when I load the new django-comments-xtd bootstrap file.

I'm still looking for a good way to specifically change the css for only the comments section. I was thinking of making a custom css file that handles all the classes listed in django_comments.html. Would that be the way forward?

[woesoe]

Nvm, I've decided I'm going to try to use the django_comments_xtd/css/bootstrap.min.css, since it's a newer version of bootstrap anyway and I can actually get pretty good results with it if load it before the puput.css file is loaded in base.html.

Thanks again!