make style overrides more specific because loading order isn't guaranteed (#7049)
This commit is contained in:
parent
9c0d9f6fc0
commit
267d5e7e40
|
@ -1,29 +1,25 @@
|
|||
/*THIS FILE LOADS AFTER THE SWAGGER-UI CSS, SO WE'LL USE IT TO OVERRIDE STYLES */
|
||||
|
||||
|
||||
|
||||
.swagger-ui .wrapper {
|
||||
.swagger-ember .swagger-ui .wrapper {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.swagger-ui .info {
|
||||
.swagger-ember .swagger-ui .info {
|
||||
margin: 25px 0;
|
||||
}
|
||||
|
||||
/*hide the swagger-ui headers*/
|
||||
.swagger-ui .filter-container,
|
||||
.swagger-ui .information-container.wrapper {
|
||||
.swagger-ember .swagger-ui .filter-container,
|
||||
.swagger-ember .swagger-ui .information-container.wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*some general de-rounding and removing backgrounds and drop shadows*/
|
||||
.swagger-ui .btn {
|
||||
.swagger-ember .swagger-ui .btn {
|
||||
border-width: 1px;
|
||||
box-shadow: none;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock {
|
||||
.swagger-ember .swagger-ui .opblock {
|
||||
background: none;
|
||||
border-width: 1px;
|
||||
border-radius: 2px;
|
||||
|
@ -31,32 +27,30 @@
|
|||
}
|
||||
|
||||
|
||||
/*START: customize method, path, description so that it's formatted like this:*/
|
||||
/* {method} {path/to/api} */
|
||||
/* {A lengthy description goes here} */
|
||||
.swagger-ui .opblock .opblock-summary,
|
||||
.swagger-ui .opblock .opblock-summary-description {
|
||||
/*customize method, path, description*/
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary,
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary-description {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock .opblock-summary {
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock .opblock-summary-description {
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary-description {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock .opblock-summary-method,
|
||||
.swagger-ui .opblock .opblock-summary-path{
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary-method,
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary-path{
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock .opblock-summary-method {
|
||||
.swagger-ember .swagger-ui .opblock .opblock-summary-method {
|
||||
border-radius: 1px;
|
||||
min-width: auto;
|
||||
text-align: left;
|
||||
|
@ -67,14 +61,13 @@
|
|||
padding: 0 2px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
/*END: customize method, path, description*/
|
||||
|
||||
/*START: make tags look like list items */
|
||||
.swagger-ui .opblock-tag{
|
||||
/*make tags look like list items */
|
||||
.swagger-ember .swagger-ui .opblock-tag{
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock-tag-section .opblock-tag {
|
||||
.swagger-ember .swagger-ui .opblock-tag-section .opblock-tag {
|
||||
color: #0a0a0a;
|
||||
font-weight: 600 !important;
|
||||
font-size: 1rem !important;
|
||||
|
@ -86,9 +79,9 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.swagger-ui .opblock-tag:hover,
|
||||
.swagger-ui .opblock-tag:focus,
|
||||
.swagger-ui .opblock-tag:active {
|
||||
.swagger-ember .swagger-ui .opblock-tag:hover,
|
||||
.swagger-ember .swagger-ui .opblock-tag:focus,
|
||||
.swagger-ember .swagger-ui .opblock-tag:active {
|
||||
margin-left: -0.75rem !important;
|
||||
margin-right: -0.75rem !important;
|
||||
padding-left: 0.75rem;
|
||||
|
@ -98,62 +91,62 @@
|
|||
}
|
||||
|
||||
/*shrink the size of the arrows*/
|
||||
.swagger-ui .expand-methods svg, .swagger-ui .expand-operation svg {
|
||||
.swagger-ember .swagger-ui .expand-methods svg,
|
||||
.swagger-ember .swagger-ui .expand-operation svg {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
/*END: make tags look like list items */
|
||||
|
||||
|
||||
/*operation box - GET (blue) */
|
||||
.swagger-ui .opblock.opblock-get {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-get {
|
||||
background: #f5f8ff;
|
||||
border: 1px solid #bfd4ff;
|
||||
}
|
||||
|
||||
/*operation label*/
|
||||
.swagger-ui .opblock.opblock-get .opblock-summary-method {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-get .opblock-summary-method {
|
||||
color: #1563ff;
|
||||
background: none;
|
||||
}
|
||||
/*and expanded tab highlight */
|
||||
.swagger-ui .opblock.opblock-get .tab-header .tab-item.active h4 span::after {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-get .tab-header .tab-item.active h4 span::after {
|
||||
background: #1563ff;
|
||||
}
|
||||
|
||||
|
||||
/*operation box - POST (green) */
|
||||
.swagger-ui .opblock.opblock-post {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-post {
|
||||
background: #fafdfa;
|
||||
border: 1px solid #c6e9c9;
|
||||
}
|
||||
.swagger-ui .opblock.opblock-post .opblock-summary-method {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-post .opblock-summary-method {
|
||||
color: #2eb039;
|
||||
background: none;
|
||||
}
|
||||
.swagger-ui .opblock.opblock-post .tab-header .tab-item.active h4 span::after {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-post .tab-header .tab-item.active h4 span::after {
|
||||
background: #2eb039;
|
||||
}
|
||||
|
||||
/*operation box - POST (red) */
|
||||
.swagger-ui .opblock.opblock-delete {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-delete {
|
||||
background: #fdfafb;
|
||||
border: 1px solid #f9ecee;
|
||||
}
|
||||
.swagger-ui .opblock.opblock-delete .opblock-summary-method {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-delete .opblock-summary-method {
|
||||
color: #c73445;
|
||||
background: none;
|
||||
}
|
||||
.swagger-ui .opblock.opblock-delete .tab-header .tab-item.active h4 span::after {
|
||||
.swagger-ember .swagger-ui .opblock.opblock-delete .tab-header .tab-item.active h4 span::after {
|
||||
background: #c73445;
|
||||
}
|
||||
|
||||
/*remove "LOADING" from initial loading spinner*/
|
||||
.swagger-ui .loading-container .loading::after {
|
||||
.swagger-ember .swagger-ui .loading-container .loading::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
/*add text about requests to a live vault server*/
|
||||
.swagger-ui .btn.execute::after {
|
||||
.swagger-ember .swagger-ui .btn.execute::after {
|
||||
content: " - send a request with your token to Vault."
|
||||
}
|
||||
|
|
|
@ -40,5 +40,5 @@
|
|||
<NamespaceReminder as |R|>
|
||||
Requests use the header <code>X-Vault-Namespace: {{R.namespace.path}}</code>. You can also use <code>{{R.namespace.path}}</code> as an API prefix. See <DocLink @path="/api/overview#namespaces">docs</DocLink> for examples.
|
||||
</NamespaceReminder>
|
||||
<div id="{{this.elementId}}-swagger"></div>
|
||||
<div id="{{this.elementId}}-swagger" class="swagger-ember"></div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue