[BGUFIX] Fix layout of search toolbar in List module 72/38172/5
authorFrank Nägler <typo3@naegler.net>
Wed, 25 Mar 2015 16:14:58 +0000 (17:14 +0100)
committerMarkus Klein <klein.t3@reelworx.at>
Wed, 25 Mar 2015 23:26:10 +0000 (00:26 +0100)
The layout of the search-toolbar is broken. This patch
adjust some CSS.

Resolves: #66031
Releases: master
Change-Id: I049c07cde25318f123ded47013f458a8a5268790
Reviewed-on: http://review.typo3.org/38172
Reviewed-by: Benjamin Kott <info@bk2k.info>
Tested-by: Benjamin Kott <info@bk2k.info>
Reviewed-by: Daniel Sattler <sattler@b13.de>
Tested-by: Daniel Sattler <sattler@b13.de>
Reviewed-by: Markus Klein <klein.t3@reelworx.at>
Tested-by: Markus Klein <klein.t3@reelworx.at>
typo3/sysext/recordlist/Classes/RecordList/AbstractDatabaseRecordList.php
typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/structure/_module_web_list.less
typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css

index 0488fab..e9e3ea9 100644 (file)
@@ -513,32 +513,30 @@ class AbstractDatabaseRecordList extends AbstractRecordList {
                // Table with the search box:
                $content = '<div class="db_list-searchbox-form db_list-searchbox-toolbar" id="db_list-searchbox-toolbar" style="display: ' . ($this->searchString == '' ? 'none' : 'block') . ';">
                        ' . $formElements[0] . '
-                               <div id="typo3-dblist-search" class="container">
-                                       <div class="row">
-                                               <div class="col-xs-3 col-md-3 col-lg-3">
-                                                       <div class="input-group">
-                                                               <label class="pull-left" for="search_field">' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.label.searchString', TRUE) . ': </label>
-                                                               <input class="form-control" type="search" placeholder="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.enterSearchString', TRUE) . '" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.searchString', TRUE) . '" name="search_field" id="search_field" value="' . htmlspecialchars($this->searchString) . '" />
-                                                       </div>
-                                               </div>
-                                               <div class="col-xs-3 col-md-3 col-lg-3">
-                                                       <div class="input-group">
-                                                               <label class="pull-left" for="search_levels">' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.label.search_levels', TRUE) . ': </label>
-                                                               ' . $lMenu . '
-                                                       </div>
-                                               </div>
-                                               <div class="col-xs-3 col-md-3 col-lg-3">
-                                                       <div class="input-group">
-                                                               <label class="pull-left" for="showLimit">' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.label.limit', TRUE) . ': </label>
-                                                               <input class="form-control" type="number" min="0" max="10000" placeholder="10" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.limit', TRUE) . '" name="showLimit" id="showLimit" value="' . htmlspecialchars(($this->showLimit ? $this->showLimit : '')) . '" />
-                                                       </div>
-                                               </div>
-                                               <div class="col-xs-3 col-md-3 col-lg-3">
-                                                       <div class="input-group">
-                                                               <input type="submit" class="btn btn-default btn-block" name="search" value="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.search', TRUE) . '" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.search', TRUE) . '" />
+                               <div id="typo3-dblist-search">
+                                       <div class="panel panel-default">
+                                               <div class="panel-body">
+                                                       <div class="form-inline form-inline-spaced">
+                                                               <div class="form-group">
+                                                                       <input class="form-control" type="search" placeholder="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.enterSearchString', TRUE) . '" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.searchString', TRUE) . '" name="search_field" id="search_field" value="' . htmlspecialchars($this->searchString) . '" />
+                                                               </div>
+                                                               <div class="form-group">
+                                                                       <label for="search_levels">' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.label.search_levels', TRUE) . ': </label>
+                                                                       ' . $lMenu . '
+                                                               </div>
+                                                               <div class="form-group">
+                                                                       <label for="showLimit">' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.label.limit', TRUE) . ': </label>
+                                                                       <input class="form-control" type="number" min="0" max="10000" placeholder="10" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.limit', TRUE) . '" name="showLimit" id="showLimit" value="' . htmlspecialchars(($this->showLimit ? $this->showLimit : '')) . '" />
+                                                               </div>
+                                                               <div class="form-group">
+                                                                       <button type="submit" class="btn btn-default" name="search" title="' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.title.search', TRUE) . '">
+                                                                               <i class="fa fa-search"></i> ' . $lang->sL('LLL:EXT:lang/locallang_core.xlf:labels.search', TRUE) . '
+                                                                       </button>
+                                                               </div>
                                                        </div>
                                                </div>
                                        </div>
