Fix bootstrap table in weasyprint generated PDF - django

Question

I'm trying to create a PDF table with Weasyprint in my Django website. The same table is shown in a html page and with Weasyprint. When I use bootstrap colors in the html version it shows correctly, but the colors are lost on the Weasyprint version. That is the only feature missing on the Weasyprint version, which works otherwise.
views.py
#login_required
def scale_answer_pdf(request, scale_id):
scale = get_object_or_404(UserScale, pk=scale_id)
if scale.user == request.user or request.user.is_superuser:
if scale.scale_meta.title == "Now":
choices = NowLegend
class ScaleForm(forms.ModelForm):
class Meta:
model = NowModel
fields = labellist(NowLabels)
labels = NowLabels
if scale.scale_meta.title == "Child":
choices = NowLegend
class ScaleForm(forms.ModelForm):
class Meta:
model = ChildModel
fields = labellist(ChildLabels)
labels = ChildLabels
form = ScaleForm(instance=scale)
**html = render_to_string('diagnosis/scale_answer_pdf.html',
{'form': form, 'scale':scale, 'choices':choices})
response = HttpResponse(content_type='application/pdf')
response['Content-Disposition'] = 'filename="{} - {} -
{}.pdf"'.format(scale.scale_meta.title, scale.user.username,
scale.created.strftime('%Y-%m-%d'))
weasyprint.HTML(string=html,
base_url=request.build_absolute_uri()).write_pdf(response,
presentational_hints=True, stylesheets=
[weasyprint.CSS(settings.STATIC_ROOT + '/css/sb-admin-2.min.css'),
weasyprint.CSS(settings.STATIC_ROOT +'/css/all.min.css')])
return response**
else:
raise Http404
html for the PDF - the boostrap CSS works, and the table is also showing. But the colors from the table don't. I highlight the table parts that don't show colors
{% extends "base_pdf.html" %}
{% load i18n %}
{% load staticfiles %}
{% load get_item %}
{% block content %}
<div class="container-fluid">
<div class="row">
<div class="col-sm-6 mx-auto" >
<p class="text-center"><img height="120" width="120" src="{{scale.scale_meta.icon.url}}" alt="Test icon" class="img-fluid"></p>
</br>
<h1 class="text-center">{{scale.meta.title}}</h1>
{% with scale.created as created %}
{% with scale.user.username as username %}
<h4 class="text-center">{% blocktrans %}Created the {{created}} by {{username}}{% endblocktrans %}</h4>
</br>
<table class="table table-striped">
<tbody>
**<tr class="table-info">**
<td>{% trans "Question" %}<td>
<td>{% trans "Answer type" %}<td>
<td>{% trans "Answer" %}<td>
</tr>
{% for field in form %}
{% with name=field.name %}
{% if choices|get_item:name == "0 to 6" %}
{% if field.value > "4" %}
**<tr class="table-danger">**
{% endif %}
{% if field.value > "2" and field.value < "5" %}
**<tr class="table-warning">**
{% endif %}
{% if field.value <= "2" %}
**<tr class="table-success">**
{% endif %}
{% elif choices|get_item:name == "0 to 10" %}
{% if field.value <= "4" %}
**<tr class="table-danger">**
{% endif %}
{% if field.value > "4" and field.value < "7" %}
**<tr class="table-warning">**
{% endif %}
{% if field.value >= "7" %}
**<tr class="table-success">**
{% endif %}
{% endif %}
<td>{{field.label}}<td>
<td>{{choices|get_item:name}}<td>
<td >{{field.value}}<td>
</tr>
{% endwith %}
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
<br/>
<br/>
{% endwith %}
{% endwith %}
{% endblock %}

Answer 1

BootStrap and files.CSS don't work right in weasyprint,
Is better you use CSS <style> in Html File.
Like that:
<style> /* use CSS into style */
#page {
size: A4; /* Change from the default size of A4 */
margin: 3.5mm; /* Set margin on each page */
}
</style>
Bye.