diff --git a/packages/core/admin/admin/src/components/Notifications/Wrapper.js b/packages/core/admin/admin/src/components/Notifications/Wrapper.js deleted file mode 100644 index e012ba40cf..0000000000 --- a/packages/core/admin/admin/src/components/Notifications/Wrapper.js +++ /dev/null @@ -1,12 +0,0 @@ -import styled from 'styled-components'; -import { Flex } from '@strapi/parts/Flex'; - -const Wrapper = styled(Flex)` - position: fixed; - top: 46px; - right: 0; - left: 0; - z-index: 1100; -`; - -export default Wrapper; diff --git a/packages/core/admin/admin/src/components/Notifications/index.js b/packages/core/admin/admin/src/components/Notifications/index.js index 7a99668b51..1352851d21 100644 --- a/packages/core/admin/admin/src/components/Notifications/index.js +++ b/packages/core/admin/admin/src/components/Notifications/index.js @@ -1,11 +1,9 @@ import { NotificationsProvider } from '@strapi/helper-plugin'; import React, { useReducer } from 'react'; import PropTypes from 'prop-types'; -import { Box } from '@strapi/parts/Box'; import { Stack } from '@strapi/parts/Stack'; import Notification from './Notification'; import reducer, { initialState } from './reducer'; -import NotificationsWrapper from './Wrapper'; const Notifications = ({ children }) => { const [{ notifications }, dispatch] = useReducer(reducer, initialState); @@ -19,17 +17,21 @@ const Notifications = ({ children }) => { return ( - - - {notifications.map(notification => { - return ( - - - - ); - })} - - + + {notifications.map(notification => { + return ( + + ); + })} + {children} ); diff --git a/packages/core/admin/admin/src/components/Notifications/tests/index.test.js b/packages/core/admin/admin/src/components/Notifications/tests/index.test.js index 5d3344ff9e..7a8c1122ae 100644 --- a/packages/core/admin/admin/src/components/Notifications/tests/index.test.js +++ b/packages/core/admin/admin/src/components/Notifications/tests/index.test.js @@ -30,24 +30,15 @@ describe('', () => { expect(firstChild).toMatchInlineSnapshot(` .c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-pack: space-around; - -webkit-justify-content: space-around; - -ms-flex-pack: space-around; - justify-content: space-around; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + margin-left: -250px; + position: fixed; + left: 50%; + top: 2.875rem; + z-index: 10; + width: 31.25rem; } - .c2 { + .c1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -57,30 +48,19 @@ describe('', () => { flex-direction: column; } - .c2 > * { + .c1 > * { margin-top: 0; margin-bottom: 0; } - .c2 > * + * { - margin-top: 0px; - } - - .c1 { - position: fixed; - top: 46px; - right: 0; - left: 0; - z-index: 1100; + .c1 > * + * { + margin-top: 8px; }
-
-
+ width="31.25rem" + /> `); }); diff --git a/packages/core/admin/admin/src/tests/StrapiApp.test.js b/packages/core/admin/admin/src/tests/StrapiApp.test.js index afcb75e9c7..4b49b058ff 100644 --- a/packages/core/admin/admin/src/tests/StrapiApp.test.js +++ b/packages/core/admin/admin/src/tests/StrapiApp.test.js @@ -15,24 +15,15 @@ describe('ADMIN | StrapiApp', () => { expect(container.firstChild).toMatchInlineSnapshot(` .c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-pack: space-around; - -webkit-justify-content: space-around; - -ms-flex-pack: space-around; - justify-content: space-around; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + margin-left: -250px; + position: fixed; + left: 50%; + top: 2.875rem; + z-index: 10; + width: 31.25rem; } - .c2 { + .c1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -42,30 +33,19 @@ describe('ADMIN | StrapiApp', () => { flex-direction: column; } - .c2 > * { + .c1 > * { margin-top: 0; margin-bottom: 0; } - .c2 > * + * { - margin-top: 0px; - } - - .c1 { - position: fixed; - top: 46px; - right: 0; - left: 0; - z-index: 1100; + .c1 > * + * { + margin-top: 8px; }
-
-
+ width="31.25rem" + /> `); });