Changeset - cc88f5c6132d
[Not reviewed]
version_5
0 2 0
Dennis Fink - 10 years ago 2015-07-20 23:27:09
dennis.fink@c3l.lu
Added fancy checkboxes and radio buttons
2 files changed with 72 insertions and 6 deletions:
0 comments (0 inline, 0 general)
ennstatus/static/css/ennstatus.css
Show inline comments
 
@@ -105,3 +105,57 @@ h1, h2, h3, h4 {
 
    -moz-border-radius: 6px 0 6px 6px;
 
    border-radius: 6px 0 6px 6px;
 
}
 

	
 
/* fancy bootstrap checkboxes */
 

	
 
.form-group input[type="checkbox"] {
 
    display: none;
 
}
 

	
 
.form-group input[type="checkbox"] + .btn-group > label span {
 
    width: 20px;
 
}
 

	
 
.form-group input[type="checkbox"] + .btn-group > label span:first-child {
 
    display: none;
 
}
 

	
 
.form-group input[type="checkbox"] + .btn-group > label span:last-child {
 
    display: inline-block;
 
}
 

	
 
.form-group input[type="checkbox"]:checked + .btn-group > label span:first-child {
 
    display: inline-block;
 
}
 

	
 
.form-group input[type="checkbox"]:checked + .btn-group > label span:last-child {
 
    display: none;
 
}
 

	
 
.form-group input[type="radio"] {
 
    display: none;
 
}
 

	
 
.form-group input[type="radio"] + .btn-group > label span {
 
    width: 20px;
 
}
 

	
 
.form-group input[type="radio"] + .btn-group > label span:first-child {
 
    display: none;
 
}
 

	
 
.form-group input[type="radio"] + .btn-group > label span:last-child {
 
    display: inline-block;
 
}
 

	
 
.form-group input[type="radio"]:checked + .btn-group > label span:first-child {
 
    display: inline-block;
 
}
 

	
 
.form-group input[type="radio"]:checked + .btn-group > label span:last-child {
 
    display: none;
 
}
 

	
 
.checkbox label, .radio label {
 
    padding-left: 12px;
 
}
ennstatus/templates/root/membership.html
Show inline comments
 
@@ -23,9 +23,16 @@
 
        <div class="col-lg-10">
 
        {% for field in form.membership %}
 
          <div class="radio">
 
            <label>
 
              {{ field() }} {{ field.label.text }}
 
            </label>
 
            {{ field() }}
 
            <div class="btn-group">
 
              <label class="btn btn-success" for="{{ field.id }}">
 
                <span class="glyphicon glyphicon-plus"></span>
 
                <span class="glyphicon glyphicon-minus"></span>
 
              </label>
 
              <label class="btn btn-default" for="{{ field.id }}">
 
                {{ field.label.text }}
 
              </label>
 
            </div> 
 
          </div>
 
        {% endfor %}
 
        </div>
 
@@ -40,9 +47,14 @@
 
      <div class="form-group">
 
        <label class="control-label col-lg-2">Double membership</label>
 
        <div class="col-lg-10">
 
          <div class="checkbox">
 
            <label>
 
              {{ form.c3l() }} {{ form.c3l.label.text|safe }}
 
          {{ form.c3l() }}
 
          <div class="btn-group">
 
            <label class="btn btn-success" for="c3l">
 
              <span class="glyphicon glyphicon-plus"></span>
 
              <span class="glyphicon glyphicon-minus"></span>
 
            </label>
 
            <label class="btn btn-default" for="c3l">
 
              {{ form.c3l.label.text|safe }}
 
            </label>
 
          </div>
 
        </div>
0 comments (0 inline, 0 general)