mirror of
https://github.com/strapi/strapi.git
synced 2025-09-25 08:19:07 +00:00
Implicity main / h1
This commit is contained in:
parent
62c269ba2b
commit
83fdbdebf1
@ -26,12 +26,10 @@ const App = () => {
|
||||
const { pathname } = useLocation();
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
// Check with @mfrachet if ok with a11y
|
||||
if (status === 'loading') {
|
||||
return (
|
||||
<Main labelledBy="title" aria-busy="true">
|
||||
<Main aria-busy="true">
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
title={formatMessage({
|
||||
id: getTrad('header.name'),
|
||||
defaultMessage: 'Content',
|
||||
|
@ -13,9 +13,8 @@ const NoContentType = () => {
|
||||
useFocusWhenNavigate();
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
title={formatMessage({
|
||||
id: getTrad('header.name'),
|
||||
defaultMessage: 'Content',
|
||||
|
@ -257,7 +257,7 @@ describe('CONTENT MANAGER | pages | NoContentType', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -278,7 +278,7 @@ describe('CONTENT MANAGER | pages | NoContentType', () => {
|
||||
>
|
||||
<h1
|
||||
class="c4"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Content
|
||||
</h1>
|
||||
|
@ -10,9 +10,8 @@ const NoPermissions = () => {
|
||||
useFocusWhenNavigate();
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
title={formatMessage({
|
||||
id: getTrad('header.name'),
|
||||
defaultMessage: 'Content',
|
||||
|
@ -138,7 +138,7 @@ describe('<NoPermissions />', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -159,7 +159,7 @@ describe('<NoPermissions />', () => {
|
||||
>
|
||||
<h1
|
||||
class="c4"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Content
|
||||
</h1>
|
||||
|
@ -15,7 +15,7 @@ const ForgotPassword = ({ onSubmit, schema }) => {
|
||||
|
||||
return (
|
||||
<UnauthenticatedLayout>
|
||||
<Main labelledBy="password-forgotten">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
@ -31,7 +31,7 @@ const ForgotPassword = ({ onSubmit, schema }) => {
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={7}>
|
||||
<H1 id="password-forgotten">
|
||||
<H1>
|
||||
{formatMessage({
|
||||
id: 'Auth.form.button.password-forgotten',
|
||||
defaultMessage: 'Password forgotten',
|
||||
|
@ -12,12 +12,12 @@ const ForgotPasswordSuccess = () => {
|
||||
|
||||
return (
|
||||
<UnauthenticatedLayout>
|
||||
<Main labelledBy="email-sent">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={7}>
|
||||
<H1 id="email-sent">
|
||||
<H1>
|
||||
{formatMessage({
|
||||
id: 'app.containers.AuthPage.ForgotPasswordSuccess.title',
|
||||
defaultMessage: 'Email sent',
|
||||
|
@ -26,7 +26,7 @@ const Login = ({ onSubmit, schema, children }) => {
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
return (
|
||||
<Main labelledBy="welcome">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
@ -44,7 +44,7 @@ const Login = ({ onSubmit, schema, children }) => {
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={1}>
|
||||
<H1 id="welcome">
|
||||
<H1>
|
||||
{formatMessage({
|
||||
id: 'Auth.form.welcome.title',
|
||||
defaultMessage: 'Welcome back!',
|
||||
|
@ -370,6 +370,7 @@ describe('ADMIN | PAGES | AUTH | BaseLogin', () => {
|
||||
|
||||
.c19 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #32324d;
|
||||
@ -405,12 +406,9 @@ describe('ADMIN | PAGES | AUTH | BaseLogin', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c19:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c20 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 0;
|
||||
color: #32324d;
|
||||
@ -446,19 +444,10 @@ describe('ADMIN | PAGES | AUTH | BaseLogin', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c20:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c18 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c18:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
@ -547,7 +536,7 @@ describe('ADMIN | PAGES | AUTH | BaseLogin', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="welcome"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -572,7 +561,7 @@ describe('ADMIN | PAGES | AUTH | BaseLogin', () => {
|
||||
>
|
||||
<h1
|
||||
class="c8"
|
||||
id="welcome"
|
||||
id="main-content-title"
|
||||
>
|
||||
Welcome back!
|
||||
</h1>
|
||||
|
@ -21,12 +21,12 @@ const Oops = () => {
|
||||
|
||||
return (
|
||||
<UnauthenticatedLayout>
|
||||
<Main labelledBy="email-sent">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={7}>
|
||||
<H1 id="email-sent">
|
||||
<H1>
|
||||
{formatMessage({ id: 'Auth.components.Oops.title', defaultMessage: 'Oops...' })}
|
||||
</H1>
|
||||
</Box>
|
||||
|
@ -251,7 +251,7 @@ describe('ADMIN | PAGES | AUTH | Oops', () => {
|
||||
class="c6"
|
||||
>
|
||||
<main
|
||||
aria-labelledby="email-sent"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c7"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -272,7 +272,7 @@ describe('ADMIN | PAGES | AUTH | Oops', () => {
|
||||
>
|
||||
<h1
|
||||
class="c14"
|
||||
id="email-sent"
|
||||
id="main-content-title"
|
||||
>
|
||||
Oops...
|
||||
</h1>
|
||||
|
@ -106,11 +106,11 @@ const Register = ({ fieldsToDisable, noSignin, onSubmit, schema }) => {
|
||||
>
|
||||
{({ values, errors, handleChange }) => (
|
||||
<Form noValidate>
|
||||
<Main labelledBy="welcome">
|
||||
<Main>
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={1}>
|
||||
<H1 id="welcome">
|
||||
<H1>
|
||||
{formatMessage({
|
||||
id: 'Auth.form.welcome.title',
|
||||
defaultMessage: 'Welcome back!',
|
||||
|
@ -376,6 +376,7 @@ describe('ADMIN | PAGES | AUTH | Register', () => {
|
||||
|
||||
.c29 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #32324d;
|
||||
@ -411,12 +412,9 @@ describe('ADMIN | PAGES | AUTH | Register', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c29:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c30 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 0;
|
||||
color: #32324d;
|
||||
@ -452,19 +450,10 @@ describe('ADMIN | PAGES | AUTH | Register', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c30:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c28 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c28:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c35 {
|
||||
@ -635,7 +624,7 @@ describe('ADMIN | PAGES | AUTH | Register', () => {
|
||||
novalidate=""
|
||||
>
|
||||
<main
|
||||
aria-labelledby="welcome"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c11"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -653,7 +642,7 @@ describe('ADMIN | PAGES | AUTH | Register', () => {
|
||||
>
|
||||
<h1
|
||||
class="c16"
|
||||
id="welcome"
|
||||
id="main-content-title"
|
||||
>
|
||||
Welcome back!
|
||||
</h1>
|
||||
|
@ -19,7 +19,7 @@ const ForgotPassword = ({ onSubmit, schema }) => {
|
||||
|
||||
return (
|
||||
<UnauthenticatedLayout>
|
||||
<Main labelledBy="password-forgotten">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
@ -36,7 +36,7 @@ const ForgotPassword = ({ onSubmit, schema }) => {
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={7}>
|
||||
<H1 id="password-forgotten">
|
||||
<H1>
|
||||
{formatMessage({
|
||||
id: 'Auth.reset-password.title',
|
||||
defaultMessage: 'Reset password',
|
||||
|
@ -319,6 +319,7 @@ describe('ADMIN | PAGES | AUTH | ResetPassword', () => {
|
||||
|
||||
.c23 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 0;
|
||||
color: #32324d;
|
||||
@ -354,19 +355,10 @@ describe('ADMIN | PAGES | AUTH | ResetPassword', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c23:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c22 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c22:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c18 textarea {
|
||||
@ -506,7 +498,7 @@ describe('ADMIN | PAGES | AUTH | ResetPassword', () => {
|
||||
class="c0 c8"
|
||||
>
|
||||
<main
|
||||
aria-labelledby="password-forgotten"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c9"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -531,7 +523,7 @@ describe('ADMIN | PAGES | AUTH | ResetPassword', () => {
|
||||
>
|
||||
<h1
|
||||
class="c16"
|
||||
id="password-forgotten"
|
||||
id="main-content-title"
|
||||
>
|
||||
Reset password
|
||||
</h1>
|
||||
|
@ -17,14 +17,14 @@ const StackCustom = styled(Stack)`
|
||||
align-items: flex-start;
|
||||
`;
|
||||
|
||||
const HomeHeader = ({ hasCreatedContentType, id, onCreateCT }) => {
|
||||
const HomeHeader = ({ hasCreatedContentType, onCreateCT }) => {
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Box paddingLeft={6} paddingBottom={10}>
|
||||
<StackCustom size={5}>
|
||||
<H1 id={id}>
|
||||
<H1>
|
||||
{hasCreatedContentType
|
||||
? formatMessage({
|
||||
id: 'app.components.HomePage.welcome.again',
|
||||
@ -71,13 +71,11 @@ const HomeHeader = ({ hasCreatedContentType, id, onCreateCT }) => {
|
||||
|
||||
HomeHeader.defaultProps = {
|
||||
hasCreatedContentType: undefined,
|
||||
id: undefined,
|
||||
onCreateCT: undefined,
|
||||
};
|
||||
|
||||
HomeHeader.propTypes = {
|
||||
hasCreatedContentType: PropTypes.bool,
|
||||
id: PropTypes.string,
|
||||
onCreateCT: PropTypes.func,
|
||||
};
|
||||
|
||||
|
@ -58,7 +58,7 @@ const HomePage = () => {
|
||||
<FormattedMessage id="HomePage.helmet.title" defaultMessage="Homepage">
|
||||
{title => <Helmet title={title[0]} />}
|
||||
</FormattedMessage>
|
||||
<Main labelledBy="homepage">
|
||||
<Main>
|
||||
<LogoContainer>
|
||||
<img alt="" aria-hidden src={Logo} />
|
||||
</LogoContainer>
|
||||
@ -67,7 +67,6 @@ const HomePage = () => {
|
||||
<GridItem col={8} s={12}>
|
||||
<HomeHeader
|
||||
onCreateCT={handleClick}
|
||||
id="homepage"
|
||||
hasCreatedContentType={hasAlreadyCreatedContentTypes}
|
||||
/>
|
||||
</GridItem>
|
||||
|
@ -619,7 +619,7 @@ describe('Homepage', () => {
|
||||
class="c1 c2"
|
||||
>
|
||||
<main
|
||||
aria-labelledby="homepage"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c3"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -628,7 +628,8 @@ describe('Homepage', () => {
|
||||
class="c4"
|
||||
>
|
||||
<img
|
||||
alt="Strapi logo"
|
||||
alt=""
|
||||
aria-hidden="true"
|
||||
src="IMAGE_MOCK"
|
||||
/>
|
||||
</div>
|
||||
@ -653,7 +654,7 @@ describe('Homepage', () => {
|
||||
>
|
||||
<h1
|
||||
class="c11"
|
||||
id="homepage"
|
||||
id="main-content-title"
|
||||
>
|
||||
Welcome on board!
|
||||
</h1>
|
||||
|
@ -23,10 +23,8 @@ const ApplicationInfosPage = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<SettingsPageTitle name="Application" />
|
||||
<Main labelledBy="application">
|
||||
<Main>
|
||||
<HeaderLayout
|
||||
as="h1"
|
||||
id="application"
|
||||
title={formatMessage({ id: 'Settings.application.title', defaultMessage: 'Application' })}
|
||||
subtitle={formatMessage({
|
||||
id: 'Settings.application.description',
|
||||
|
@ -258,7 +258,7 @@ describe('Application page', () => {
|
||||
class="c1 c2"
|
||||
>
|
||||
<main
|
||||
aria-labelledby="application"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c3"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -279,7 +279,7 @@ describe('Application page', () => {
|
||||
>
|
||||
<h1
|
||||
class="c7"
|
||||
id="application"
|
||||
id="main-content-title"
|
||||
>
|
||||
Application
|
||||
</h1>
|
||||
|
@ -86,7 +86,7 @@ const EditPage = () => {
|
||||
const isFormDisabled = role.code === 'strapi-super-admin';
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Roles" />
|
||||
<Formik
|
||||
enableReinitialize
|
||||
@ -102,7 +102,6 @@ const EditPage = () => {
|
||||
<form onSubmit={handleSubmit}>
|
||||
<>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Stack horizontal size={2}>
|
||||
<Button
|
||||
@ -138,7 +137,6 @@ const EditPage = () => {
|
||||
id: 'Settings.roles.create.description',
|
||||
defaultMessage: 'Define the rights given to the role',
|
||||
})}
|
||||
as="h1"
|
||||
/>
|
||||
<ContentLayout>
|
||||
<Stack size={6}>
|
||||
|
@ -348,6 +348,7 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
|
||||
|
||||
.c26 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #32324d;
|
||||
@ -383,19 +384,10 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c26:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c25:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c23 textarea {
|
||||
@ -430,11 +422,6 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
|
||||
font-size: 0.875rem;
|
||||
color: #32324d;
|
||||
background: #ffffff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c28:focus {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c28::-webkit-input-placeholder {
|
||||
@ -558,7 +545,7 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
|
||||
|
||||
<div>
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -579,7 +566,7 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Edit a role
|
||||
</h1>
|
||||
|
@ -101,10 +101,9 @@ const RoleListPage = () => {
|
||||
// ! TODO - Add the search input
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Roles" />
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Button onClick={handleToggleModalForCreatingRole} startIcon={<AddIcon />}>
|
||||
{formatMessage({
|
||||
|
@ -401,7 +401,7 @@ describe('<ListPage />', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -422,7 +422,7 @@ describe('<ListPage />', () => {
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
roles
|
||||
</h1>
|
||||
|
@ -130,10 +130,9 @@ const EditPage = ({ canUpdate }) => {
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<Main labelledBy="title" aria-busy="true">
|
||||
<Main aria-busy="true">
|
||||
<SettingsPageTitle name="Users" />
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Button disabled startIcon={<CheckIcon />} type="button">
|
||||
{formatMessage({ id: 'form.button.save', defaultMessage: 'Save' })}
|
||||
@ -149,7 +148,7 @@ const EditPage = ({ canUpdate }) => {
|
||||
}
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Users" />
|
||||
<Formik
|
||||
onSubmit={handleSubmit}
|
||||
@ -161,7 +160,6 @@ const EditPage = ({ canUpdate }) => {
|
||||
return (
|
||||
<Form>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Button
|
||||
disabled={isSubmitting || !canUpdate}
|
||||
|
@ -85,10 +85,9 @@ const ListPage = () => {
|
||||
);
|
||||
|
||||
return (
|
||||
<Main labelledBy="title" aria-busy={isLoading}>
|
||||
<Main aria-busy={isLoading}>
|
||||
<SettingsPageTitle name="Users" />
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={createAction}
|
||||
title={formatMessage({
|
||||
id: 'Settings.permissions.users.listview.header.title',
|
||||
|
@ -790,7 +790,7 @@ describe('ADMIN | Pages | USERS | ListPage', () => {
|
||||
|
||||
<main
|
||||
aria-busy="true"
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -811,7 +811,7 @@ describe('ADMIN | Pages | USERS | ListPage', () => {
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Users
|
||||
</h1>
|
||||
|
@ -50,7 +50,6 @@ const WebhookForm = ({
|
||||
{({ handleSubmit, errors, handleReset }) => (
|
||||
<Form noValidate>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Stack horizontal size={2}>
|
||||
<Button
|
||||
@ -94,7 +93,6 @@ const WebhookForm = ({
|
||||
})}
|
||||
</Link>
|
||||
}
|
||||
as="h1"
|
||||
/>
|
||||
<ContentLayout>
|
||||
<Stack size={4}>
|
||||
|
@ -162,7 +162,7 @@ const EditView = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Webhooks" />
|
||||
<WebhookForm
|
||||
{...{
|
||||
|
@ -240,11 +240,9 @@ const ListView = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<SettingsPageTitle name="Webhooks" />
|
||||
<Main labelledBy="webhooks" aria-busy={isLoading || loadingWebhooks}>
|
||||
<Main aria-busy={isLoading || loadingWebhooks}>
|
||||
<>
|
||||
<HeaderLayout
|
||||
as="h1"
|
||||
id="webhooks"
|
||||
title={formatMessage({ id: 'Settings.webhooks.title', defaultMessage: 'Webhooks' })}
|
||||
subtitle={formatMessage({
|
||||
id: 'Settings.webhooks.list.description',
|
||||
|
@ -184,7 +184,7 @@ describe('Admin | containers | ListView', () => {
|
||||
>
|
||||
<main
|
||||
aria-busy="true"
|
||||
aria-labelledby="webhooks"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c3"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -205,7 +205,7 @@ describe('Admin | containers | ListView', () => {
|
||||
>
|
||||
<h1
|
||||
class="c7"
|
||||
id="webhooks"
|
||||
id="main-content-title"
|
||||
>
|
||||
Webhooks
|
||||
</h1>
|
||||
|
@ -45,12 +45,12 @@ const Providers = () => {
|
||||
|
||||
return (
|
||||
<UnauthenticatedLayout>
|
||||
<Main labelledBy="welcome">
|
||||
<Main>
|
||||
<LayoutContent>
|
||||
<Column>
|
||||
<Logo />
|
||||
<Box paddingTop={6} paddingBottom={1}>
|
||||
<H1 id="welcome">{formatMessage({ id: 'Auth.form.welcome.title' })}</H1>
|
||||
<H1>{formatMessage({ id: 'Auth.form.welcome.title' })}</H1>
|
||||
</Box>
|
||||
<Box paddingBottom={7}>
|
||||
<Subtitle textColor="neutral600">
|
||||
|
@ -67,7 +67,7 @@ export const SingleSignOn = () => {
|
||||
const isHeaderButtonDisabled = isEqual(initialData, modifiedData);
|
||||
|
||||
return (
|
||||
<Main labelledBy="title" tabIndex={-1}>
|
||||
<Main tabIndex={-1}>
|
||||
<SettingsPageTitle name="SSO" />
|
||||
<form
|
||||
onSubmit={e => {
|
||||
@ -80,7 +80,6 @@ export const SingleSignOn = () => {
|
||||
}}
|
||||
>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Button
|
||||
data-testid="save-button"
|
||||
|
@ -254,7 +254,7 @@ describe('Admin | ee | SettingsPage | SSO', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -276,7 +276,7 @@ describe('Admin | ee | SettingsPage | SSO', () => {
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Single Sign-On
|
||||
</h1>
|
||||
|
@ -118,7 +118,7 @@ const CreatePage = () => {
|
||||
})} ${moment().format('LL')}`;
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Roles" />
|
||||
<Formik
|
||||
initialValues={{ name: '', description: defaultDescription }}
|
||||
@ -130,7 +130,6 @@ const CreatePage = () => {
|
||||
<Form noValidate>
|
||||
<>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Stack horizontal size={2}>
|
||||
<Button
|
||||
@ -161,7 +160,6 @@ const CreatePage = () => {
|
||||
id: 'Settings.roles.create.description',
|
||||
defaultMessage: 'Define the rights given to the role',
|
||||
})}
|
||||
as="h1"
|
||||
/>
|
||||
<ContentLayout>
|
||||
<Stack size={6}>
|
||||
|
@ -348,6 +348,7 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
|
||||
|
||||
.c26 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #32324d;
|
||||
@ -383,19 +384,10 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c26:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c25:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c23 textarea {
|
||||
@ -430,11 +422,6 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
|
||||
font-size: 0.875rem;
|
||||
color: #32324d;
|
||||
background: #ffffff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c28:focus {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c28::-webkit-input-placeholder {
|
||||
@ -558,7 +545,7 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
|
||||
|
||||
<div>
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -582,7 +569,7 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Create a role
|
||||
</h1>
|
||||
|
@ -249,10 +249,9 @@ const RoleListPage = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Roles" />
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
canCreate ? (
|
||||
<Button onClick={handleNewRoleClick} startIcon={<AddIcon />}>
|
||||
|
@ -40,8 +40,8 @@
|
||||
"@fortawesome/react-fontawesome": "^0.1.14",
|
||||
"@strapi/babel-plugin-switch-ee-ce": "1.0.0",
|
||||
"@strapi/helper-plugin": "3.6.8",
|
||||
"@strapi/icons": "0.0.1-alpha.26",
|
||||
"@strapi/parts": "0.0.1-alpha.26",
|
||||
"@strapi/icons": "0.0.1-alpha.27",
|
||||
"@strapi/parts": "0.0.1-alpha.27",
|
||||
"@strapi/utils": "3.6.8",
|
||||
"axios": "^0.21.1",
|
||||
"babel-loader": "8.2.2",
|
||||
|
@ -257,7 +257,6 @@ const ListView = () => {
|
||||
})}
|
||||
</Link>
|
||||
}
|
||||
as="h1"
|
||||
/>
|
||||
<ContentLayout>
|
||||
<Stack size={4}>
|
||||
|
@ -35,9 +35,8 @@ import { LoadingIndicatorPage, NoContent, NoPermissions } from '@strapi/helper-p
|
||||
return (
|
||||
<Box background="neutral100">
|
||||
<Layout>
|
||||
<Main labelledBy="title" aria-busy={isLoading}>
|
||||
<Main aria-busy={isLoading}>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={<Button startIcon={<AddIcon />}>Add an entry</Button>}
|
||||
secondaryAction={
|
||||
<Button variant="tertiary" startIcon={<EditIcon />}>
|
||||
|
@ -57,8 +57,8 @@
|
||||
"@storybook/builder-webpack5": "^6.3.7",
|
||||
"@storybook/manager-webpack5": "^6.3.7",
|
||||
"@storybook/react": "^6.3.7",
|
||||
"@strapi/icons": "0.0.1-alpha.26",
|
||||
"@strapi/parts": "0.0.1-alpha.26",
|
||||
"@strapi/icons": "0.0.1-alpha.27",
|
||||
"@strapi/parts": "0.0.1-alpha.27",
|
||||
"babel-loader": "^8.2.2",
|
||||
"cross-env": "^7.0.3",
|
||||
"enzyme": "^3.8.0",
|
||||
|
@ -118,7 +118,7 @@ export const SettingsPage = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<Main labelledBy="title" tabIndex={-1}>
|
||||
<Main tabIndex={-1}>
|
||||
<Helmet
|
||||
title={formatMessage({
|
||||
id: getTrad('page.title'),
|
||||
@ -127,7 +127,6 @@ export const SettingsPage = () => {
|
||||
/>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
title={formatMessage({
|
||||
id: getTrad('settings.header.label'),
|
||||
defaultMessage: 'Media Library - Settings',
|
||||
|
@ -220,7 +220,7 @@ exports[`Upload | SettingsPage renders and matches the snapshot 1`] = `
|
||||
|
||||
<div>
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -242,7 +242,7 @@ exports[`Upload | SettingsPage renders and matches the snapshot 1`] = `
|
||||
>
|
||||
<h1
|
||||
class="c5"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Media Library - Settings
|
||||
</h1>
|
||||
|
@ -29,9 +29,8 @@ const LocaleList = ({ canUpdateLocale, canDeleteLocale, onToggleCreateModal, isC
|
||||
const handleEditLocale = canUpdateLocale ? setLocaleToEdit : undefined;
|
||||
|
||||
return (
|
||||
<Main labelledBy="title" tabIndex={-1}>
|
||||
<Main tabIndex={-1}>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
<Button startIcon={<AddIcon />} onClick={onToggleCreateModal}>
|
||||
{formatMessage({ id: getTrad('Settings.list.actions.add') })}
|
||||
|
@ -77,6 +77,7 @@ describe('<Input />', () => {
|
||||
|
||||
.c6 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #32324d;
|
||||
@ -112,19 +113,10 @@ describe('<Input />', () => {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.c6:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c5 {
|
||||
border: 1px solid #dcdce4;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c5:focus-within {
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c1 {
|
||||
|
@ -136,15 +136,8 @@ export const ProvidersPage = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<SettingsPageTitle name={pageTitle} />
|
||||
<Main
|
||||
labelledBy={formatMessage({
|
||||
id: getTrad('HeaderNav.link.providers'),
|
||||
defaultMessage: 'Providers',
|
||||
})}
|
||||
>
|
||||
<Main>
|
||||
<HeaderLayout
|
||||
as="h1"
|
||||
id="providers"
|
||||
title={formatMessage({
|
||||
id: getTrad('HeaderNav.link.providers'),
|
||||
defaultMessage: 'Providers',
|
||||
|
@ -177,7 +177,7 @@ describe('Admin | containers | ProvidersPage', () => {
|
||||
class="c1 c2"
|
||||
>
|
||||
<main
|
||||
aria-labelledby="Providers"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c3"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -198,7 +198,7 @@ describe('Admin | containers | ProvidersPage', () => {
|
||||
>
|
||||
<h1
|
||||
class="c7"
|
||||
id="providers"
|
||||
id="main-content-title"
|
||||
>
|
||||
Providers
|
||||
</h1>
|
||||
|
@ -62,7 +62,7 @@ const EditPage = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<Main labelledBy="title">
|
||||
<Main>
|
||||
<SettingsPageTitle name="Roles" />
|
||||
<Formik
|
||||
enableReinitialize
|
||||
@ -73,7 +73,6 @@ const EditPage = () => {
|
||||
{({ handleSubmit }) => (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<HeaderLayout
|
||||
id="title"
|
||||
primaryAction={
|
||||
!isLoading && (
|
||||
<Button
|
||||
|
@ -116,7 +116,7 @@ it('renders users-permissions edit role and matches snapshot', () => {
|
||||
}
|
||||
|
||||
<main
|
||||
aria-labelledby="title"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c0"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -137,7 +137,7 @@ it('renders users-permissions edit role and matches snapshot', () => {
|
||||
>
|
||||
<h1
|
||||
class="c4"
|
||||
id="title"
|
||||
id="main-content-title"
|
||||
>
|
||||
Authenticated
|
||||
</h1>
|
||||
|
@ -85,10 +85,8 @@ const RoleListPage = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<SettingsPageTitle name={pageTitle} />
|
||||
<Main aria-busy={isLoading} labelledBy="roles">
|
||||
<Main aria-busy={isLoading}>
|
||||
<HeaderLayout
|
||||
as="h1"
|
||||
id="roles"
|
||||
title={formatMessage({
|
||||
id: 'Settings.roles.title',
|
||||
defaultMessage: 'Roles',
|
||||
|
@ -188,7 +188,7 @@ describe('Admin | containers | RoleListPage', () => {
|
||||
>
|
||||
<main
|
||||
aria-busy="true"
|
||||
aria-labelledby="roles"
|
||||
aria-labelledby="main-content-title"
|
||||
class="c3"
|
||||
id="main-content"
|
||||
tabindex="-1"
|
||||
@ -209,7 +209,7 @@ describe('Admin | containers | RoleListPage', () => {
|
||||
>
|
||||
<h1
|
||||
class="c7"
|
||||
id="roles"
|
||||
id="main-content-title"
|
||||
>
|
||||
Roles
|
||||
</h1>
|
||||
|
16
yarn.lock
16
yarn.lock
@ -4910,15 +4910,15 @@
|
||||
resolve-from "^5.0.0"
|
||||
store2 "^2.12.0"
|
||||
|
||||
"@strapi/icons@0.0.1-alpha.26":
|
||||
version "0.0.1-alpha.26"
|
||||
resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.26.tgz#652833c431b0eaf019d631e32f4dccc68ab87afb"
|
||||
integrity sha512-wveXSxcgoPuQNMaiTeOYeLvSoirq/7MwV6v+Xwod7WPvzvjK82H/O8kg2sTPGhTCtya952krAm/9DcEs3LfFUQ==
|
||||
"@strapi/icons@0.0.1-alpha.27":
|
||||
version "0.0.1-alpha.27"
|
||||
resolved "https://registry.yarnpkg.com/@strapi/icons/-/icons-0.0.1-alpha.27.tgz#1ebfb63ac159053fd699e395baf0fbbecce00601"
|
||||
integrity sha512-CICUMgGseazuKxbu7OBuLvxuFk0dKno3BFpu0og1mx+MMX354L8UnsVMHubk8t+us8eU2R9zAU0YKj3hjV/hqA==
|
||||
|
||||
"@strapi/parts@0.0.1-alpha.26":
|
||||
version "0.0.1-alpha.26"
|
||||
resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.26.tgz#44732b90026c56e48fb53c5768ad0aac7932caa0"
|
||||
integrity sha512-36IgzV/jTygrTVjlkHkcMIQCmZUtyY2D3EuK+XlApQEjJIfj0XwB0Q1Of6OMbTnUVVwKrWwpB/9Qzqv4yiw9AQ==
|
||||
"@strapi/parts@0.0.1-alpha.27":
|
||||
version "0.0.1-alpha.27"
|
||||
resolved "https://registry.yarnpkg.com/@strapi/parts/-/parts-0.0.1-alpha.27.tgz#ff8602cdc30b0db7033003cdcacbe3fb14bba3d2"
|
||||
integrity sha512-1dk2sEhYyZaKeYCH1nUK810mHOibI41+MXmN7fxyu+jklU7OYXtMAWqjKXGiJ4QDCIgA3gZ+Xgqnt+UjwN/M8g==
|
||||
dependencies:
|
||||
"@internationalized/number" "^3.0.2"
|
||||
compute-scroll-into-view "^1.0.17"
|
||||
|
Loading…
x
Reference in New Issue
Block a user