Improves facet view with smaller buttons and styles

composer.lock

@@ -1625,11 +1625,11 @@
         },
         {
             "name": "t3o/t3olayout",
-            "version": "1.0.8",
+            "version": "1.0.9",
             "source": {
                 "type": "git",
                 "url": "https://git-t3o.typo3.org/t3o/t3olayout.git",
-                "reference": "f076f24e7cd75c9aaf70196dc533a95a6a93645c"
+                "reference": "30ce7a4a02711578191cf57e3ca11ec946715d6a"
             },
             "require": {
                 "typo3-ter/ig-ldap-sso-auth": "^3.2"
@@ -1648,7 +1648,7 @@
             "keywords": [
                 "TYPO3 CMS"
             ],
-            "time": "2017-09-04T15:13:14+00:00"
+            "time": "2017-09-14T10:29:21+00:00"
         },
         {
             "name": "typo3-ter/ig-ldap-sso-auth",

html/typo3conf/ext/ter_layout/Resources/Private/Partials/Solr/Facets/OptionsTypo3.html

@@ -8,12 +8,12 @@
 <div class="card-block">
     <div class="facet-option-list facet-type-options fluidfacet" data-facet-name="{facet.name}" data-facet-label="{facet.label}">
         <f:for each="{facet.options}" as="option" iteration="iteration">
-            <a class="btn btn-outline-{facet.configuration.itemClass} mb-1 facet solr-ajaxified" href="{s:uri.facet.addFacetItem(facet: facet, facetItem: option)}">
+            <a class="btn btn-outline-{facet.configuration.itemClass} btn-sm mb-1 facet solr-ajaxified" href="{s:uri.facet.addFacetItem(facet: facet, facetItem: option)}">
                 <strong>
                     {option.label}
                     <span class="badge badge-{facet.configuration.itemClass}">{option.documentCount}</span>
                 </strong>
-            </a><br>
+            </a>
         </f:for>
     </div>
 </div>

html/typo3conf/ext/ter_layout/Resources/Private/Partials/Solr/Result/Facets.html

@@ -6,28 +6,30 @@
     <div id="tx-solr-faceting">
         <div class="card-container">
             <f:if condition="{resultSet.facets.used -> f:count()}">
-                <div id="tx-solr-facets-in-use">
-                    <h3>
+                <div class="card card-size-large" id="tx-solr-facets-in-use">
+                    <div class="card-header">
                         <s:translate key="faceting_resultsNarrowedBy">Used facets</s:translate>
-                    </h3>
-                    <ul class="facets list-unstyled">
-                        <f:for each="{resultSet.facets.used}" as="facet">
-                            <f:for each="{facet.allFacetItems.selected}" as="item">
-                                <li class="mb-1">
-                                    <a href="{s:uri.facet.removeFacetItem(facet: facet, facetItem: item)}" class="btn btn-{facet.configuration.itemClass} facet remove-facet-option solr-ajaxified">
-                                        <strong><i class="fa fa-times"></i> {facet.configuration.prefix}{item.label}</strong>
-                                    </a>
-                                </li>
+                    </div>
+                    <div class="card-block">
+                        <ul class="facets list-unstyled">
+                            <f:for each="{resultSet.facets.used}" as="facet">
+                                <f:for each="{facet.allFacetItems.selected}" as="item">
+                                    <li class="mb-1">
+                                        <a href="{s:uri.facet.removeFacetItem(facet: facet, facetItem: item)}" class="btn btn-{facet.configuration.itemClass} btn-sm facet remove-facet-option solr-ajaxified">
+                                            <strong><i class="fa fa-times"></i> {facet.configuration.prefix}{item.label}</strong>
+                                        </a>
+                                    </li>
+                                </f:for>
                             </f:for>
-                        </f:for>
-                        <li class="facets-remove-all mt-3">
-                            <a href="{s:uri.facet.removeAllFacets()}" class="btn btn-primary solr-ajaxified">
-                                <strong><i class="fa fa-times"></i>
-                                    <s:translate key="faceting_removeAllFilters">Remove all filters</s:translate>
-                                </strong>
-                            </a>
-                        </li>
-                    </ul>
+                        </ul>
+                    </div>
+                    <div class="">
+                        <a href="{s:uri.facet.removeAllFacets()}" class="btn btn-primary btn-block solr-ajaxified">
+                            <strong><i class="fa fa-times"></i>
+                                <s:translate key="faceting_removeAllFilters">Remove all filters</s:translate>
+                            </strong>
+                        </a>
+                    </div>
                 </div>
             </f:if>