Merge: - client: fix container padding

Closes #1921

Squashed commit of the following:

commit b893ddf31e2251c9d0a77d14c0bc86d1d8608c0a
Author: Ildar Kamalov <ik@adguard.com>
Date:   Fri Jul 24 14:41:50 2020 +0300

    - client: fix container padding

commit 111f53bed2b944febc1f55de24e99cd49801120b
Author: Ildar Kamalov <ik@adguard.com>
Date:   Fri Jul 24 14:40:36 2020 +0300

    - client: npm audit fix

client/package-lock.json

@@ -10168,9 +10168,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.15",
+      "version": "4.17.19",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
-      "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
+      "integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
     },
     "lodash-es": {
       "version": "4.17.15",
@@ -13491,8 +13491,7 @@
         },
         "kind-of": {
           "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
+          "resolved": "",
-          "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==",
           "dev": true
         }
       }

client/package.json

@@ -19,7 +19,7 @@
         "i18next": "^19.4.4",
         "i18next-browser-languagedetector": "^4.2.0",
         "ipaddr.js": "^1.9.1",
-        "lodash": "^4.17.15",
+        "lodash": "^4.17.19",
         "nanoid": "^3.1.9",
         "prop-types": "^15.7.2",
         "query-string": "^6.13.1",

client/src/components/App/index.css

@@ -28,10 +28,6 @@ body {
 }
 
 @media screen and (max-width: 992px) {
-    .container {
-        padding: 0 !important;
-    }
-
     .container--wrap {
         min-height: calc(100vh);
     }

client/src/components/Logs/Filters/Form.js

@@ -143,10 +143,11 @@ const Form = (props) => {
     const normalizeOnBlur = (data) => data.trim();
 
     return (
-        <form className="d-flex flex-wrap form-control--container"
+        <form
-              onSubmit={(e) => {
+            className="d-flex flex-wrap form-control--container"
-                  e.preventDefault();
+            onSubmit={(e) => {
-              }}
+                e.preventDefault();
+            }}
         >
             <div className="field__search">
                 <Field
@@ -166,13 +167,21 @@ const Form = (props) => {
                 <Field
                     name={FORM_NAMES.response_status}
                     component="select"
-                    className={classNames('form-control custom-select custom-select--logs custom-select__arrow--left ml-small form-control--transparent', responseStatusClass)}
+                    className={classNames('form-control custom-select custom-select--logs custom-select__arrow--left form-control--transparent', responseStatusClass)}
                 >
                     {Object.values(RESPONSE_FILTER)
                         .map(({
                             query, label, disabled,
-                        }) => <option key={label} value={query}
+                        }) => (
-                                      disabled={disabled}>{t(label)}</option>)}
+                            <option
+                                key={label}
+                                value={query}
+                                disabled={disabled}
+                            >
+                                {t(label)}
+                            </option>
+                        ))
+                    }
                 </Field>
             </div>
         </form>

client/src/components/Logs/Logs.css

@@ -437,12 +437,13 @@
 }
 
 .custom-select__arrow--left {
-    background: #fff url('./chevron-down.svg') no-repeat left 0.2rem center;
+    background: #fff url('./chevron-down.svg') no-repeat;
-    background-size: 1.5rem;
+    background-position: 5px 9px;
+    background-size: 22px;
 }
 
 .custom-select--logs {
-    padding: 0.5rem 0.75rem 0.5rem 1.75rem !important;
+    padding: 0.5rem 0.75rem 0.5rem 2rem !important;
 }
 
 .bg--danger {
@@ -511,6 +512,8 @@
 
     .field__select {
         margin-top: 1.5rem;
+        padding-left: 24px;
+        padding-right: 24px;
     }
 }