small styling updates

This commit is contained in:
Tobias Brunner 2025-05-26 15:02:14 +02:00
parent 60e083b5bb
commit a64163cad0
No known key found for this signature in database
2 changed files with 24 additions and 4 deletions

View file

@ -12510,3 +12510,23 @@ a.btn:focus {
.accordion-button:not(.collapsed)::after { .accordion-button:not(.collapsed)::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
} }
.pricing-table thead.table-dark {
background-color: #160037 !important;
}
.pricing-table .final-price-header {
background-color: #9A63EC !important;
color: #fff !important;
}
.pricing-table .final-price-cell {
background-color: #f9fafb !important;
color: #160037 !important;
}
.price-chart {
background-color: #f8f9fa;
padding: 20px;
border-radius: 8px;
}

View file

@ -37,7 +37,7 @@
<h3 class="mb-3 text-secondary">{{ service_level }}</h3> <h3 class="mb-3 text-secondary">{{ service_level }}</h3>
{% if pricing_data %} {% if pricing_data %}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-bordered table-sm"> <table class="table table-striped table-bordered table-sm pricing-table">
<thead class="table-dark"> <thead class="table-dark">
<tr> <tr>
<th>Cloud Provider</th> <th>Cloud Provider</th>
@ -59,7 +59,7 @@
<th>Discount Model</th> <th>Discount Model</th>
<th>Discount Details</th> <th>Discount Details</th>
{% endif %} {% endif %}
<th class="table-warning">Final Price</th> <th class="final-price-header">Final Price</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -107,7 +107,7 @@
{% endif %} {% endif %}
</td> </td>
{% endif %} {% endif %}
<td class="table-warning fw-bold">{{ row.final_price|floatformat:2 }}</td> <td class="final-price-cell fw-bold">{{ row.final_price|floatformat:2 }}</td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
@ -115,7 +115,7 @@
</div> </div>
{# Price Chart #} {# Price Chart #}
<div class="mt-3"> <div class="price-chart mt-3">
<h5 class="text-muted">Price Chart - Units vs Final Price</h5> <h5 class="text-muted">Price Chart - Units vs Final Price</h5>
<div style="height: 400px;"> <div style="height: 400px;">
<canvas id="chart-{{ group_name|slugify }}-{{ service_level|slugify }}" width="400" height="200"></canvas> <canvas id="chart-{{ group_name|slugify }}-{{ service_level|slugify }}" width="400" height="200"></canvas>