From d0e2116c448e47087566de0be290f62efb821fee Mon Sep 17 00:00:00 2001 From: Efrain Gutierrez Date: Wed, 7 Apr 2021 11:49:02 -0500 Subject: [PATCH 1/5] Adjusting Heading for Scaffolding Template Page Signed-off-by: Efrain Gutierrez --- packages/core/src/layout/Header/Header.tsx | 8 ++++++-- packages/core/src/layout/InfoCard/InfoCard.tsx | 3 +++ .../components/MultistepJsonForm/MultistepJsonForm.tsx | 4 +++- .../src/components/TemplatePage/TemplatePage.tsx | 6 +++++- 4 files changed, 17 insertions(+), 4 deletions(-) diff --git a/packages/core/src/layout/Header/Header.tsx b/packages/core/src/layout/Header/Header.tsx index efa7502723..1ad7b91687 100644 --- a/packages/core/src/layout/Header/Header.tsx +++ b/packages/core/src/layout/Header/Header.tsx @@ -140,7 +140,7 @@ const TypeFragment = ({ const TitleFragment = ({ pageTitle, classes, tooltip }: TitleFragmentProps) => { const FinalTitle = ( - + {pageTitle} ); @@ -166,7 +166,11 @@ const SubtitleFragment = ({ classes, subtitle }: SubtitleFragmentProps) => { } return ( - + {subtitle} ); diff --git a/packages/core/src/layout/InfoCard/InfoCard.tsx b/packages/core/src/layout/InfoCard/InfoCard.tsx index cf06a5f0a1..5bb3e19362 100644 --- a/packages/core/src/layout/InfoCard/InfoCard.tsx +++ b/packages/core/src/layout/InfoCard/InfoCard.tsx @@ -125,6 +125,7 @@ type Props = { actionsTopRight?: ReactNode; className?: string; noPadding?: boolean; + titleTypographyProps?: object; }; export const InfoCard = ({ @@ -143,6 +144,7 @@ export const InfoCard = ({ actionsTopRight, className, noPadding, + titleTypographyProps, }: Props): JSX.Element => { const classes = useStyles(); /** @@ -183,6 +185,7 @@ export const InfoCard = ({ title={title} subheader={subheader} style={{ ...headerStyle }} + titleTypographyProps={titleTypographyProps} {...headerProps} /> )} diff --git a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx index 876d6dfa66..5354216bd9 100644 --- a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx +++ b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx @@ -75,7 +75,9 @@ export const MultistepJsonForm = ({ return ( - {title} + + {title} +
{ {loading && } {schema && ( - + Date: Wed, 7 Apr 2021 17:52:41 -0500 Subject: [PATCH 2/5] add accessibility for sighted users Signed-off-by: miguelrambalt --- .../components/MultistepJsonForm/MultistepJsonForm.tsx | 8 ++++++-- .../src/components/TemplateCard/TemplateCard.tsx | 2 +- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx index 5354216bd9..58f5f5cd11 100644 --- a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx +++ b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx @@ -71,10 +71,14 @@ export const MultistepJsonForm = ({ return ( <> - {steps.map(({ title, schema, ...formProps }) => { + {steps.map(({ title, schema, ...formProps }, index) => { return ( - + {title} diff --git a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx index 25f89f20ab..2ba83fdaae 100644 --- a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx +++ b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx @@ -85,7 +85,7 @@ export const TemplateCard = ({ {description} - From ea677c0361a44e6ac76b93ad34c676bc58f9c72e Mon Sep 17 00:00:00 2001 From: miguelrambalt Date: Thu, 8 Apr 2021 11:47:54 -0500 Subject: [PATCH 3/5] add header accessibility in create Signed-off-by: miguelrambalt --- .../core/src/layout/ContentHeader/ContentHeader.tsx | 7 ++++++- packages/core/src/layout/ItemCard/ItemCardHeader.tsx | 12 ++++++++++-- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/packages/core/src/layout/ContentHeader/ContentHeader.tsx b/packages/core/src/layout/ContentHeader/ContentHeader.tsx index e9fba56358..3ccf8f894c 100644 --- a/packages/core/src/layout/ContentHeader/ContentHeader.tsx +++ b/packages/core/src/layout/ContentHeader/ContentHeader.tsx @@ -66,7 +66,12 @@ const DefaultTitle = ({ title = 'Unknown page', className, }: DefaultTitleProps) => ( - + {title} ); diff --git a/packages/core/src/layout/ItemCard/ItemCardHeader.tsx b/packages/core/src/layout/ItemCard/ItemCardHeader.tsx index 17c4a19e58..ebf419cba0 100644 --- a/packages/core/src/layout/ItemCard/ItemCardHeader.tsx +++ b/packages/core/src/layout/ItemCard/ItemCardHeader.tsx @@ -77,8 +77,16 @@ export const ItemCardHeader = (props: ItemCardHeaderProps) => { const classes = useStyles(props); return (
- {subtitle && {subtitle}} - {title && {title}} + {subtitle && ( + + {subtitle} + + )} + {title && ( + + {title} + + )} {children}
); From 875614c9b629508043bb944db1abdd61b0edb20a Mon Sep 17 00:00:00 2001 From: miguelrambalt Date: Thu, 8 Apr 2021 12:04:44 -0500 Subject: [PATCH 4/5] add color for accessibility in Lifecycle for headers Signed-off-by: miguelrambalt --- packages/core/src/components/Lifecycle/Lifecycle.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/src/components/Lifecycle/Lifecycle.tsx b/packages/core/src/components/Lifecycle/Lifecycle.tsx index d388452cdc..585f7a5c18 100644 --- a/packages/core/src/components/Lifecycle/Lifecycle.tsx +++ b/packages/core/src/components/Lifecycle/Lifecycle.tsx @@ -25,7 +25,7 @@ type Props = CSS.Properties & { const useStyles = makeStyles({ alpha: { - color: '#d00150', + color: '#ffffff', fontFamily: 'serif', fontWeight: 'normal', fontStyle: 'italic', From 99fbef232287eba6733d8811af53dfa27798e28e Mon Sep 17 00:00:00 2001 From: Efrain Gutierrez Date: Wed, 14 Apr 2021 14:16:14 -0500 Subject: [PATCH 5/5] Updating Changeset for Scaffolder Plugin Header Accessibility Signed-off-by: Efrain Gutierrez --- .changeset/flat-paws-rule.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/flat-paws-rule.md diff --git a/.changeset/flat-paws-rule.md b/.changeset/flat-paws-rule.md new file mode 100644 index 0000000000..af7725793e --- /dev/null +++ b/.changeset/flat-paws-rule.md @@ -0,0 +1,6 @@ +--- +'@backstage/core': patch +'@backstage/plugin-scaffolder': patch +--- + +Adding Headings for Accessibility on the Scaffolder Plugin