Fixup layout of advanced search dialog

include/class.forms.php

@@ -1277,7 +1277,6 @@ class ChoicesWidget extends Widget {
             $values = $have_def ? array($def_key => $choices[$def_key]) : array();
 
         ?>
-        <span style="display:inline-block">
         <select name="<?php echo $this->name; ?>[]"
             id="<?php echo $this->name; ?>"
             data-prompt="<?php echo $prompt; ?>"
@@ -1295,7 +1294,6 @@ class ChoicesWidget extends Widget {
                 ?>><?php echo $name; ?></option>
             <?php } ?>
         </select>
-        </span>
         <?php
         if ($config['multiselect']) {
          ?>

include/staff/tickets.inc.php

@@ -564,13 +564,13 @@ if ($results) {
 <div class="dialog" style="display:none;" id="advanced-search">
     <h3><?php echo __('Advanced Ticket Search');?></h3>
     <a class="close" href=""><i class="icon-remove-circle"></i></a>
+    <hr/>
     <form action="tickets.php" method="post" id="search" name="search">
         <input type="hidden" name="a" value="search">
         <fieldset class="query">
-            <label for="query"><?php echo __('Keyword');?>:</label>
-            <input type="input" id="query" name="query" size="20"> <em><?php echo __('Optional');?></em>
+            <input type="input" id="query" name="query" size="20" placeholder="<?php echo __('Keywords') . ' &mdash; ' . __('Optional'); ?>">
         </fieldset>
-        <fieldset>
+        <fieldset class="span6">
             <label for="status"><?php echo __('Status');?>:</label>
             <select id="status" name="status">
                 <option value="">&mdash; <?php echo __('Any Status');?> &mdash;</option>
@@ -583,6 +583,8 @@ if ($results) {
                 <option value="overdue"><?php echo __('Overdue');?></option>
                 <option value="closed"><?php echo __('Closed');?></option>
             </select>
+        </fieldset>
+        <fieldset class="span6">
             <label for="deptId"><?php echo __('Dept');?>:</label>
             <select id="deptId" name="deptId">
                 <option value="">&mdash; <?php echo __('All Departments');?> &mdash;</option>
@@ -596,7 +598,7 @@ if ($results) {
                 ?>
             </select>
         </fieldset>
-        <fieldset class="owner">
+        <fieldset class="owner span6">
             <label for="assignee"><?php echo __('Assigned To');?>:</label>
             <select id="assignee" name="assignee">
                 <option value="">&mdash; <?php echo __('Anyone');?> &mdash;</option>
@@ -622,6 +624,8 @@ if ($results) {
                 }
                 ?>
             </select>
+        </fieldset>
+        <fieldset class="owner span6">
             <label for="staffId"><?php echo __('Closed By');?>:</label>
             <select id="staffId" name="staffId">
                 <option value="0">&mdash; <?php echo __('Anyone');?> &mdash;</option>
@@ -634,7 +638,7 @@ if ($results) {
                 ?>
             </select>
         </fieldset>
-        <fieldset>
+        <fieldset class="span6">
             <label for="topicId"><?php echo __('Help Topic');?>:</label>
             <select id="topicId" name="topicId">
                 <option value="" selected >&mdash; <?php echo __('All Help Topics');?> &mdash;</option>
@@ -649,24 +653,26 @@ if ($results) {
         <fieldset class="date_range">
             <label><?php echo __('Date Range');?>:</label>
             <input class="dp" type="input" size="20" name="startDate">
-            <span><?php echo __('TO');?></span>
+            <span class="between"><?php echo __('TO');?></span>
             <input class="dp" type="input" size="20" name="endDate">
         </fieldset>
-        <fieldset>
         <?php
         foreach (TicketForm::getInstance()->getFields() as $f) {
             if (in_array($f->get('type'), array('text', 'memo', 'phone', 'thread')))
                 continue;
             elseif (!$f->hasData())
                 continue;
-            ?><label><?php echo $f->getLabel(); ?>:</label>
-                <div style="display:inline-block;width: 12.5em;"><?php
+            ?><fieldset class="span6">
+            <label><?php echo $f->getLabel(); ?>:</label><div><?php
                      $f->render('search'); ?></div>
+            </fieldset>
         <?php } ?>
-        </fieldset>
+        <hr/>
         <p>
-            <span class="buttons">
+            <span class="buttons pull-right">
                 <input type="submit" value="<?php echo __('Search');?>">
+            </span>
+            <span class="buttons pull-left">
                 <input type="reset" value="<?php echo __('Reset');?>">
                 <input type="button" value="<?php echo __('Cancel');?>" class="close">
             </span>

scp/css/scp.css

@@ -1429,12 +1429,7 @@ time {
     background:#fff;
 }
 
-.dialog fieldset select {
-    width:170px;
-    display:inline-block;
-}
-
-.dialog fieldset span {
+.dialog fieldset span.between {
     width:50px;
     display:inline-block;
     text-align:center;
@@ -1452,12 +1447,32 @@ time {
     cursor: crosshair;
 }
 
+#advanced-search fieldset.span6 {
+    display: inline-block;
+    width: 49%;
+    margin-bottom: 5px;
+}
+#advanced-search fieldset label {
+    display: block;
+}
+#advanced-search fieldset.span6 select,
+#advanced-search fieldset.span6 input {
+    max-width: 100%;
+    min-width: 75%;
+}
+
 #advanced-search .query input {
-    width:350px;
+    width:100%;
+    padding: 4px;
+    margin-bottom: 10px;
 }
 
+#advanced-search .date_range {
+    margin-bottom: 5px;
+}
 #advanced-search .date_range input {
-    width:175px;
+    width:227px;
+    width: calc(49% - 73px);
 }
 
 #advanced-search .date_range i {