- fix : bug 353 (radio and date in search.tpl

git-svn-id: http://piwigo.org/svn/branches/branch-1_6@1267 68402e56-0260-453c-a942-63ccdbb3a9ee

2 files changed, 71 insertions, 39 deletions

diff --git a/template/yoga/default-layout.css b/template/yoga/default-layout.css
index b1256e1bc..62cfd7a13 100644
--- a/template/yoga/default-layout.css
+++ b/template/yoga/default-layout.css
@@ -125,7 +125,8 @@ FORM#cat_modify TABLE { width: auto; }
 
 /**
  * Filter forms are displayed label by label with the input (or select...)
- * below the label. Use a SPAN to group objects in a single line.
+ * below the label. Use an UL to make a group (radiobox for instance).
+ * Use a SPAN to group objects in line
  */
 FIELDSET {
   padding: 1em;
@@ -133,14 +134,28 @@ FIELDSET {
   overflow: hidden; /* <- makes Opera happy */
 }
 
+FORM.filter FIELDSET UL {
+  margin: 0;
+}
+FORM.filter FIELDSET UL,
 FORM.filter FIELDSET LABEL {
   display: block;
   float: left;
-  width: auto;
   margin-right: 1em;
   padding: 0;
 }
-FORM.filter FIELDSET UL LABEL {
+
+FORM.filter FIELDSET LI {
+  list-style: none;
+  margin-bottom: 0.5em;
+}
+
+FORM.filter FIELDSET LI LABEL {
+  display: inline;
+  float: none;
+}
+
+FORM.filter FIELDSET UL.tagSelection LABEL {
   display: inline;
   float: none;
 }
@@ -154,11 +169,11 @@ FORM.filter FIELDSET LABEL TEXTAREA {
   margin: 0.5em 0;
 }
 FORM.filter FIELDSET * LABEL INPUT,
-FORM.filter FIELDSET LABEL * INPUT,
 FORM.filter FIELDSET * LABEL SELECT,
-FORM.filter FIELDSET LABEL * SELECT,
 FORM.filter FIELDSET * LABEL TEXTAREA,
-FORM.filter FIELDSET LABEL * TEXTAREA {
+FORM.filter FIELDSET LABEL SPAN INPUT,
+FORM.filter FIELDSET LABEL SPAN SELECT,
+FORM.filter FIELDSET LABEL SPAN TEXTAREA {
   display: inline;
   vertical-align: top;
   margin: 0 0.5em 0 0;
diff --git a/template/yoga/search.tpl b/template/yoga/search.tpl
index b38bb115b..8de689664 100644
--- a/template/yoga/search.tpl
+++ b/template/yoga/search.tpl
@@ -24,10 +24,14 @@
   <label>{lang:search_keywords}
     <input type="text" style="width: 300px" name="search_allwords" size="30"  onfocus="this.className='focus';" onblur="this.className='nofocus';"/>
   </label>
-  <label>
-    <span><input type="radio" name="mode" value="AND" checked="checked" /> {lang:search_mode_and}</span>
-    <span><input type="radio" name="mode" value="OR" /> {lang:search_mode_or}</span>
-  </label>
+  <ul>
+    <li><label>
+      <input type="radio" name="mode" value="AND" checked="checked" />{lang:search_mode_and}
+    </label></li>
+    <li><label>
+      <input type="radio" name="mode" value="OR" />{lang:search_mode_or}
+    </label></li>
+  </ul>
   <label>{lang:search_author}
     <input type="text" style="width: 300px" name="search_author" size="30"  onfocus="this.className='focus';" onblur="this.className='nofocus';"/>
   </label>
@@ -41,16 +45,18 @@
 
 <fieldset>
   <legend>{lang:search_date}</legend>
-  <label>{lang:search_date_type}
-    <span>
+  <ul>
+    <li><label>{lang:search_date_type}</label></li>
+    <li><label>
       <input type="radio" name="date_type" value="date_creation" checked="checked" />{lang:Creation date}
-    </span>
-    <span>
+    </label></li>
+    <li><label>
       <input type="radio" name="date_type" value="date_available" />{lang:Post date}
-    </span>
-  </label>
-  <label>{lang:search_date_from}
-    <span>
+    </li></label>
+  </ul>
+  <ul>
+    <li><label>{lang:search_date_from}</label></li>
+    <li>
       <select name="start_day">
         <!-- BEGIN start_day -->
         <option {start_day.SELECTED} value="{start_day.VALUE}">{start_day.OPTION}</option>
@@ -62,11 +68,14 @@
         <!-- END start_month -->
       </select>
       <input name="start_year" type="text" size="4" maxlength="4" onfocus="this.className='focus';" onblur="this.className='nofocus';">
-    </span>
-    <a href="#" onClick="document.search.start_day.value={TODAY_DAY};document.search.start_month.value={TODAY_MONTH};document.search.start_year.value={TODAY_YEAR};">{lang:today}</a>
-  </label>
-  <label>{lang:search_date_to}
-    <span>
+    </li>
+    <li>
+      <a href="#" onClick="document.search.start_day.value={TODAY_DAY};document.search.start_month.value={TODAY_MONTH};document.search.start_year.value={TODAY_YEAR};">{lang:today}</a>
+    </li>
+  </ul>
+  <ul>
+    <li><label>{lang:search_date_to}</label></li>
+    <li>
       <select name="end_day">
         <!-- BEGIN end_day -->
         <option {end_day.SELECTED} value="{end_day.VALUE}">{end_day.OPTION}</option>
@@ -78,9 +87,11 @@
         <!-- END end_month -->
       </select>
       <input name="end_year" type="text" size="4" maxlength="4" onfocus="this.className='focus';" onblur="this.className='nofocus';">
-    </span>
-    <a href="#" onClick="document.search.end_day.value={TODAY_DAY};document.search.end_month.value={TODAY_MONTH};document.search.end_year.value={TODAY_YEAR};">{lang:today}</a>
-  </label>
+    </li>
+    <li>
+      <a href="#" onClick="document.search.end_day.value={TODAY_DAY};document.search.end_month.value={TODAY_MONTH};document.search.end_year.value={TODAY_YEAR};">{lang:today}</a>
+    </li>
+  </ul>
 </fieldset>
 
 <fieldset>
@@ -92,18 +103,24 @@
       <!-- END category_option -->
     </select>
   </label>
-  <label>{lang:search_subcats_included}
-    <span>
-    <input type="radio" name="subcats-included" value="1" checked="checked" />{lang:yes}
-    </span>
-    <span>
-    <input type="radio" name="subcats-included" value="0" />{lang:no}
-    </span>
-  </label>
-  <label>{lang:search_sort}
-    <span><input type="radio" name="sd" value="AND" />{lang:search_ascending}</span>
-    <span><input type="radio" name="sd" value="d" checked="checked" />{lang:search_descending}</span>
-  </label>
+  <ul>
+    <li><label>{lang:search_subcats_included}</label></li>
+    <li><label>
+      <input type="radio" name="subcats-included" value="1" checked="checked" />{lang:yes}
+    </label></li>
+    <li><label>
+      <input type="radio" name="subcats-included" value="0" />{lang:no}
+    </label></li>
+  </ul>
+  <ul>
+    <li><label>{lang:search_sort}</li></label>
+    <li><label>
+      <input type="radio" name="sd" value="AND" />{lang:search_ascending}
+    </li></label>
+    <li><label>
+      <input type="radio" name="sd" value="d" checked="checked" />{lang:search_descending}
+    </li></label>
+  </ul>
 </fieldset>
 <p>
   <input type="submit" name="submit" value="{lang:submit}" class="bouton" />
@@ -112,7 +129,7 @@
 </form>
 
 <script type="text/javascript"><!--
-document.post.search_allwords.focus();
+document.search.search_allwords.focus();
 //--></script>
 
 </div> <!-- content -->