Merge pull request #2200 from RedisInsight/fe/feature/RI-4542_json_font

#RI-4542 - add font Inconsolata in json view

Author: mariasergeenko

redisinsight/ui/src/components/json-viewer/JSONViewer.tsx

@@ -9,7 +9,7 @@ interface Props {
 }
 
 const JSONViewer = (props: Props) => {
-  const { value, expanded = false, space = 4 } = props
+  const { value, expanded = false, space = 2 } = props
 
   try {
     JSON.parse(value)

redisinsight/ui/src/packages/clients-list/src/components/json-view/JSONView.tsx

@@ -31,7 +31,7 @@ const JSONView = (props: Props) => {
       )}
       {!formattedValue && (
         <div className="jsonViewer" data-testid="json-view">
-          <JSONPretty json={value} space={4} />
+          <JSONPretty json={value} space={2} />
         </div>
       )}
     </>

redisinsight/ui/src/styles/components/_json_view.scss

@@ -2,8 +2,8 @@
   .__json {
     &-pretty__,
     &-pretty-error__ {
-      font: normal normal normal 13px/18px Graphik, sans-serif;
-      letter-spacing: -0.13px;
+      font: normal normal normal 13px/18px Inconsolata, monospace;
+      letter-spacing: 0.15px;
       padding: 0;
       background: transparent;
       color: var(--euiTextSubduedColor);