From: paul <paul@plutz.net>
Date: Mon, 12 Oct 2015 17:23:00 +0000 (+0000)
Subject: use native radio and check buttons, do not break line between input and label
X-Git-Url: https://git.plutz.net/?a=commitdiff_plain;h=4d62352e69df4972b505b65ad8a889b910d8a5a5;p=confetti

use native radio and check buttons, do not break line between input and label

svn path=/trunk/; revision=72
---

diff --git a/templates/attendees.css.sh b/templates/attendees.css.sh
index 6d375a1..796c701 100755
--- a/templates/attendees.css.sh
+++ b/templates/attendees.css.sh
@@ -17,14 +17,17 @@
 
 cat <<EOF
 
+/*
 input[type="checkbox"] { display: none; }
 input[type="checkbox"] + label::before {content: '\2610'; padding-right: .5ex;}
 input[type="checkbox"]:checked + label { text-decoration: underline; }
 input[type="checkbox"]:checked + label::before {content: '\2611';}
+/*
 input[type="radio"] { display: none; }
 input[type="radio"] + label::before {content: '\25cb'; margin-right: .75ex; font-size: .75em;}
 input[type="radio"]:checked + label { text-decoration: underline; }
 input[type="radio"]:checked + label::before {content: '\29bf';}
+*/
 
 .filter {
   display: block;
@@ -51,21 +54,23 @@ input[type="radio"]:checked + label::before {content: '\29bf';}
   margin-bottom: .5em;
 }
 .filter fieldset {
+  position: relative;
+  display: block;
   border: none;
   padding: 0 0 0 12ex;
-  margin: 0 0 -.5em 0;
+  margin: 0 0 .5em 0;
 }
 .filter fieldset legend {
-  display: inline-block;
+  position: absolute;
   font-size: 1em;
   font-weight: bold;
   margin-left: -12ex;
 }
-.filter input[type="radio"] + label {
+.filter label {
   display: inline-block;
-  position: relative;
-  top: -1.125em;
-  margin-left: 2ex;
+  vertical-align: top;
+  margin: .125em 2ex 0 0;
+  white-space: nowrap;
 }
 .filter button {
   margin-top: .5em;
@@ -154,11 +159,16 @@ input[type="radio"]:checked + label::before {content: '\29bf';}
 form.card .attendance {
   min-width: 66%;
 }
-form.card .attendance input[type=checkbox] + label {
+form.card .attendance label {
+  position: relative;
   display: inline-block;
   width: 25ex;
+  padding-left: 3ex;
+}
+form.card .attendance label input[type=checkbox] {
+  position: absolute;
+  margin-left: -3ex;
 }
-
 
 .card .section .item {
   display: block;
diff --git a/templates/attendees.html.sh b/templates/attendees.html.sh
index 325ddb4..fbc5fe5 100755
--- a/templates/attendees.html.sh
+++ b/templates/attendees.html.sh
@@ -34,29 +34,19 @@ cat <<EOF
   <br />
   <fieldset>
   <legend>$(l10n filter_type):</legend>
-    <input type="radio" name="filtertype" value="any"       id="ft_any"    $(check_type any)
-     ><label for="ft_any"   >$(l10n filter_all)</label>
-    <input type="radio" name="filtertype" value="name"      id="ft_name"   $(check_type name)
-     ><label for="ft_name"  >$(l10n filter_name)</label>
-    <input type="radio" name="filtertype" value="street"    id="ft_street" $(check_type street)
-     ><label for="ft_street">$(l10n filter_street)</label>
-    <input type="radio" name="filtertype" value="zip"       id="ft_zip"    $(check_type zip)
-     ><label for="ft_zip"   >$(l10n filter_zip)</label>
-    <input type="radio" name="filtertype" value="telephone" id="ft_phone"  $(check_type telephone)
-     ><label for="ft_phone" >$(l10n filter_phone)</label>
-    <input type="radio" name="filtertype" value="birth"     id="ft_birth"  $(check_type birth)
-     ><label for="ft_birth" >$(l10n filter_birthyear)</label>
-    <input type="radio" name="filtertype" value="course"    id="ft_course" $(check_type course)
-     ><label for="ft_course">$(l10n filter_course)</label>
+    <label><input type="radio" name="filtertype" value="any"       $(check_type any)      >$(l10n filter_all)</label>
+    <label><input type="radio" name="filtertype" value="name"      $(check_type name)     >$(l10n filter_name)</label>
+    <label><input type="radio" name="filtertype" value="street"    $(check_type street)   >$(l10n filter_street)</label>
+    <label><input type="radio" name="filtertype" value="zip"       $(check_type zip)      >$(l10n filter_zip)</label>
+    <label><input type="radio" name="filtertype" value="telephone" $(check_type telephone)>$(l10n filter_phone)</label>
+    <label><input type="radio" name="filtertype" value="birth"     $(check_type birth)    >$(l10n filter_birthyear)</label>
+    <label><input type="radio" name="filtertype" value="course"    $(check_type course)   >$(l10n filter_course)</label>
   </fieldset>
   <fieldset>
     <legend>$(l10n filter_order):</legend>
-    <input type="radio" name="order" value="firstname" id="od_fname" $(check_order firstname)
-     ><label for="od_fname">$(l10n filter_firstname)</label>
-    <input type="radio" name="order" value="lastname"  id="od_lname" $(check_order lastname)
-     ><label for="od_lname">$(l10n filter_lastname)</label>
-    <input type="radio" name="order" value="bdate"     id="od_bdate" $(check_order bdate)
-     ><label for="od_bdate">$(l10n filter_bdate)</label>
+    <label><input type="radio" name="order" value="firstname" $(check_order firstname)>$(l10n filter_firstname)</label>
+    <label><input type="radio" name="order" value="lastname"  $(check_order lastname) >$(l10n filter_lastname)</label>
+    <label><input type="radio" name="order" value="bdate"     $(check_order bdate)    >$(l10n filter_bdate)</label>
   </fieldset>
   <button type="submit" name="choice" value="new_filter">$(l10n filter_apply)</button>
   <button type="submit" name="choice" value="del_filter">$(l10n filter_cancel)</button>
diff --git a/templates/edit_attendee.sh b/templates/edit_attendee.sh
index 4513a3d..49d4666 100755
--- a/templates/edit_attendee.sh
+++ b/templates/edit_attendee.sh
@@ -118,8 +118,7 @@ cat <<END_HTML
     <h3>$(l10n course_attendance)</h3>
     $(listcourses |while read each; do
       cname="$(sed -rn 's:^SUMMARY\:(.*)$:\1:p' "$_DATA/ical/$each")"
-      echo '<input type="checkbox" name="attendance" value="'$each'" id="cbatt_'$each'" '$(check_a "$each")'/
-            ><label for="cbatt_'$each'">'$cname'</label>'
+      echo '<label><input type="checkbox" name="attendance" value="'$each'" '$(check_a "$each")'/>'$cname'</label>'
     done)
   </div>