|
4 | 4 | <meta charset="UTF-8"/> |
5 | 5 | <meta content="width=device-width, initial-scale=1.0" name="viewport"/> |
6 | 6 | <title th:text="${title}">API Docs</title> |
7 | | - |
8 | | - <style> |
9 | | - body { |
10 | | - margin: 0; |
11 | | - padding: 0; |
12 | | - font-family: system-ui, sans-serif; |
13 | | - background-color: #f7f9fb; |
14 | | - } |
15 | | - |
16 | | - .scalar-header { |
17 | | - padding: 1rem 2rem; |
18 | | - background: linear-gradient(90deg, #005c97, #363795); |
19 | | - color: white; |
20 | | - box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); |
21 | | - } |
22 | | - |
23 | | - .scalar-header h1 { |
24 | | - margin: 0; |
25 | | - font-size: 1.6rem; |
26 | | - } |
27 | | - |
28 | | - .scalar-header p { |
29 | | - margin: 0.2rem 0 0; |
30 | | - opacity: 0.9; |
31 | | - } |
32 | | - |
33 | | - #api-reference { |
34 | | - height: calc(100vh - 90px); |
35 | | - } |
36 | | - </style> |
37 | 7 | </head> |
38 | 8 | <body> |
39 | | -<div id="api-reference"></div> |
40 | | -<script th:inline="javascript" type="module"> |
41 | | - /*<![CDATA[*/ |
42 | | - import { |
43 | | - ScalarApiReference |
44 | | - } from 'https://cdn.jsdelivr.net/npm/@scalar/api-reference@1.38.1/dist/browser/standalone.module.js'; |
45 | 9 |
|
46 | | - const specUrl = [[${specUrl}]] || '/v3/api-docs'; |
47 | | - const theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; |
| 10 | +<header> |
| 11 | + <h1 th:text="${title}">SmartPot API</h1> |
| 12 | + <p th:text="${description}"> |
| 13 | + Documentación de la API REST con Scalar UI |
| 14 | + </p> |
| 15 | + <small>v<span th:text="${version}">1.0.0</span></small> |
| 16 | +</header> |
| 17 | + |
| 18 | +<script id="api-reference" th:attr="data-url=${specUrl}"></script> |
| 19 | + |
| 20 | +<script src="https://cdn.jsdelivr.net/npm/@scalar/api-reference"></script> |
48 | 21 |
|
49 | | - document.addEventListener("DOMContentLoaded", () => { |
50 | | - ScalarApiReference({ |
51 | | - element: "#api-reference", |
52 | | - spec: {url: specUrl}, |
53 | | - theme: theme, |
54 | | - layout: "modern", |
55 | | - hideDownloadButton: false, |
56 | | - hideModels: false |
57 | | - }); |
58 | | - }); |
59 | | - /*]]>*/ |
60 | | -</script> |
61 | 22 | </body> |
62 | 23 | </html> |
0 commit comments