docusaurus-theme-openapi-docs 1.2.0 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/lib/theme/ApiDemoPanel/FloatingButton/styles.module.css +2 -3
  2. package/lib/theme/ApiDemoPanel/Request/index.js +3 -0
  3. package/lib/theme/ApiDemoPanel/Request/styles.module.css +1 -0
  4. package/lib/theme/ApiDemoPanel/Server/index.js +30 -29
  5. package/lib/theme/ApiDemoPanel/Server/styles.module.css +0 -1
  6. package/lib/theme/ApiDemoPanel/index.js +0 -3
  7. package/lib/theme/ApiTabs/styles.module.css +9 -5
  8. package/lib/theme/SchemaTabs/styles.module.css +10 -6
  9. package/lib-next/theme/ApiDemoPanel/FloatingButton/styles.module.css +2 -3
  10. package/lib-next/theme/ApiDemoPanel/Request/index.js +2 -0
  11. package/lib-next/theme/ApiDemoPanel/Request/styles.module.css +1 -0
  12. package/lib-next/theme/ApiDemoPanel/Server/index.js +43 -45
  13. package/lib-next/theme/ApiDemoPanel/Server/styles.module.css +0 -1
  14. package/lib-next/theme/ApiDemoPanel/index.js +0 -2
  15. package/lib-next/theme/ApiTabs/styles.module.css +9 -5
  16. package/lib-next/theme/SchemaTabs/styles.module.css +10 -6
  17. package/package.json +3 -3
  18. package/src/theme/ApiDemoPanel/FloatingButton/styles.module.css +2 -3
  19. package/src/theme/ApiDemoPanel/Request/index.tsx +2 -0
  20. package/src/theme/ApiDemoPanel/Request/styles.module.css +1 -0
  21. package/src/theme/ApiDemoPanel/Server/index.tsx +39 -39
  22. package/src/theme/ApiDemoPanel/Server/styles.module.css +0 -1
  23. package/src/theme/ApiDemoPanel/index.tsx +0 -2
  24. package/src/theme/ApiTabs/styles.module.css +9 -5
  25. package/src/theme/SchemaTabs/styles.module.css +10 -6
package/lib/theme/ApiDemoPanel/FloatingButton/styles.module.css CHANGED
@@ -4,10 +4,10 @@
4
4
 
5
5
  .floatingButton button {
6
6
  position: relative;
7
- background: rgba(25, 26, 27, 0.9);
7
+ background: var(--ifm-color-emphasis-900);
8
8
  border: none;
9
9
  border-radius: var(--ifm-global-radius);
10
- color: var(--ifm-color-white);
10
+ color: var(--ifm-color-emphasis-100);
11
11
  cursor: pointer;
12
12
  padding: 0.4rem 0.5rem;
13
13
  opacity: 0;
@@ -15,7 +15,6 @@
15
15
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out,
16
16
  bottom 0.2s ease-in-out;
17
17
  position: absolute;
18
- top: calc(var(--ifm-pre-padding) / 2);
19
18
  right: calc(var(--ifm-pre-padding) / 2);
20
19
  }
21
20
 
package/lib/theme/ApiDemoPanel/Request/index.js CHANGED
@@ -23,6 +23,8 @@ var _hooks = require("../hooks");
23
23
 
24
24
  var _ParamOptions = _interopRequireDefault(require("../ParamOptions"));
25
25
 
26
+ var _Server = _interopRequireDefault(require("../Server"));
27
+
26
28
  var _stylesModule = _interopRequireDefault(require("./styles.module.css"));
27
29
 
