mirror of
https://github.com/documenso/documenso.git
synced 2025-11-13 00:03:33 +10:00
feat: added custom styling for swagger ui
Signed-off-by: Adithya Krishna <aadithya794@gmail.com>
This commit is contained in:
101
packages/api/v1/api-documentation.css
Normal file
101
packages/api/v1/api-documentation.css
Normal file
@ -0,0 +1,101 @@
|
||||
#swagger-ui.api-platform .wrapper {
|
||||
padding: 0 60px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .information-container.wrapper {
|
||||
margin: 0 0 30px;
|
||||
padding: 10px 0 0;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
background-color: white;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .info, #formats {
|
||||
width: 100%;
|
||||
max-width: 1460px;
|
||||
padding: 0 50px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock .opblock-summary-method,
|
||||
#swagger-ui.api-platform .btn.execute {
|
||||
transition: all ease 0.3s;
|
||||
background-color: #3CAAB5;
|
||||
border-color: #3CAAB5;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock .opblock-summary-method:hover,
|
||||
#swagger-ui.api-platform .btn.execute:hover {
|
||||
background-color: #288690;
|
||||
border-color: #288690;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-summary {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-tag:hover {
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
transform: scale(1.01);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-get,
|
||||
#swagger-ui.api-platform .opblock-section-header,
|
||||
#swagger-ui.api-platform .opblock-summary {
|
||||
background-color: rgba(60, 170, 181, 0.1);
|
||||
border-color: #3CAAB5;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-summary-method {
|
||||
border-radius: 0;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-tag, .swagger-ui .table-container tr th,
|
||||
.swagger-ui .table-container tr td {
|
||||
padding: 5px 0;
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn-group .btn, #swagger-ui.api-platform .execute-wrapper .btn {
|
||||
padding: 10px 40px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn {
|
||||
transition: all ease 0.2s;
|
||||
box-shadow: none;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn:hover, #swagger-ui.api-platform .btn.cancel:hover,
|
||||
#swagger-ui.api-platform .btn.authorize:hover {
|
||||
background-color: rgba(65, 68, 78, 0.1);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform select, #swagger-ui.api-platform input:focus,
|
||||
#swagger-ui.api-platform select:focus, #swagger-ui.api-platform textarea:focus,
|
||||
#swagger-ui.api-platform button:focus {
|
||||
box-shadow: none;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.swagger-ui .markdown p, .swagger-ui .markdown pre,
|
||||
.swagger-ui .renderedMarkdown p, .swagger-ui .renderedMarkdown pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
:disabled::placeholder, :disabled:-moz-placeholder,
|
||||
:disabled::-moz-placeholder, :disabled:-ms-input-placeholder {
|
||||
color: #fafafa;
|
||||
}
|
||||
|
||||
#swagger-ui .topbar {
|
||||
display: none;
|
||||
}
|
||||
@ -5,6 +5,10 @@ import 'swagger-ui-react/swagger-ui.css';
|
||||
|
||||
import { OpenAPIV1 } from '@documenso/api/v1/openapi';
|
||||
|
||||
// Custom CSS for the Swagger UI
|
||||
// eslint-disable-next-line prettier/prettier
|
||||
import './api-documentation.css';
|
||||
|
||||
export const OpenApiDocsPage = () => {
|
||||
return <SwaggerUI spec={OpenAPIV1} displayOperationId={true} />;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user