Merge branch 'master' into implement-ace-instead-highlightjs

assets/css/styles.scss

@@ -12,16 +12,23 @@ html {
 ::-webkit-scrollbar {
   width: 8px;
   height: 8px;
+  border-radius: 8px;
+  background-color: var(--bg-dark-color);
+  visibility: hidden;
+
+  &:hover {
+    visibility: visible;
+  }
 }
 
 ::-webkit-scrollbar-thumb {
   background-color: var(--fg-light-color);
   border-radius: 8px;
   border: 2px solid var(--bg-color);
-}
 
-::-webkit-scrollbar-thumb:hover {
-  background-color: var(--fg-color);
+  &:hover {
+    background-color: var(--fg-color);
+  }
 }
 
 ::placeholder {
@@ -402,7 +409,7 @@ button {
   &:not([disabled]):focus {
     color: var(--act-color);
     fill: var(--act-color);
-    box-shadow: 0 0 0 2px var(--fg-color);
+    box-shadow: inset 0 0 0 2px var(--fg-color);
     transition: all 0.2s ease-in-out;
   }
 
@@ -595,6 +602,11 @@ ol {
   margin: 4px 0 4px;
   padding: 0;
   list-style-type: none;
+
+  ul,
+  ol {
+    margin: 0;
+  }
 }
 
 ul li,
@@ -663,19 +675,18 @@ ol li {
   background-color: var(--err-color);
 }
 
-.virtual-list::-webkit-scrollbar {
-  width: 0;
-}
-
 fieldset#history {
   .method-list-item {
     position: relative;
 
     span {
       position: absolute;
-      top: 12px;
-      right: 12px;
+      top: 8px;
+      right: 8px;
       font-family: 'Roboto Mono', monospace;
+      background-color: var(--bg-color);
+      padding: 4px 8px;
+      border-radius: 8px;
     }
   }
 }
@@ -692,6 +703,10 @@ fieldset#history {
   text-align: right;
 }
 
+.mono {
+  font-family: 'Roboto Mono', monospace;
+}
+
 #response-details-wrapper {
   position: relative;
   overflow: hidden;