pricing: remove monthly/yearly billing toggle, default to yearly

- Remove billing-toggle-wrap HTML (switch + labels)
- Update all 4 pricing cards to show yearly prices by default
  with / year period and save percentage
- Simplify openOrderWidget() to always use yearly pricing only
- Remove billing toggle JS block (updatePrices, setBilling, event listeners)
- Remove billing toggle CSS (billing-toggle-wrap, .toggle-*, .toggle-switch)
- Update order widget default display to / year
- Update CTA note to 'Save money, less administration'
This commit is contained in:
2026-08-20 10:38:03 +00:00
parent 3e9a6d5c4b
commit a2cfa09558
3 changed files with 24 additions and 158 deletions
-47
View File
@@ -626,53 +626,6 @@ img { max-width: 100%; height: auto; vertical-align: middle; }
color: var(--success);
margin-top: 0.15rem;
}
/* Billing Toggle */
.billing-toggle-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
margin-bottom: 1.5rem;
}
.toggle-label {
font-size: 0.82rem;
font-weight: 500;
color: rgba(255,255,255,0.5);
cursor: pointer;
transition: color 0.2s;
user-select: none;
}
.toggle-label.active { color: #fff; font-weight: 600; }
.toggle-label small {
display: block;
font-size: 0.72rem;
font-weight: 500;
color: var(--success);
margin-top: 0.1rem;
}
.toggle-switch {
width: 48px;
height: 26px;
background: rgba(255,255,255,0.15);
border-radius: 13px;
cursor: pointer;
position: relative;
transition: background 0.25s;
flex-shrink: 0;
}
.toggle-switch.yearly { background: var(--brass); }
.toggle-switch .thumb {
position: absolute;
top: 3px;
left: 3px;
width: 20px;
height: 20px;
background: #fff;
border-radius: 50%;
transition: left 0.25s;
box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.toggle-switch.yearly .thumb { left: 25px; }
.price-period { color: var(--ink-soft); font-size: 0.68rem; }
.pricing-cta-note {
text-align: center;