much improved display of included in managed service

This commit is contained in:
Tobias Brunner 2025-07-16 11:53:24 +02:00
parent d3e0fdd941
commit a7713b46a2
Signed by: tobru
SSH key fingerprint: SHA256:kOXg1R6c11XW3/Pt9dbLdQvOJGFAy+B2K6v6PtRWBGQ
2 changed files with 22 additions and 22 deletions

View file

@ -440,13 +440,13 @@ function selectPlan(element) {
<!-- Managed Service Section -->
<div class="mb-3">
<div class="d-flex justify-content-between align-items-center mb-2">
<div class="d-flex align-items-center">
<span>Managed Service (incl. Compute)</span>
<button class="btn btn-link btn-sm p-0 ms-2 text-muted" type="button" data-bs-toggle="collapse" data-bs-target="#managedServiceIncludes" aria-expanded="false" aria-controls="managedServiceIncludes" title="Show included mandatory add-ons" style="display: none;">
<div class="d-flex align-items-center flex-shrink-1" style="min-width: 0; max-width: calc(100% - 120px);">
<span class="text-nowrap me-1">Managed Service</span>
<button class="btn btn-link btn-sm p-0 text-muted flex-shrink-0" type="button" data-bs-toggle="collapse" data-bs-target="#managedServiceIncludes" aria-expanded="false" aria-controls="managedServiceIncludes" title="Show what's included" id="managedServiceToggleButton">
<i class="bi bi-info-circle" id="managedServiceToggleIcon"></i>
</button>
</div>
<span class="fw-bold">CHF <span id="managedServicePrice">0.00</span></span>
<span class="fw-bold text-nowrap flex-shrink-0" style="min-width: 110px; text-align: right;">CHF <span id="managedServicePrice">0.00</span></span>
</div>
<!-- What's included in managed service (collapsible) -->
@ -460,9 +460,9 @@ function selectPlan(element) {
</div>
<!-- Storage - separate billable item -->
<div class="d-flex justify-content-between mb-2">
<span>Storage - <span id="storageAmount">20</span> GB</span>
<span class="fw-bold">CHF <span id="storagePrice">0.00</span></span>
<div class="d-flex justify-content-between align-items-center mb-2">
<span class="text-nowrap flex-shrink-1" style="min-width: 0;">Storage - <span id="storageAmount">20</span> GB</span>
<span class="fw-bold text-nowrap flex-shrink-0" style="min-width: 110px; text-align: right;">CHF <span id="storagePrice">0.00</span></span>
</div>
<!-- Optional Addons Pricing -->
@ -471,9 +471,9 @@ function selectPlan(element) {
</div>
<hr>
<div class="d-flex justify-content-between">
<span class="fs-5 fw-bold">Total Monthly Price</span>
<span class="fs-4 fw-bold text-primary">CHF <span id="totalPrice">0.00</span></span>
<div class="d-flex justify-content-between align-items-center">
<span class="fs-5 fw-bold text-nowrap flex-shrink-1" style="min-width: 0;">Total Monthly Price</span>
<span class="fs-4 fw-bold text-primary text-nowrap flex-shrink-0" style="min-width: 120px; text-align: right;">CHF <span id="totalPrice">0.00</span></span>
</div>
<small class="text-muted mt-2 d-block">
<i class="bi bi-info-circle me-1"></i>