mirror of
https://github.com/retailcrm/NelmioApiDocBundle.git
synced 2025-02-02 23:59:26 +03:00
Port UI updates from Api-Platform
This commit is contained in:
Guilhem Niot
parent
f1c16dc583
commit
47620f606a
291
Resources/public/style.css
Normal file
291
Resources/public/style.css
Normal file
@ -0,0 +1,291 @@
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
overflow: -moz-scrollbars-vertical;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
body {
|
||||
margin:70px 0 0;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/** HEADER **/
|
||||
|
||||
header:before {
|
||||
content:"";
|
||||
background-color:#27848E;
|
||||
height:70px;
|
||||
width:100%;
|
||||
text-align:center;
|
||||
position:fixed;
|
||||
top:0;
|
||||
z-index:100;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
}
|
||||
|
||||
header #logo {
|
||||
position:fixed;
|
||||
top : 35px;
|
||||
right:40px;
|
||||
z-index:102;
|
||||
transform:translateY(-50%);
|
||||
}
|
||||
|
||||
header #logo img {
|
||||
height:48px;
|
||||
background-color:rgba(40, 134, 144, 0.4)
|
||||
}
|
||||
|
||||
/** INCREASE WRAPPER BLOC PADDING **/
|
||||
|
||||
#swagger-ui.api-platform .wrapper {
|
||||
padding:0px 60px;
|
||||
}
|
||||
|
||||
|
||||
/** INFORMATIONS BLOC **/
|
||||
|
||||
#swagger-ui.api-platform .information-container.wrapper {
|
||||
margin:0;
|
||||
padding:10px 0 0;
|
||||
width:100%;
|
||||
max-width:100%;
|
||||
background-color:white;
|
||||
border-bottom:1px solid #ccc;
|
||||
margin-bottom:30px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .info .title {
|
||||
color:#3caab5;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .info {
|
||||
width: 100%;
|
||||
max-width: 1460px;
|
||||
padding: 0px 50px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
/** METHODS BLOCS **/
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-get .opblock-summary-method {
|
||||
background-color:#3CAAB5;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-put .opblock-summary-method {
|
||||
background-color:#E6C229;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-post .opblock-summary-method {
|
||||
background-color:#78BC61;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-delete .opblock-summary-method {
|
||||
background-color:#ED6A5A;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-deprecated .opblock-summary-method {
|
||||
background-color:#ebebeb;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-get .opblock-summary {
|
||||
border-color:#3CAAB5;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-put .opblock-summary {
|
||||
border-color:#E6C229;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-post .opblock-summary {
|
||||
border-color:#78BC61;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-delete .opblock-summary {
|
||||
border-color:#ED6A5A;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-deprecated .opblock-summary {
|
||||
border-color:#ebebeb;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-summary-method {
|
||||
border-radius:0;
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-summary {
|
||||
padding:0;
|
||||
}
|
||||
#swagger-ui.api-platform .opblock-tag {
|
||||
padding:5px 0;
|
||||
margin:0 0 10px;
|
||||
}
|
||||
#swagger-ui.api-platform .opblock-tag:hover {
|
||||
background-color:rgba(0,0,0,.1);
|
||||
transform:scale(1.01);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock-section-header, #swagger-ui.api-platform .opblock.opblock-get .opblock-section-header {
|
||||
background-color:rgba(60,170,181,0.1);
|
||||
box-shadow:none;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-post .opblock-section-header {
|
||||
background-color:rgba(120,188,97,0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-put .opblock-section-header {
|
||||
background-color:rgba(230, 194, 41, 0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-delete .opblock-section-header {
|
||||
background-color:rgba(237,106,90,0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock.opblock-deprecated .opblock-section-header {
|
||||
background-color:rgba(235,235,235,0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .opblock {
|
||||
border-radius:0;
|
||||
background-color:white;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
margin:0 0 10px;
|
||||
padding:0;
|
||||
border:none!important;
|
||||
}
|
||||
|
||||
#swagger-ui .topbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/** FORMATS **/
|
||||
|
||||
#formats {
|
||||
text-align:right;
|
||||
font-family: Open Sans,sans-serif;
|
||||
width: 100%;
|
||||
max-width: 1460px;
|
||||
padding: 0px 60px;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
|
||||
/** BUTTONS **/
|
||||
|
||||
#swagger-ui.api-platform .btn.execute {
|
||||
background-color:#3CAAB5;
|
||||
border-color:#3CAAB5;
|
||||
animation:none;
|
||||
transition:all ease 0.3s;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn.execute:hover {
|
||||
background-color:#288690;
|
||||
border-color:#288690;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .execute-wrapper {
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .execute-wrapper .btn {
|
||||
width:auto;
|
||||
padding:10px 40px;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn-group {
|
||||
max-width: 500px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn-group .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 {
|
||||
background-color:rgba(65,68,78,0.1);
|
||||
border-color:transparent;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn.cancel:hover {
|
||||
background-color:rgba(237,106,90,0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .btn.authorize:hover {
|
||||
background-color:rgba(120,188,97,0.1);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform select {
|
||||
box-shadow:none;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
|
||||
/** FIX TABS SEPARATOR **/
|
||||
|
||||
#swagger-ui.api-platform .tab li:first-of-type:after {
|
||||
content : none;
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .tab li {
|
||||
padding:0px 5px;
|
||||
border-right:1px solid rgba(0,0,0,.2);
|
||||
}
|
||||
|
||||
#swagger-ui.api-platform .tab li:last-of-type {
|
||||
border-right:none;
|
||||
}
|
||||
|
||||
|
||||
/** REMOVE HIGHLIGHTS FOCUS INPUTS **/
|
||||
|
||||
#swagger-ui.api-platform input:focus,
|
||||
#swagger-ui.api-platform select:focus,
|
||||
#swagger-ui.api-platform textarea:focus,
|
||||
#swagger-ui.api-platform button:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
||||
/** REMOVE TITILIUM FONT **/
|
||||
|
||||
.swagger-ui .opblock-tag,
|
||||
.swagger-ui .opblock .opblock-section-header label,
|
||||
.swagger-ui .opblock .opblock-section-header h4,
|
||||
.swagger-ui .opblock .opblock-summary-method,
|
||||
.swagger-ui .tab li,
|
||||
.swagger-ui .scheme-container .schemes>label,
|
||||
.swagger-ui .loading-container .loading:after,
|
||||
.swagger-ui .btn,
|
||||
.swagger-ui .btn.cancel,
|
||||
.swagger-ui select,
|
||||
.swagger-ui label,
|
||||
.swagger-ui .dialog-ux .modal-ux-content h4,
|
||||
.swagger-ui .dialog-ux .modal-ux-header h3,
|
||||
.swagger-ui section.models h4,
|
||||
.swagger-ui section.models h5,
|
||||
.swagger-ui .model-title,
|
||||
.swagger-ui .parameter__name,
|
||||
.swagger-ui .topbar a,
|
||||
.swagger-ui .topbar .download-url-wrapper .download-url-button,
|
||||
.swagger-ui .info .title small pre,
|
||||
.swagger-ui .scopes h2,
|
||||
.swagger-ui .errors-wrapper hgroup h4 {
|
||||
font-family: Open Sans,sans-serif!important;
|
||||
}
|
||||
@ -13,38 +13,17 @@ file that was distributed with this source code. #}
|
||||
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700">
|
||||
<link rel="stylesheet" href="{{ asset('bundles/nelmioapidoc/swagger-ui/swagger-ui.css') }}">
|
||||
<style>
|
||||
html
|
||||
{
|
||||
box-sizing: border-box;
|
||||
overflow: -moz-scrollbars-vertical;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
*,
|
||||
*:before,
|
||||
*:after
|
||||
{
|
||||
box-sizing: inherit;
|
||||
}
|
||||
body {
|
||||
margin:0;
|
||||
background: #fafafa;
|
||||
}
|
||||
#swagger-ui .topbar {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="{{ asset('bundles/nelmioapidoc/style.css') }}">
|
||||
|
||||
{# json_encode(65) is for JSON_UNESCAPED_SLASHES|JSON_HEX_TAG to avoid JS XSS #}
|
||||
<script id="swagger-data" type="application/json">{{ swagger_data|json_encode(65)|raw }}</script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<a id="logo" href="https://github.com/nelmio/NelmioApiDocBundle"><img src="{{ asset('bundles/nelmioapidoc/logo.png') }}" alt="NelmioApiDocBundle"></a>
|
||||
</header>
|
||||
|
||||
<body class="swagger-section">
|
||||
<div style="background-color: #253032" class="swagger-ui">
|
||||
<a href="https://github.com/nelmio/NelmioApiDocBundle"><img height="48" src="{{ asset('bundles/nelmioapidoc/logo.png') }}" alt="Nelmio Api Doc"></a>
|
||||
</div>
|
||||
|
||||
<div id="swagger-ui"></div>
|
||||
<div id="swagger-ui" class="api-platform"></div>
|
||||
|
||||
<div class="swagger-ui-wrap" style="margin-top: 20px; margin-bottom: 20px;">
|
||||
© 2017 <a href="https://api-platform.com">Api-Platform</a>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user