Improve large sidebar counters (#23)

- We need 3 digits, make flatter badge
- everything above 999: show 1K etc.
- everything about 99K: 99K and that's it....

news/23.feature

@@ -0,0 +1 @@
+Add support for sidebar facet conditions @reebalazs

src/components/theme/SolrSearch/SearchConditionsValue.jsx

@@ -5,6 +5,13 @@ const ValueLabel = ({ value }) => (
   <span className="searchConditionsHasValueLabel">{value}</span>
 );
 
+const formattedCounter = (value) =>
+  value < 1000
+    ? `${value}`
+    : value < 100000
+    ? `${Math.floor(value / 1000)}K`
+    : '99K';
+
 export const SearchConditionsValue = ({
   fieldDef,
   value,
@@ -24,7 +31,7 @@ export const SearchConditionsValue = ({
         <div className="searchConditionsValue">
           {counter != null ? (
             <div className="searchConditionsCounter ui circular label lightgrey">
-              {counter < 100 ? counter : '...'}
+              {formattedCounter(100)}
             </div>
           ) : (
             <div className="searchConditionsCounter" />

src/theme/solrsearch.less

@@ -311,7 +311,7 @@
           white-space: nowrap;
         }
         .searchConditionsCounter {
-          width: 2em;
+          width: 3em;
           flex: 0 0 auto;
           font-weight: bold;
           text-align: center;