Skip to content

Commit 7c7a065

Browse files
0815pascal0815pascal
committed
Initial commit
0 parents  commit 7c7a065

File tree

320 files changed

+91328
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

320 files changed

+91328
-0
lines changed

‎_layouts/dynamic_template.hbs‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<html>
2+
<head>
3+
<title>{{title}}</title>
4+
<link type="text/css" href="./style.css" rel="stylesheet"/>
5+
</head>
6+
<body>
7+
<section>
8+
<details>
9+
<summary>
10+
<div>
11+
<span class="method">{{method}}</span>
12+
<span id="baseUrl">
13+
<span>{{baseUrl}}</span><span class="path">{{path}}</span>
14+
</span>
15+
<p class="title">{{apiTitle}}</p>
16+
</div>
17+
</summary>
18+
<div id="detailItems">
19+
<p>{{description}}</p>
20+
<p class="title">Parameters</p>
21+
<p class="subtitle">Path</p>
22+
<div id="pathDetails">
23+
<div class="pathName">{{paramName}}<span class="required">{{required}}</span></div>
24+
<div class="type">{{type}}</div>
25+
<div class="pathDescription">{{paramDescription}}</div>
26+
</div>
27+
<p class="title">Responses</p>
28+
<!-- Looping through each response -->
29+
{{#each responses}}
30+
<div class="httpResponse">
31+
<div class="httpResponseContainer">
32+
<div class="httpStatus {{status}}">
33+
<svg class="circle-svg" viewBox="0 0 8 16" preserveAspectRatio="xMidYMid meet">
34+
<path class="circle-path" d="M0 8c0-2.2 1.8-4 4-4s4 1.8 4 4-1.8 4-4 4-4-1.8-4-4z"></path>
35+
</svg>
36+
{{httpCode}}: {{httpMessage}}</div>
37+
<div class="statusDescription">{{statusDescription}}</div>
38+
</div>
39+
{{#if schema}} <!-- Check if schema exists -->
40+
<details>
41+
<summary></summary>
42+
<div class="schema">
43+
<p class="type">{{schema.type}}</p>
44+
<div>
45+
{{#renderProperties schema.properties}}
46+
{{/renderProperties}}
47+
</div>
48+
</div>
49+
</details>
50+
{{/if}} <!-- End check -->
51+
</div>
52+
{{/each}}
53+
</div>
54+
</details>
55+
</section>
56+
</body>
57+
</html>

‎assets/arrow.svg‎

Lines changed: 2 additions & 0 deletions
Loading

‎assets/circle.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎assets/style.css‎

Lines changed: 296 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,296 @@
1+
:root {
2+
--small-font: 1.4rem;
3+
--get-method: rgb(52, 109, 219);
4+
--background-color: rgb(245, 247, 249);
5+
--text-color: rgb(59, 69, 78);
6+
--type-color: rgb(52, 109, 219);
7+
--bright-text-color: rgb(92, 105, 117);
8+
--light-text-color: rgb(136, 153, 168);
9+
--fainting-color: #f5f7f9;
10+
--important-color: rgb(211, 61, 61);
11+
--status-ok: rgb(0, 136, 71);
12+
--status-bad: rgb(185, 94, 4);
13+
}
14+
15+
html, body{
16+
text-rendering: optimizelegibility;
17+
margin: 0;
18+
padding: 0;
19+
font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
20+
}
21+
22+
body{
23+
color: var(--text-color);
24+
}
25+
26+
details,
27+
summary {
28+
width: 100%;
29+
}
30+
31+
32+
details #detailItems{
33+
padding: 0 0 1rem 2rem;
34+
}
35+
36+
details #detailItems > p:first-of-type{
37+
margin-bottom:2.5rem;
38+
}
39+
40+
details > summary {
41+
list-style: none;
42+
}
43+
44+
details > summary::marker,
45+
details > summary::-webkit-details-marker {
46+
display: flex;
47+
}
48+
49+
section > details[open] > summary:not(.httpResponse):before{
50+
transform: rotate(0);
51+
}
52+
53+
section > details > summary:not(.httpResponse):before {
54+
content: "";
55+
opacity: 0.6;
56+
background-image: url("./arrow.svg");
57+
cursor: pointer;
58+
background-repeat: no-repeat;
59+
background-size: 100% 100%;
60+
width: calc(1.6 * 1.25rem);
61+
height: calc(1.6 * 1.25rem);
62+
position: absolute;
63+
top: .33rem;
64+
left: -.5rem;
65+
transform: rotate(-90deg);
66+
flex-shrink: 0;
67+
}
68+
69+
summary{
70+
position: relative;
71+
}
72+
73+
summary div{
74+
margin:1rem 2rem;
75+
}
76+
77+
section{
78+
margin: 0;
79+
padding: 1rem 1rem 1rem 2rem;
80+
border: 1px solid rgb(227, 232, 237);
81+
border-radius: .5rem;
82+
width: fit-content;
83+
min-width: 35rem;
84+
}
85+
86+
#baseUrl{
87+
color: var(--light-text-color);
88+
font-size: var(--small-font)
89+
}
90+
91+
.method{
92+
background-color: var(--get-method);
93+
text-transform: uppercase;
94+
font-weight: 700;
95+
font-size: var(--small-font);
96+
color: white;
97+
border-radius: 1rem;
98+
padding: .25rem .75rem;
99+
margin-right:1rem;
100+
margin-left: -.25rem;
101+
}
102+
103+
.path{
104+
font-weight:600;
105+
font-size: var(--small-font);
106+
color: var(--text-color);
107+
}
108+
109+
#pathDetails{
110+
color: var(--bright-text-color);
111+
display: flex;
112+
flex-direction: row;
113+
flex-grow: 1;
114+
flex-shrink: 1;
115+
font-size: var(--small-font);
116+
margin-bottom: 3.2rem;
117+
}
118+
119+
#pathDetails div{
120+
display: inline;
121+
padding: 1rem 0;
122+
font-weight: 500;
123+
white-space: pre-wrap;
124+
overflow-wrap: break-word;
125+
}
126+
127+
#pathDetails div:first-child{
128+
width: 10.5rem;
129+
padding: 0;
130+
}
131+
132+
#pathDetails div:nth-child(2){
133+
width: 6rem;
134+
padding: 0;
135+
136+
}
137+
138+
#pathDetails div:last-child{
139+
flex: 1 1 0%;
140+
margin-right: 2.5rem;
141+
padding: 0;
142+
143+
}
144+
145+
.httpResponse{
146+
border-bottom: 1px solid var(--fainting-color);
147+
display: flex;
148+
flex-direction: column;
149+
color: var(--bright-text-color);
150+
padding: 1rem 0;
151+
font-size: var(--small-font);
152+
position: relative;
153+
line-height: 1.5rem;
154+
}
155+
156+
.httpResponse details > summary {
157+
width: 100%;
158+
position: relative; /* Add this line */
159+
}
160+
161+
.httpResponse summary{
162+
text-align: right;
163+
position: relative;
164+
}
165+
166+
.httpResponse details[open] > summary:before {
167+
transform: rotate(0);
168+
}
169+
170+
.httpResponse summary:before{
171+
content: ""; /* Add this line */
172+
right: 0;
173+
cursor: pointer;
174+
top: -1.4rem;
175+
background-image: url("./arrow.svg");
176+
transform: rotate(-90deg);
177+
width: 1.25rem;
178+
height: 1.25rem;
179+
position: absolute;
180+
}
181+
182+
.httpResponse details .summary-content{
183+
padding: 0 2rem;
184+
}
185+
186+
.httpResponseContainer{
187+
display: flex;
188+
flex-direction: row;
189+
margin-bottom: 0;
190+
}
191+
192+
.httpResponseContainer .statusDescription{
193+
margin-left: -2.5rem;
194+
}
195+
196+
.httpStatus{
197+
width: 19rem;
198+
font-weight: 700;
199+
color: var(--text-color);
200+
display: flex;
201+
align-items: center;
202+
height: 1.5rem;
203+
}
204+
205+
.httpResponse details .schema{
206+
background-color: var(--background-color);
207+
border-radius: .5rem;
208+
padding: 1rem 2rem;
209+
margin-top: 1.6rem;
210+
}
211+
212+
.httpResponse .schema details{
213+
margin-left: 1.6rem;
214+
}
215+
216+
217+
.httpResponse details .schema details[open] > summary:before{
218+
content: "‒"; /* Add this line */
219+
}
220+
221+
.httpResponse details .schema summary:before{
222+
content: "+"; /* Add this line */
223+
font-weight: 500;
224+
cursor: pointer;
225+
background-image:none;
226+
transform: rotate(0);
227+
color: var(--type-color);
228+
font-size: 1.6rem;
229+
position: absolute;
230+
left: -1.6rem;
231+
top: 0;
232+
}
233+
234+
.httpResponse details .schema summary{
235+
text-align: left;
236+
color: var(--text-color);
237+
}
238+
239+
.httpResponse details .schema div{
240+
margin-left: 1.6rem;
241+
}
242+
243+
.httpResponse details .schema .type{
244+
color: var(--type-color);
245+
margin-bottom: 0;
246+
}
247+
248+
.httpResponse details .schema .comment{
249+
margin:0;
250+
color: var(--light-text-color);
251+
font-weight: 500;
252+
}
253+
254+
.title {
255+
font-weight: 600;
256+
line-height: 1.5rem;
257+
color: var(--text-color);
258+
margin-right: 1rem;
259+
}
260+
261+
.pathName, .httpResponse details .schema .type{
262+
font-family: 'Courier New', Courier, monospace;
263+
}
264+
265+
.required {
266+
color: var(--important-color);
267+
}
268+
269+
.subtitle {
270+
font-size: var(--small-font);
271+
font-weight: 700;
272+
}
273+
274+
275+
/* SVG Styling */
276+
.circle-svg {
277+
vertical-align: middle;
278+
width: 18px;
279+
height: 18px;
280+
margin-right: .5rem;
281+
}
282+
283+
.circle-path {
284+
fill: currentColor;
285+
}
286+
.httpStatus.ok .circle-path {
287+
fill: var(--status-ok);
288+
}
289+
290+
.httpStatus.bad .circle-path {
291+
fill: var(--status-bad);
292+
}
293+
294+
.httpStatus.blue .circle-path {
295+
fill: rgb(0, 0, 255);
296+
}

0 commit comments

Comments
 (0)