You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

353 lines
6.9 KiB

  1. html {
  2. box-sizing: border-box;
  3. overflow: -moz-scrollbars-vertical;
  4. overflow-y: scroll;
  5. }
  6. *,
  7. *:before,
  8. *:after {
  9. box-sizing: inherit;
  10. }
  11. body {
  12. margin: 70px 0 0;
  13. background: #f0f0f0;
  14. }
  15. /** HEADER **/
  16. header:before {
  17. content: "";
  18. background-color: #288690;
  19. height: 70px;
  20. width: 100%;
  21. text-align: center;
  22. position: fixed;
  23. top: 0;
  24. z-index: 100;
  25. box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
  26. }
  27. header #logo {
  28. position: fixed;
  29. top : 35px;
  30. right: 40px;
  31. z-index: 102;
  32. transform: translateY(-50%);
  33. }
  34. header #logo img {
  35. height: 50px;
  36. background-color: rgba(40, 134, 144, .4)
  37. }
  38. /** WEBBY AND WEB **/
  39. .web, .webby {
  40. right: 0;
  41. z-index: 101;
  42. position: fixed;
  43. }
  44. .web {
  45. top: 0;
  46. }
  47. .web:after {
  48. content: "";
  49. opacity: 0;
  50. width: 2px;
  51. height: 70px;
  52. position: fixed;
  53. right: 35px;
  54. background-color: black;
  55. }
  56. .web.calm:after {
  57. opacity: .2;
  58. height: calc(100% - 120px);
  59. transition: height 2s ease-in-out 2s, opacity 0s linear 2s;
  60. }
  61. .web.frighten:after {
  62. opacity: .2;
  63. transition: height 1s ease-in-out;
  64. }
  65. .webby {
  66. opacity: 0;
  67. top: 170px;
  68. transform: translateY(-100%);
  69. }
  70. .webby.calm {
  71. opacity: 1;
  72. top: calc(100% - 30px);
  73. transition: top 2s ease-in-out 2s, opacity 0s linear 2s;
  74. }
  75. .webby.frighten {
  76. opacity: 1;
  77. transition: top 1s ease-in-out;
  78. animation: shake .5s ease-in-out;
  79. }
  80. /** INCREASE WRAPPER BLOCK PADDING **/
  81. #swagger-ui.api-platform .wrapper {
  82. padding: 0 60px;
  83. }
  84. /** INFORMATION BLOCK **/
  85. #swagger-ui.api-platform .information-container.wrapper {
  86. margin: 0 0 30px;
  87. padding: 10px 0 0;
  88. width: 100%;
  89. max-width: 100%;
  90. background-color: white;
  91. border-bottom: 1px solid #ccc;
  92. }
  93. #swagger-ui.api-platform .info .title {
  94. color: #3caab5;
  95. }
  96. #swagger-ui.api-platform .info {
  97. width: 100%;
  98. max-width: 1460px;
  99. padding: 0 50px;
  100. margin: 0 auto;
  101. }
  102. /** METHODS BLOCKS **/
  103. #swagger-ui.api-platform .opblock.opblock-get .opblock-summary-method {
  104. background-color: #3caab5;
  105. }
  106. #swagger-ui.api-platform .opblock.opblock-put .opblock-summary-method {
  107. background-color: #e6c229;
  108. }
  109. #swagger-ui.api-platform .opblock.opblock-post .opblock-summary-method {
  110. background-color: #78bc61;
  111. }
  112. #swagger-ui.api-platform .opblock.opblock-delete .opblock-summary-method {
  113. background-color: #ed6a5a;
  114. }
  115. #swagger-ui.api-platform .opblock.opblock-deprecated .opblock-summary-method {
  116. background-color: #ebebeb;
  117. }
  118. #swagger-ui.api-platform .opblock.opblock-get .opblock-summary {
  119. border-color: #3caab5;
  120. }
  121. #swagger-ui.api-platform .opblock.opblock-put .opblock-summary {
  122. border-color: #e6c229;
  123. }
  124. #swagger-ui.api-platform .opblock.opblock-post .opblock-summary {
  125. border-color: #78bc61;
  126. }
  127. #swagger-ui.api-platform .opblock.opblock-delete .opblock-summary {
  128. border-color: #ed6a5a;
  129. }
  130. #swagger-ui.api-platform .opblock.opblock-deprecated .opblock-summary {
  131. border-color: #ebebeb;
  132. }
  133. #swagger-ui.api-platform .opblock-summary-method {
  134. border-radius: 0;
  135. padding: 10px;
  136. }
  137. #swagger-ui.api-platform .opblock-summary {
  138. padding: 0;
  139. }
  140. #swagger-ui.api-platform .opblock-tag {
  141. padding: 5px 0;
  142. margin: 0 0 10px;
  143. }
  144. #swagger-ui.api-platform .opblock-tag:hover {
  145. background-color: rgba(0, 0, 0, .1);
  146. transform: scale(1.01);
  147. }
  148. #swagger-ui.api-platform .opblock-section-header, #swagger-ui.api-platform .opblock.opblock-get .opblock-section-header {
  149. background-color: rgba(60, 170, 181, .1);
  150. box-shadow: none;
  151. }
  152. #swagger-ui.api-platform .opblock.opblock-post .opblock-section-header {
  153. background-color: rgba(120, 188, 97, .1);
  154. }
  155. #swagger-ui.api-platform .opblock.opblock-put .opblock-section-header {
  156. background-color: rgba(230, 194, 41, .1);
  157. }
  158. #swagger-ui.api-platform .opblock.opblock-delete .opblock-section-header {
  159. background-color: rgba(237, 106, 90, .1);
  160. }
  161. #swagger-ui.api-platform .opblock.opblock-deprecated .opblock-section-header {
  162. background-color: rgba(235, 235, 235, .1);
  163. }
  164. #swagger-ui.api-platform .opblock {
  165. border-radius: 0;
  166. background-color: white;
  167. box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
  168. margin: 0 0 10px;
  169. padding: 0;
  170. border: none !important;
  171. }
  172. #swagger-ui .topbar {
  173. display: none;
  174. }
  175. /** FORMATS **/
  176. #formats {
  177. text-align: right;
  178. font-family: Open Sans, sans-serif;
  179. width: 100%;
  180. max-width: 1460px;
  181. padding: 0 60px;
  182. margin: 0 auto;
  183. }
  184. /** BUTTONS **/
  185. #swagger-ui.api-platform .btn.execute {
  186. background-color: #3caab5;
  187. border-color: #3caab5;
  188. animation: none;
  189. transition: all ease .3s;
  190. }
  191. #swagger-ui.api-platform .btn.execute:hover {
  192. background-color: #288690;
  193. border-color: #288690;
  194. }
  195. #swagger-ui.api-platform .execute-wrapper {
  196. text-align: center;
  197. }
  198. #swagger-ui.api-platform .execute-wrapper .btn {
  199. width: auto;
  200. padding: 10px 40px;
  201. }
  202. #swagger-ui.api-platform .btn-group {
  203. max-width: 500px;
  204. margin-left: auto;
  205. margin-right: auto;
  206. }
  207. #swagger-ui.api-platform .btn-group .btn {
  208. padding: 10px 40px;
  209. }
  210. #swagger-ui.api-platform .btn {
  211. transition: all ease .2s;
  212. box-shadow: none;
  213. background-color: #f7f7f7
  214. }
  215. #swagger-ui.api-platform .btn:hover {
  216. background-color: rgba(65, 68, 78, .1);
  217. border-color: transparent;
  218. }
  219. #swagger-ui.api-platform .btn.cancel:hover {
  220. background-color: rgba(237, 106, 90, .1);
  221. }
  222. #swagger-ui.api-platform .btn.authorize:hover {
  223. background-color: rgba(120, 188, 97, .1);
  224. }
  225. #swagger-ui.api-platform select {
  226. box-shadow: none;
  227. cursor: pointer;
  228. }
  229. /** FIX TABS SEPARATOR **/
  230. #swagger-ui.api-platform .tab li:first-of-type:after {
  231. content: none;
  232. }
  233. #swagger-ui.api-platform .tab li {
  234. padding: 0 5px;
  235. border-right: 1px solid rgba(0, 0, 0, .2);
  236. }
  237. #swagger-ui.api-platform .tab li:last-of-type {
  238. border-right: none;
  239. }
  240. /** REMOVE HIGHLIGHTS FOCUS INPUTS **/
  241. #swagger-ui.api-platform input:focus,
  242. #swagger-ui.api-platform select:focus,
  243. #swagger-ui.api-platform textarea:focus,
  244. #swagger-ui.api-platform button:focus {
  245. outline: none;
  246. }
  247. /** USE OPEN SANS FONT **/
  248. .swagger-ui .opblock-tag,
  249. .swagger-ui .opblock .opblock-section-header label,
  250. .swagger-ui .opblock .opblock-section-header h4,
  251. .swagger-ui .opblock .opblock-summary-method,
  252. .swagger-ui .tab li,
  253. .swagger-ui .scheme-container .schemes>label,
  254. .swagger-ui .loading-container .loading:after,
  255. .swagger-ui .btn,
  256. .swagger-ui .btn.cancel,
  257. .swagger-ui select,
  258. .swagger-ui label,
  259. .swagger-ui .dialog-ux .modal-ux-content h4,
  260. .swagger-ui .dialog-ux .modal-ux-header h3,
  261. .swagger-ui section.models h4,
  262. .swagger-ui section.models h5,
  263. .swagger-ui .model-title,
  264. .swagger-ui .parameter__name,
  265. .swagger-ui .topbar a,
  266. .swagger-ui .topbar .download-url-wrapper .download-url-button,
  267. .swagger-ui .info .title small pre,
  268. .swagger-ui .scopes h2,
  269. .swagger-ui .errors-wrapper hgroup h4 {
  270. font-family: Open Sans, sans-serif !important;
  271. }
  272. /** ANIMATIONS **/
  273. @keyframes shake {
  274. 10%, 90% {
  275. transform: translate(-1px, -100%);
  276. }
  277. 20%, 80% {
  278. transform: translate(2px, -100%);
  279. }
  280. 30%, 50%, 70% {
  281. transform: translate(-4px, -100%);
  282. }
  283. 40%, 60% {
  284. transform: translate(4px, -100%);
  285. }
  286. }