- client: Fix whois cell styles

Close #2069

* commit '15a82233f3dc8b5307e3edef2214f98ab408de64':
  - client: Fix whois cell styles

client/src/components/Logs/Logs.css

@@ -388,3 +388,28 @@
 .logs__table .loading:before {
     min-height: 100%;
 }
+
+.logs__whois {
+    display: inline;
+    font-size: 12px;
+    white-space: nowrap;
+}
+
+.logs__whois::after {
+    content: "|";
+    padding: 0 5px;
+    opacity: 0.3;
+}
+
+.logs__whois:last-child::after {
+    content: "";
+}
+
+.logs__whois-icon.icons {
+    position: relative;
+    top: -2px;
+    width: 12px;
+    height: 12px;
+    margin-right: 1px;
+    opacity: 0.5;
+}

client/src/components/Settings/Clients/whoisCell.js

@@ -14,7 +14,7 @@ const getFormattedWhois = (value, t) => {
                 <div key={key} title={t(key)}>
                     {icon && (
                         <Fragment>
-                            <svg className="logs__whois-icon text-muted-dark icons">
+                            <svg className="logs__whois-icon text-muted-dark icons icon--24">
                                 <use xlinkHref={`#${icon}`} />
                             </svg>
                             &nbsp;

client/src/helpers/renderFormattedClientCell.js

@@ -9,7 +9,7 @@ const getFormattedWhois = (whois) => {
             .map((key) => {
                 const icon = WHOIS_ICONS[key];
                 return (
-                    <span className="logs__whois text-muted " key={key} title={whoisInfo[key]}>
+                    <span className="logs__whois text-muted" key={key} title={whoisInfo[key]}>
                     {icon && (
                         <>
                             <svg className="logs__whois-icon icons icon--18">