+ client: handle filters configuration

client/src/components/ui/CellWrap.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const CellWrap = ({ value }) => (
+    <div className="logs__row logs__row--overflow">
+        <span className="logs__text logs__text--full" title={value}>
+            {value}
+        </span>
+    </div>
+);
+
+CellWrap.propTypes = {
+    value: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.number,
+    ]),
+};
+
+export default CellWrap;

client/src/components/ui/Checkbox.css

@@ -18,7 +18,7 @@
 }
 
 .checkbox--settings .checkbox__label-title {
-    margin-bottom: 5px;
+    margin-bottom: 2px;
     font-weight: 600;
 }
 
@@ -53,7 +53,7 @@
     background-position: center center;
     background-size: 12px 10px;
     border-radius: 3px;
-    transition: 0.3s ease box-shadow;
+    transition: 0.3s ease-in-out box-shadow, 0.3s ease-in-out opacity;
 }
 
 .checkbox__label .checkbox__label-text {
@@ -82,10 +82,13 @@
 }
 
 .checkbox__input:disabled + .checkbox__label {
-    opacity: 0.6;
     cursor: default;
 }
 
+.checkbox__input:disabled + .checkbox__label:before {
+    opacity: 0.6;
+}
+
 .checkbox__label-text {
     max-width: 515px;
     line-height: 1.5;

client/src/components/ui/Checkbox.js

@@ -14,7 +14,7 @@ class Checkbox extends Component {
             t,
         } = this.props;
         return (
-            <div className="form__group">
+            <div className="form__group form__group--checkbox">
                 <label className="checkbox checkbox--settings">
                 <span className="checkbox__marker"/>
                 <input type="checkbox" className="checkbox__input" onChange={handleChange} checked={enabled}/>