28
30
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -65,6 +67,7 @@ function Request({
65
67
  </div>
66
68
  </summary>
67
69
  <div className={_stylesModule.default.optionsPanel}>
70
+ <_Server.default />
68
71
  <_Authorization.default />
69
72
  <_ParamOptions.default />
70
73
  <_Body.default jsonRequestBodyExample={item.jsonRequestBodyExample} requestBodyMetadata={item.requestBody} />
package/lib/theme/ApiDemoPanel/Request/styles.module.css CHANGED
@@ -10,6 +10,7 @@
10
10
  margin-bottom: var(--ifm-spacing-vertical);
11
11
  margin-top: 0;
12
12
  overflow: auto;
13
+ padding-top: 0 !important;
13
14
  padding: var(--ifm-pre-padding);
14
15
 
15
16
  /* hack for view calculation when monaco is hidden */
package/lib/theme/ApiDemoPanel/Server/index.js CHANGED
@@ -63,46 +63,47 @@ function Server() {
63
63
  }
64
64
 
65
65
  return <_FloatingButton.default onClick={() => setIsEditing(true)} label="Edit">
66
- <pre style={{
67
- background: "var(--openapi-card-background-color)",
68
- paddingRight: "60px"
69
- }}>
70
- <code>{url}</code>
71
- </pre>
66
+ <_FormItem.default label="Base URL">
67
+ <pre style={{
68
+ background: "var(--openapi-card-background-color)",
69
+ paddingLeft: "0px"
70
+ }}>
71
+ <code title={url}>{url}</code>
72
+ </pre>
73
+ </_FormItem.default>
72
74
  </_FloatingButton.default>;
73
75
  }
74
76
 
75
77
  return <div className={_stylesModule.default.optionsPanel}>
76
- <button className={_stylesModule.default.showMoreButton} onClick={() => setIsEditing(false)} tabIndex={0}>
77
- Hide
78
- </button>
79
- <_FormItem.default label="Base URL">
80
- <_FormSelect.default options={options.map(s => s.url)} onChange={e => dispatch((0, _slice.setServer)(e.target.value))} />
81
- <small>{value === null || value === void 0 ? void 0 : value.description}</small>
82
- </_FormItem.default>
83
- {(value === null || value === void 0 ? void 0 : value.variables) && Object.keys(value.variables).map(key => {
84
- var _value$variables2, _value$variables3;
85
-
86
- if (((_value$variables2 = value.variables) === null || _value$variables2 === void 0 ? void 0 : _value$variables2[key].enum) !== undefined) {
78
+ <_FloatingButton.default onClick={() => setIsEditing(false)} label="Hide">
79
+ <_FormItem.default label="Base URL">
80
+ <_FormSelect.default options={options.map(s => s.url)} onChange={e => dispatch((0, _slice.setServer)(e.target.value))} value={value === null || value === void 0 ? void 0 : value.url} />
81
+ <small>{value === null || value === void 0 ? void 0 : value.description}</small>
82
+ </_FormItem.default>
83
+ {(value === null || value === void 0 ? void 0 : value.variables) && Object.keys(value.variables).map(key => {
84
+ var _value$variables2, _value$variables3;
85
+
86
+ if (((_value$variables2 = value.variables) === null || _value$variables2 === void 0 ? void 0 : _value$variables2[key].enum) !== undefined) {
87
+ return <_FormItem.default label={key}>
88
+ <_FormSelect.default options={value.variables[key].enum} onChange={e => {
89
+ dispatch((0, _slice.setServerVariable)({
90
+ key,
91
+ value: e.target.value
92
+ }));
93
+ }} />
94
+ </_FormItem.default>;
95
+ }
96
+
87
97
  return <_FormItem.default label={key}>
88
- <_FormSelect.default options={value.variables[key].enum} onChange={e => {
98
+ <_FormTextInput.default placeholder={(_value$variables3 = value.variables) === null || _value$variables3 === void 0 ? void 0 : _value$variables3[key].default} onChange={e => {
89
99
  dispatch((0, _slice.setServerVariable)({
90
100
  key,
91
101
  value: e.target.value
92
102
  }));
93
103
  }} />
94
104
  </_FormItem.default>;
95
- }
96
-
97
- return <_FormItem.default label={key}>
98
- <_FormTextInput.default placeholder={(_value$variables3 = value.variables) === null || _value$variables3 === void 0 ? void 0 : _value$variables3[key].default} onChange={e => {
99
- dispatch((0, _slice.setServerVariable)({
100
- key,
101
- value: e.target.value
102
- }));
103
- }} />
104
- </_FormItem.default>;
105
- })}
105
+ })}
106
+ </_FloatingButton.default>
106
107
  </div>;
107
108
  }
108
109
 
package/lib/theme/ApiDemoPanel/Server/styles.module.css CHANGED
@@ -50,7 +50,6 @@
50
50
  margin-bottom: var(--ifm-spacing-vertical);
51
51
  margin-top: 0;
52
52
  overflow: auto;
53
- padding: var(--ifm-pre-padding);
54
53
 
55
54
  /* hack for view calculation when monaco is hidden */
56
55
  position: relative;
package/lib/theme/ApiDemoPanel/index.js CHANGED
@@ -27,8 +27,6 @@ var _Response = _interopRequireDefault(require("./Response"));
27
27
 
28
28
  var _SecuritySchemes = _interopRequireDefault(require("./SecuritySchemes"));
29
29
 
30
- var _Server = _interopRequireDefault(require("./Server"));
31
-
32
30
  var _store = require("./store");
33
31
 
34
32
  var _stylesModule = _interopRequireDefault(require("./styles.module.css"));
@@ -107,7 +105,6 @@ function ApiDemoPanel({
107
105
  return <_reactRedux.Provider store={store2}>
108
106
  <div className={_stylesModule.default.apiDemoPanelContainer}>
109
107
  <_MethodEndpoint.default method={method} path={path} />
110
- <_Server.default />
111
108
  <_SecuritySchemes.default infoPath={infoPath} />
112
109
  <_Request.default item={item} />
113
110
  <_Response.default />
package/lib/theme/ApiTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 2.5rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
+ color: var(--ifm-color-primary);
17
18
  font-weight: var(--ifm-font-weight-normal);
18
- color: var(--openapi-code-dim-dark);
19
+ }
20
+
21
+ .tabItem:not(.responseTabActive) {
22
+ opacity: 0.65;
19
23
  }
20
24
 
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -74,8 +79,7 @@
74
79
  }
75
80
 
76
81
  .responseTabActive {
77
- border: 1px solid var(--ifm-color-primary);
78
- color: var(--ifm-color-primary);
82
+ background-color: var(--ifm-color-emphasis-100);
79
83
  }
80
84
 
81
85
  .responseSchemaContainer {
package/lib/theme/SchemaTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 1.8rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
- color: var(--openapi-code-dim-dark);
17
+ color: var(--ifm-color-primary);
18
18
  font-size: 12px;
19
19
  }
20
20
 
21
+ .tabItem:not(.schemaTabActive) {
22
+ opacity: 0.65;
23
+ }
24
+
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -49,9 +54,8 @@
49
54
  display: none;
50
55
  }
51
56
 
52
- .tabItem.schemaTabActive {
53
- border: 1px solid var(--ifm-color-primary);
54
- color: var(--ifm-color-primary);
57
+ .schemaTabActive {
58
+ background-color: var(--ifm-color-emphasis-100);
55
59
  }
56
60
 
57
61
  .schemaTabLabel {
package/lib-next/theme/ApiDemoPanel/FloatingButton/styles.module.css CHANGED
@@ -4,10 +4,10 @@
4
4
 
5
5
  .floatingButton button {
6
6
  position: relative;
7
- background: rgba(25, 26, 27, 0.9);
7
+ background: var(--ifm-color-emphasis-900);
8
8
  border: none;
9
9
  border-radius: var(--ifm-global-radius);
10
- color: var(--ifm-color-white);
10
+ color: var(--ifm-color-emphasis-100);
11
11
  cursor: pointer;
12
12
  padding: 0.4rem 0.5rem;
13
13
  opacity: 0;
@@ -15,7 +15,6 @@
15
15
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out,
16
16
  bottom 0.2s ease-in-out;
17
17
  position: absolute;
18
- top: calc(var(--ifm-pre-padding) / 2);
19
18
  right: calc(var(--ifm-pre-padding) / 2);
20
19
  }
21
20
 
package/lib-next/theme/ApiDemoPanel/Request/index.js CHANGED
@@ -13,6 +13,7 @@ import Body from "../Body";
13
13
  import Execute from "../Execute";
14
14
  import { useTypedSelector } from "../hooks";
15
15
  import ParamOptions from "../ParamOptions";
16
+ import Server from "../Server";
16
17
  import styles from "./styles.module.css";
17
18
 
18
19
  function Request({ item }) {
@@ -44,6 +45,7 @@ function Request({ item }) {
44
45
  </div>
45
46
  </summary>
46
47
  <div className={styles.optionsPanel}>
48
+ <Server />
47
49
  <Authorization />
48
50
  <ParamOptions />
49
51
  <Body
package/lib-next/theme/ApiDemoPanel/Request/styles.module.css CHANGED
@@ -10,6 +10,7 @@
10
10
  margin-bottom: var(--ifm-spacing-vertical);
11
11
  margin-top: 0;
12
12
  overflow: auto;
13
+ padding-top: 0 !important;
13
14
  padding: var(--ifm-pre-padding);
14
15
 
15
16
  /* hack for view calculation when monaco is hidden */
package/lib-next/theme/ApiDemoPanel/Server/index.js CHANGED
@@ -45,41 +45,55 @@ function Server() {
45
45
 
46
46
  return (
47
47
  <FloatingButton onClick={() => setIsEditing(true)} label="Edit">
48
- <pre
49
- style={{
50
- background: "var(--openapi-card-background-color)",
51
- paddingRight: "60px",
52
- }}
53
- >
54
- <code>{url}</code>
55
- </pre>
48
+ <FormItem label="Base URL">
49
+ <pre
50
+ style={{
51
+ background: "var(--openapi-card-background-color)",
52
+ paddingLeft: "0px",
53
+ }}
54
+ >
55
+ <code title={url}>{url}</code>
56
+ </pre>
57
+ </FormItem>
56
58
  </FloatingButton>
57
59
  );
58
60
  }
59
61
 
60
62
  return (
61
63
  <div className={styles.optionsPanel}>
62
- <button
63
- className={styles.showMoreButton}
64
- onClick={() => setIsEditing(false)}
65
- tabIndex={0}
66
- >
67
- Hide
68
- </button>
69
- <FormItem label="Base URL">
70
- <FormSelect
71
- options={options.map((s) => s.url)}
72
- onChange={(e) => dispatch(setServer(e.target.value))}
73
- />
74
- <small>{value?.description}</small>
75
- </FormItem>
76
- {value?.variables &&
77
- Object.keys(value.variables).map((key) => {
78
- if (value.variables?.[key].enum !== undefined) {
64
+ <FloatingButton onClick={() => setIsEditing(false)} label="Hide">
65
+ <FormItem label="Base URL">
66
+ <FormSelect
67
+ options={options.map((s) => s.url)}
68
+ onChange={(e) => dispatch(setServer(e.target.value))}
69
+ value={value?.url}
70
+ />
71
+ <small>{value?.description}</small>
72
+ </FormItem>
73
+ {value?.variables &&
74
+ Object.keys(value.variables).map((key) => {
75
+ if (value.variables?.[key].enum !== undefined) {
76
+ return (
77
+ <FormItem label={key}>
78
+ <FormSelect
79
+ options={value.variables[key].enum}
80
+ onChange={(e) => {
81
+ dispatch(
82
+ setServerVariable({
83
+ key,
84
+ value: e.target.value,
85
+ })
86
+ );
87
+ }}
88
+ />
89
+ </FormItem>
90
+ );
91
+ }
92
+
79
93
  return (
80
94
  <FormItem label={key}>
81
- <FormSelect
82
- options={value.variables[key].enum}
95
+ <FormTextInput
96
+ placeholder={value.variables?.[key].default}
83
97
  onChange={(e) => {
84
98
  dispatch(
85
99
  setServerVariable({
@@ -91,24 +105,8 @@ function Server() {
91
105
  />
92
106
  </FormItem>
93
107
  );
94
- }
95
-
96
- return (
97
- <FormItem label={key}>
98
- <FormTextInput
99
- placeholder={value.variables?.[key].default}
100
- onChange={(e) => {
101
- dispatch(
102
- setServerVariable({
103
- key,
104
- value: e.target.value,
105
- })
106
- );
107
- }}
108
- />
109
- </FormItem>
110
- );
111
- })}
108
+ })}
109
+ </FloatingButton>
112
110
  </div>
113
111
  );
114
112
  }
package/lib-next/theme/ApiDemoPanel/Server/styles.module.css CHANGED
@@ -50,7 +50,6 @@
50
50
  margin-bottom: var(--ifm-spacing-vertical);
51
51
  margin-top: 0;
52
52
  overflow: auto;
53
- padding: var(--ifm-pre-padding);
54
53
 
55
54
  /* hack for view calculation when monaco is hidden */
56
55
  position: relative;
package/lib-next/theme/ApiDemoPanel/index.js CHANGED
@@ -15,7 +15,6 @@ import { createPersistanceMiddleware } from "./persistanceMiddleware";
15
15
  import Request from "./Request";
16
16
  import Response from "./Response";
17
17
  import SecuritySchemes from "./SecuritySchemes";
18
- import Server from "./Server";
19
18
  import { createStoreWithState } from "./store";
20
19
  import styles from "./styles.module.css";
21
20
 
@@ -81,7 +80,6 @@ function ApiDemoPanel({ item, infoPath }) {
81
80
  <Provider store={store2}>
82
81
  <div className={styles.apiDemoPanelContainer}>
83
82
  <MethodEndpoint method={method} path={path} />
84
- <Server />
85
83
  <SecuritySchemes infoPath={infoPath} />
86
84
  <Request item={item} />
87
85
  <Response />
package/lib-next/theme/ApiTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 2.5rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
+ color: var(--ifm-color-primary);
17
18
  font-weight: var(--ifm-font-weight-normal);
18
- color: var(--openapi-code-dim-dark);
19
+ }
20
+
21
+ .tabItem:not(.responseTabActive) {
22
+ opacity: 0.65;
19
23
  }
20
24
 
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -74,8 +79,7 @@
74
79
  }
75
80
 
76
81
  .responseTabActive {
77
- border: 1px solid var(--ifm-color-primary);
78
- color: var(--ifm-color-primary);
82
+ background-color: var(--ifm-color-emphasis-100);
79
83
  }
80
84
 
81
85
  .responseSchemaContainer {
package/lib-next/theme/SchemaTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 1.8rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
- color: var(--openapi-code-dim-dark);
17
+ color: var(--ifm-color-primary);
18
18
  font-size: 12px;
19
19
  }
20
20
 
21
+ .tabItem:not(.schemaTabActive) {
22
+ opacity: 0.65;
23
+ }
24
+
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -49,9 +54,8 @@
49
54
  display: none;
50
55
  }
51
56
 
52
- .tabItem.schemaTabActive {
53
- border: 1px solid var(--ifm-color-primary);
54
- color: var(--ifm-color-primary);
57
+ .schemaTabActive {
58
+ background-color: var(--ifm-color-emphasis-100);
55
59
  }
56
60
 
57
61
  .schemaTabLabel {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "docusaurus-theme-openapi-docs",
3
3
  "description": "OpenAPI theme for Docusaurus.",
4
- "version": "1.2.0",
4
+ "version": "1.2.2",
5
5
  "license": "MIT",
6
6
  "keywords": [
7
7
  "openapi",
@@ -50,7 +50,7 @@
50
50
  "buffer": "^6.0.3",
51
51
  "clsx": "^1.1.1",
52
52
  "crypto-js": "^4.1.1",
53
- "docusaurus-plugin-openapi-docs": "^1.2.0",
53
+ "docusaurus-plugin-openapi-docs": "^1.2.2",
54
54
  "immer": "^9.0.7",
55
55
  "lodash": "^4.17.20",
56
56
  "process": "^0.11.10",
@@ -70,5 +70,5 @@
70
70
  "engines": {
71
71
  "node": ">=14"
72
72
  },
73
- "gitHead": "fdbc413e36c3b7c202cc31606124c0a8eb76811b"
73
+ "gitHead": "cfeb5216f143133a1c35587fef21f75a44b75854"
74
74
  }
package/src/theme/ApiDemoPanel/FloatingButton/styles.module.css CHANGED
@@ -4,10 +4,10 @@
4
4
 
5
5
  .floatingButton button {
6
6
  position: relative;
7
- background: rgba(25, 26, 27, 0.9);
7
+ background: var(--ifm-color-emphasis-900);
8
8
  border: none;
9
9
  border-radius: var(--ifm-global-radius);
10
- color: var(--ifm-color-white);
10
+ color: var(--ifm-color-emphasis-100);
11
11
  cursor: pointer;
12
12
  padding: 0.4rem 0.5rem;
13
13
  opacity: 0;
@@ -15,7 +15,6 @@
15
15
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out,
16
16
  bottom 0.2s ease-in-out;
17
17
  position: absolute;
18
- top: calc(var(--ifm-pre-padding) / 2);
19
18
  right: calc(var(--ifm-pre-padding) / 2);
20
19
  }
21
20
 
package/src/theme/ApiDemoPanel/Request/index.tsx CHANGED
@@ -19,6 +19,7 @@ import Body from "../Body";
19
19
  import Execute from "../Execute";
20
20
  import { useTypedSelector } from "../hooks";
21
21
  import ParamOptions from "../ParamOptions";
22
+ import Server from "../Server";
22
23
  import styles from "./styles.module.css";
23
24
 
24
25
  function Request({ item }: { item: NonNullable<ApiItem> }) {
@@ -55,6 +56,7 @@ function Request({ item }: { item: NonNullable<ApiItem> }) {
55
56
  </div>
56
57
  </summary>
57
58
  <div className={styles.optionsPanel}>
59
+ <Server />
58
60
  <Authorization />
59
61
  <ParamOptions />
60
62
  <Body
package/src/theme/ApiDemoPanel/Request/styles.module.css CHANGED
@@ -10,6 +10,7 @@
10
10
  margin-bottom: var(--ifm-spacing-vertical);
11
11
  margin-top: 0;
12
12
  overflow: auto;
13
+ padding-top: 0 !important;
13
14
  padding: var(--ifm-pre-padding);
14
15
 
15
16
  /* hack for view calculation when monaco is hidden */
package/src/theme/ApiDemoPanel/Server/index.tsx CHANGED
@@ -45,59 +45,59 @@ function Server() {
45
45
  }
46
46
  return (
47
47
  <FloatingButton onClick={() => setIsEditing(true)} label="Edit">
48
- <pre
49
- style={{
50
- background: "var(--openapi-card-background-color)",
51
- paddingRight: "60px",
52
- }}
53
- >
54
- <code>{url}</code>
55
- </pre>
48
+ <FormItem label="Base URL">
49
+ <pre
50
+ style={{
51
+ background: "var(--openapi-card-background-color)",
52
+ paddingLeft: "0px",
53
+ }}
54
+ >
55
+ <code title={url}>{url}</code>
56
+ </pre>
57
+ </FormItem>
56
58
  </FloatingButton>
57
59
  );
58
60
  }
59
61
 
60
62
  return (
61
63
  <div className={styles.optionsPanel}>
62
- <button
63
- className={styles.showMoreButton}
64
- onClick={() => setIsEditing(false)}
65
- tabIndex={0}
66
- >
67
- Hide
68
- </button>
69
- <FormItem label="Base URL">
70
- <FormSelect
71
- options={options.map((s) => s.url)}
72
- onChange={(e) => dispatch(setServer(e.target.value))}
73
- />
74
- <small>{value?.description}</small>
75
- </FormItem>
76
- {value?.variables &&
77
- Object.keys(value.variables).map((key) => {
78
- if (value.variables?.[key].enum !== undefined) {
64
+ <FloatingButton onClick={() => setIsEditing(false)} label="Hide">
65
+ <FormItem label="Base URL">
66
+ <FormSelect
67
+ options={options.map((s) => s.url)}
68
+ onChange={(e) => dispatch(setServer(e.target.value))}
69
+ value={value?.url}
70
+ />
71
+ <small>{value?.description}</small>
72
+ </FormItem>
73
+ {value?.variables &&
74
+ Object.keys(value.variables).map((key) => {
75
+ if (value.variables?.[key].enum !== undefined) {
76
+ return (
77
+ <FormItem label={key}>
78
+ <FormSelect
79
+ options={value.variables[key].enum}
80
+ onChange={(e) => {
81
+ dispatch(
82
+ setServerVariable({ key, value: e.target.value })
83
+ );
84
+ }}
85
+ />
86
+ </FormItem>
87
+ );
88
+ }
79
89
  return (
80
90
  <FormItem label={key}>
81
- <FormSelect
82
- options={value.variables[key].enum}
91
+ <FormTextInput
92
+ placeholder={value.variables?.[key].default}
83
93
  onChange={(e) => {
84
94
  dispatch(setServerVariable({ key, value: e.target.value }));
85
95
  }}
86
96
  />
87
97
  </FormItem>
88
98
  );
89
- }
90
- return (
91
- <FormItem label={key}>
92
- <FormTextInput
93
- placeholder={value.variables?.[key].default}
94
- onChange={(e) => {
95
- dispatch(setServerVariable({ key, value: e.target.value }));
96
- }}
97
- />
98
- </FormItem>
99
- );
100
- })}
99
+ })}
100
+ </FloatingButton>
101
101
  </div>
102
102
  );
103
103
  }
package/src/theme/ApiDemoPanel/Server/styles.module.css CHANGED
@@ -50,7 +50,6 @@
50
50
  margin-bottom: var(--ifm-spacing-vertical);
51
51
  margin-top: 0;
52
52
  overflow: auto;
53
- padding: var(--ifm-pre-padding);
54
53
 
55
54
  /* hack for view calculation when monaco is hidden */
56
55
  position: relative;
package/src/theme/ApiDemoPanel/index.tsx CHANGED
@@ -21,7 +21,6 @@ import { createPersistanceMiddleware } from "./persistanceMiddleware";
21
21
  import Request from "./Request";
22
22
  import Response from "./Response";
23
23
  import SecuritySchemes from "./SecuritySchemes";
24
- import Server from "./Server";
25
24
  import { createStoreWithState } from "./store";
26
25
  import styles from "./styles.module.css";
27
26
 
@@ -93,7 +92,6 @@ function ApiDemoPanel({
93
92
  <Provider store={store2}>
94
93
  <div className={styles.apiDemoPanelContainer}>
95
94
  <MethodEndpoint method={method} path={path} />
96
- <Server />
97
95
  <SecuritySchemes infoPath={infoPath} />
98
96
  <Request item={item} />
99
97
  <Response />
package/src/theme/ApiTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 2.5rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
+ color: var(--ifm-color-primary);
17
18
  font-weight: var(--ifm-font-weight-normal);
18
- color: var(--openapi-code-dim-dark);
19
+ }
20
+
21
+ .tabItem:not(.responseTabActive) {
22
+ opacity: 0.65;
19
23
  }
20
24
 
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -74,8 +79,7 @@
74
79
  }
75
80
 
76
81
  .responseTabActive {
77
- border: 1px solid var(--ifm-color-primary);
78
- color: var(--ifm-color-primary);
82
+ background-color: var(--ifm-color-emphasis-100);
79
83
  }
80
84
 
81
85
  .responseSchemaContainer {
package/src/theme/SchemaTabs/styles.module.css CHANGED
@@ -12,14 +12,19 @@
12
12
  height: 1.8rem;
13
13
  margin-top: 0 !important;
14
14
  margin-right: 0.5rem;
15
- border: 1px solid var(--openapi-code-dim-dark);
15
+ border: 1px solid var(--ifm-color-primary);
16
16
  border-radius: var(--ifm-global-radius);
17
- color: var(--openapi-code-dim-dark);
17
+ color: var(--ifm-color-primary);
18
18
  font-size: 12px;
19
19
  }
20
20
 
21
+ .tabItem:not(.schemaTabActive) {
22
+ opacity: 0.65;
23
+ }
24
+
21
25
  .tabItem:hover {
22
- color: var(--ifm-color-emphasis-500) !important;
26
+ opacity: 1;
27
+ background-color: var(--ifm-color-emphasis-100);
23
28
  }
24
29
 
25
30
  .tabItem:last-child {
@@ -49,9 +54,8 @@
49
54
  display: none;
50
55
  }
51
56
 
52
- .tabItem.schemaTabActive {
53
- border: 1px solid var(--ifm-color-primary);
54
- color: var(--ifm-color-primary);
57
+ .schemaTabActive {
58
+ background-color: var(--ifm-color-emphasis-100);
55
59
  }
56
60
 
57
61
  .schemaTabLabel {