OpenAPI viewer with Dark Mode theme is unreadable

Summary

The OpenApi Viewer is unreadable with the alpha Dark Mode theme

Steps to reproduce

• Generate a sample openAPI file
• Add to a gitlab repository
• Set the theme to "Dark Mode":

• Attempt to read the OpenAPI document

• File tree view

Example Project

This project contains a sample OpenAPI document.

https://gitlab.com/Hydragyrum/api-doc

(Direct link: https://gitlab.com/Hydragyrum/api-doc/-/blob/master/specification/dummy-api-openapi-v3.yaml)

What is the current bug behavior?

The document is perfectly fine with the white backgrounds, but unreadable with a dark background.

What is the expected correct behavior?

A CSS theme for swagger adapted for dark mode should be applied when the background is dark.

Relevant logs and/or screenshots

Output of checks

This bug happens on GitLab.com (and on private gitlab instances)

Results of GitLab environment info

Expand for output related to GitLab environment info

N/A

Results of GitLab application Check

Expand for output related to the GitLab application check

N/A

Possible fixes

Implementation Guide

1. Add swagger-ui-themes package
2. Check for darkModeEnabled in app/assets/javascripts/blob/openapi/index.js
3. If dark mode enabled, load the dark swagger theme

OR

add our own Swagger theme to match dark mode and color palette. Better long term, but higher effort upfront.