Checkout UX: Make whole panel head clickable in payment method selection

Thanks @breunigs for the suggestion
This commit is contained in:
Raphael Michel
2017-12-11 15:00:22 +01:00
parent e24611fde9
commit 725a7f21c4
2 changed files with 26 additions and 9 deletions

View File

@@ -8,22 +8,22 @@
<div class="panel-group" id="payment_accordion">
{% for p in providers %}
<div class="panel panel-default" data-total="{{ p.total|floatformat:2 }}">
<div class="panel-heading">
<h4 class="panel-title">
<label class="radio">
<label class="accordion-radio">
<div class="panel-heading">
<h4 class="panel-title">
{% if show_fees %}
<strong class="pull-right">+ {{ p.fee|floatformat:2 }} {{ event.currency }}</strong>
{% endif %}
<input type="radio" name="payment" value="{{ p.provider.identifier }}"
data-parent="#payment_accordion"
{% if selected == p.provider.identifier %}checked="checked"{% endif %}
data-toggle="radiocollapse" data-target="#payment_{{ p.provider.identifier }}" />
data-toggle="radiocollapse" data-target="#payment_{{ p.provider.identifier }}"/>
<strong>{{ p.provider.public_name }}</strong>
</label>
</h4>
</div>
</h4>
</div>
</label>
<div id="payment_{{ p.provider.identifier }}"
class="panel-collapse collapsed {% if selected == p.provider.identifier %}in{% endif %}">
class="panel-collapse collapsed {% if selected == p.provider.identifier %}in{% endif %}">
<div class="panel-body form-horizontal">
{{ p.form }}
</div>