From 0bd87308557406fb91d10cc88b31b3a5277f17df Mon Sep 17 00:00:00 2001 From: Jonathan Roebuck Date: Tue, 15 Oct 2024 14:07:11 +0100 Subject: [PATCH 1/4] Use theme values for OpenApiDefinition styles Signed-off-by: Jonathan Roebuck --- .../OpenApiDefinition.tsx | 42 +++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx b/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx index 1505646dee..58b1a277a5 100644 --- a/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx +++ b/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx @@ -132,6 +132,48 @@ const useStyles = makeStyles(theme => ({ [`& span.prop-type`]: { color: theme.palette.success.light, }, + [`& .opblock-control-arrow svg, .authorization__btn .unlocked`]: { + fill: theme.palette.text.primary, + }, + [`& .json-schema-2020-12__title, + .json-schema-2020-12-keyword__name, + .json-schema-2020-12-property .json-schema-2020-12__title, + .json-schema-2020-12-keyword--description`]: { + color: theme.palette.text.primary, + }, + [`.json-schema-2020-12-accordion__icon svg`]: { + fill: theme.palette.text.primary, + }, + [`& .json-schema-2020-12-accordion, + .json-schema-2020-12-expand-deep-button`]: { + background: 'none', + appearance: 'none', + }, + [`& .json-schema-2020-12-expand-deep-button, + .json-schema-2020-12-keyword__name--secondary, + .json-schema-2020-12-keyword__value--secondary, + .json-schema-2020-12__attribute--muted, + .json-schema-2020-12-keyword__value--const, + .json-schema-2020-12-keyword__value--warning`]: { + color: theme.palette.text.secondary, + }, + [`& .json-schema-2020-12-body, + .json-schema-2020-12-keyword__value--const, + .json-schema-2020-12-keyword__value--warning`]: { + borderColor: theme.palette.text.secondary, + }, + [`.json-schema-2020-12__constraint--string`]: { + backgroundColor: theme.palette.primary.main, + }, + [`& .json-schema-2020-12__attribute--primary, + .json-schema-2020-12-property--required>.json-schema-2020-12:first-of-type>.json-schema-2020-12-head .json-schema-2020-12__title:after`]: + { + color: theme.palette.primary.main, + }, + [`& .json-schema-2020-12-property--required>.json-schema-2020-12:first-of-type>.json-schema-2020-12-head .json-schema-2020-12__title:after`]: + { + color: theme.palette.warning.dark, + }, }, }, })); From 3cd1deef6cb7396c2ecad452dc33e3a5e2264d31 Mon Sep 17 00:00:00 2001 From: Jonathan Roebuck Date: Tue, 15 Oct 2024 14:15:34 +0100 Subject: [PATCH 2/4] add changeset Signed-off-by: Jonathan Roebuck --- .changeset/mighty-jobs-unite.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/mighty-jobs-unite.md diff --git a/.changeset/mighty-jobs-unite.md b/.changeset/mighty-jobs-unite.md new file mode 100644 index 0000000000..868372196c --- /dev/null +++ b/.changeset/mighty-jobs-unite.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-api-docs': minor +--- + +Uses theme values to style the API definition schema so that theme overrides apply. From 8963eaa7a0029a866bc5fe988853b10e6b439936 Mon Sep 17 00:00:00 2001 From: Jonathan Roebuck Date: Tue, 15 Oct 2024 14:33:21 +0100 Subject: [PATCH 3/4] remove duplicated style Signed-off-by: Jonathan Roebuck --- .../OpenApiDefinitionWidget/OpenApiDefinition.tsx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx b/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx index 58b1a277a5..ea1df525b7 100644 --- a/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx +++ b/plugins/api-docs/src/components/OpenApiDefinitionWidget/OpenApiDefinition.tsx @@ -94,7 +94,8 @@ const useStyles = makeStyles(theme => ({ .errors small`]: { color: theme.palette.text.secondary, }, - [`& .parameter__name.required:after`]: { + [`& .parameter__name.required:after, + .parameter__name.required span`]: { color: theme.palette.warning.dark, }, [`& table.model, @@ -165,11 +166,9 @@ const useStyles = makeStyles(theme => ({ [`.json-schema-2020-12__constraint--string`]: { backgroundColor: theme.palette.primary.main, }, - [`& .json-schema-2020-12__attribute--primary, - .json-schema-2020-12-property--required>.json-schema-2020-12:first-of-type>.json-schema-2020-12-head .json-schema-2020-12__title:after`]: - { - color: theme.palette.primary.main, - }, + [`& .json-schema-2020-12__attribute--primary`]: { + color: theme.palette.primary.main, + }, [`& .json-schema-2020-12-property--required>.json-schema-2020-12:first-of-type>.json-schema-2020-12-head .json-schema-2020-12__title:after`]: { color: theme.palette.warning.dark, From cf3d4edd304cb1881f579cf2dcc3c997cf2021cf Mon Sep 17 00:00:00 2001 From: Patrik Oldsberg Date: Fri, 18 Oct 2024 14:29:03 +0200 Subject: [PATCH 4/4] Update .changeset/mighty-jobs-unite.md Signed-off-by: Patrik Oldsberg --- .changeset/mighty-jobs-unite.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/mighty-jobs-unite.md b/.changeset/mighty-jobs-unite.md index 868372196c..c8e880ba3e 100644 --- a/.changeset/mighty-jobs-unite.md +++ b/.changeset/mighty-jobs-unite.md @@ -1,5 +1,5 @@ --- -'@backstage/plugin-api-docs': minor +'@backstage/plugin-api-docs': patch --- Uses theme values to style the API definition schema so that theme overrides apply.