diff --git a/static/styles.css b/static/styles.css
index 2a41cb9..07a5202 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -776,6 +776,8 @@ iframe {
}
.container .column_content .field .json,
.container .column_content .field .data {
+ font-family: "Courier New", Courier, monospace;
+ font-size: 0.9rem;
white-space: pre-wrap;
word-break: break-all;
margin-top: 1rem;
@@ -783,7 +785,6 @@ iframe {
.container .column_content .field .json .key,
.container .column_content .field .data .key {
display: inline-block;
- margin-top: 0.5rem;
}
.theme--default .container .column_content .field .json .key,
.theme--default .container .column_content .field .data .key {
@@ -801,6 +802,10 @@ iframe {
.theme--dark .container .column_content .field .data .string {
color: #fafafa;
}
+.container .column_content .field .json .string.content,
+.container .column_content .field .data .string.content {
+ word-break: normal;
+}
.container .column_content .field .json .number,
.container .column_content .field .data .number {
color: darkorange;
diff --git a/static/styles.scss b/static/styles.scss
index 26fc564..ef842db 100644
--- a/static/styles.scss
+++ b/static/styles.scss
@@ -713,12 +713,13 @@ iframe {
}
.json,
.data {
+ font-family: 'Courier New', Courier, monospace;
+ font-size: 0.9rem;
white-space: pre-wrap;
word-break: break-all;
margin-top: 1rem;
.key {
display: inline-block;
- margin-top: 0.5rem;
@include themed() {
color: t($accent1);
}
@@ -727,6 +728,9 @@ iframe {
@include themed() {
color: t($base7);
}
+ &.content {
+ word-break: normal;
+ }
}
.number {
color: darkorange;
diff --git a/templates/head_common.html b/templates/head_common.html
index 14d7725..6670e57 100644
--- a/templates/head_common.html
+++ b/templates/head_common.html
@@ -1,2 +1,2 @@
-
+
diff --git a/templates/scripts.js b/templates/scripts.js
index 253cfa7..f6557ec 100644
--- a/templates/scripts.js
+++ b/templates/scripts.js
@@ -85,13 +85,17 @@ function syntaxHighlight(json) {
json = json.replace(/&/g, '&').replace(//g, '>')
return json.replace(
/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g,
- function (match) {
+ function (match, p1) {
var cls = 'number'
if (/^"/.test(match)) {
if (/:$/.test(match)) {
cls = 'key'
} else {
- cls = 'string'
+ if (p1.length < 100) {
+ cls = 'string'
+ } else {
+ cls = 'string content'
+ }
}
} else if (/true|false/.test(match)) {
cls = 'boolean'