Change Stylesheet on Request Bodies to Improve Curly Brace Readability

[kentbulza]

The choice of style for the request body in the terminal pseudo-emulator for HTTP requests makes the curly braces unreadable. The background and font color are too close to be readable. In particular see the image below for an empty body:

Context

I'd like the text to be more readable.

Current Behavior

The image below of an empty body demonstrates in particular the illegibility of the curly brace text.

Expected Behavior

Possible Solution(s)

Using white or a lighter gray color as you do for the headers would be more legible. The choice of color for the elements, as shown below, make those readable. It's only the curly braces that are difficult to see.

[brendarearden]

Could you provide a minimal example of how are you are using this? It is possible that one of your classes is overriding the style, as we are not able to reproduce this with any of our example apps. We are using token and punctuation on this element.

[kentbulza]

Using your Bootstrap example with no custom stylesheets:

<!-- Elements: Web Component -->
<script src="https://unpkg.com/@stoplight/elements-dev-portal/web-components.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/@stoplight/elements-dev-portal/styles.min.css">

<!-- Twitter Bootstrap -->
<link rel="stylesheet" href="https://stackpath.bootstrapthecdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<!-- Twitter Bootstrap: Sticky Footer Example -->
<link rel="stylesheet" href="https://getbootstrap.com/docs/4.5/examples/sticky-footer-navbar/sticky-footer-navbar.css">

I certainly can modify one of the stylesheets to get what I want, but I was hoping to avoid customization for ease of maintenance.

[github-actions[bot]]

This ticket has been labeled jira. A tracking ticket in Stoplight's Jira (STOP-346) has been created.