+                               </div>
                        ' . $formElements[1] . '</div></div>';
                return $content;
        }
index 909ec57..75f8ab4 100644 (file)
@@ -126,20 +126,34 @@ div#typo3-listOptions {
 }
 
 .db_list-searchbox-toolbar {
-    background: #dadada;
-    border-top: 1px solid #b3b3b3;
-    padding: 5px 5px 0 5px;
-    position: absolute;
-    z-index: 2000;
-    width: 100%;
+       .form-inline {
+               margin-top: -0.5em;
+               margin-bottom: 0;
+       }
 }
-
-#typo3-docheader .db_list-searchbox-toolbar input {
-    cursor: auto !important;
-    margin-right: 10px !important;
+.typo3-docheader-buttons {
+       + .db_list-searchbox-toolbar {
+               .box-shadow(0px 3px 0px rgba(0, 0, 0, 0.15));
+               position: absolute;
+               z-index: 2000;
+               width: 100%;
+               .panel {
+                       border-radius: 0;
+                       border: 0;
+                       margin: 0;
+               }
+               .panel-default {
+                       background-color: #eee;
+               }
+       }
 }
-
-#typo3-docheader .db_list-searchbox-toolbar select {
-    vertical-align: text-bottom !important;
-    margin-right: 10px !important;
+#typo3-browse-links-php {
+       .db_list-searchbox-toolbar {
+               form {
+                       padding: 0;
+               }
+               .panel {
+                       margin: 0.5em 0;
+               }
+       }
 }
\ No newline at end of file
index 3c3812a..0ca852a 100644 (file)
@@ -12106,21 +12106,30 @@ div#typo3-listOptions {
   padding: 4px 5px;
   width: 7px;
 }
-.db_list-searchbox-toolbar {
-  background: #dadada;
-  border-top: 1px solid #b3b3b3;
-  padding: 5px 5px 0 5px;
+.db_list-searchbox-toolbar .form-inline {
+  margin-top: -0.5em;
+  margin-bottom: 0;
+}
+.typo3-docheader-buttons + .db_list-searchbox-toolbar {
+  -webkit-box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.15);
+  box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.15);
   position: absolute;
   z-index: 2000;
   width: 100%;
 }
-#typo3-docheader .db_list-searchbox-toolbar input {
-  cursor: auto !important;
-  margin-right: 10px !important;
+.typo3-docheader-buttons + .db_list-searchbox-toolbar .panel {
+  border-radius: 0;
+  border: 0;
+  margin: 0;
+}
+.typo3-docheader-buttons + .db_list-searchbox-toolbar .panel-default {
+  background-color: #eee;
+}
+#typo3-browse-links-php .db_list-searchbox-toolbar form {
+  padding: 0;
 }
-#typo3-docheader .db_list-searchbox-toolbar select {
-  vertical-align: text-bottom !important;
-  margin-right: 10px !important;
+#typo3-browse-links-php .db_list-searchbox-toolbar .panel {
+  margin: 0.5em 0;
 }
 .t3icon-ext-upload {
   background: url('../../../../icons/gfx/upload.gif') 3px 4px no-repeat !important;