Swagger UI's layout could be better

Question

(Note: This is an opinion post -- nothing more than a statement. It's not a call for advice)&nbsp;Swagger UI's layout could be much, much better.It's extremely wide, despite most users using it on computers (which already have a wide screen).It means that it's a lot of scrolling up and down, while most of the lateral space is wasted.&nbsp;HOW IT LOOKS:&nbsp;&nbsp;CONTROLLER 1&nbsp; &nbsp;GET /endpoint1&nbsp; &nbsp; &nbsp;VparametersTry it out&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;ExecuteClear&nbsp; &nbsp;ResponsescodeDetails200...................................................................................................................................&nbsp; &nbsp;POST/endpoint2VparametersTry it out&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;ExecuteClear&nbsp; &nbsp;ResponsescodeDetails200...................................................................................................................................&nbsp;&nbsp; &nbsp;GET /endpoint3&nbsp; &nbsp; &nbsp;VparametersTry it out&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;ExecuteClear&nbsp; &nbsp;ResponsescodeDetails200...................................................................................................................................&nbsp;&nbsp;CONTROLLER 2&nbsp; &nbsp;GET /endpoint1&nbsp; &nbsp; &nbsp;VparametersTry it out&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;ExecuteClear&nbsp; &nbsp;ResponsescodeDetails200...................................................................................................................................&nbsp;&nbsp;&nbsp;&nbsp;HOW IT COULD LOOK&nbsp;Clickable list of all controllers:CONTROLLER 1&nbsp; GET /endpoint1&nbsp; POST /endpoint2&nbsp; GET /endpoint3&nbsp;CONTROLLER 2&nbsp; &nbsp;GET /endpoint1Details of currently selected controller:GET /endpoint 1parameters :&nbsp;...............ExecuteClear&nbsp;&nbsp;&nbsp;Responses :&nbsp;CodeDetails200..............................................................................................................................................................&nbsp;&nbsp;By the way I know that SwaggerUI is customizable.I'm not asking how to customize, I'm just saying that the basic layout could do better.&nbsp;

ponelat · Answer

Thanks&nbsp;mathieuber&nbsp;, it's definitely worth considering how to improve the layout. The team have been looking at different ways to approach it and a three-column layout was one of them.
&nbsp;
I'll see if I can share some screenshots. I appreciate your illustration of what it could look like 🙂

Forum Discussion

Swagger UI's layout could be better

Related Content

Layout background color

Swagger Response In Array

Swagger - parameter not showing in Swagger-UI

Log4j Vulnerability - Swagger

SoapUI 5.6.0 import swagger -> unknown swagger version

Recent Discussions

requestInterceptor with Python

Swagger - hide definition, BUT....

PhonePe में गलत ट्रांजेक्शन से पैसे वापस कैसे पाएं?

Customize Swagger like spotify web console

Handling unknown subtypes with OpenAPI discriminator property