diff --git a/packages/ra-core/src/CoreAdminRouter.tsx b/packages/ra-core/src/CoreAdminRouter.tsx index 579cbaed29d..3a0358e259a 100644 --- a/packages/ra-core/src/CoreAdminRouter.tsx +++ b/packages/ra-core/src/CoreAdminRouter.tsx @@ -4,7 +4,6 @@ import React, { cloneElement, createElement, ComponentType, - CSSProperties, ReactElement, FunctionComponent, } from 'react'; @@ -12,7 +11,7 @@ import { Route, Switch } from 'react-router-dom'; import { useLogout, useGetPermissions, useAuthState } from './auth'; import RoutesWithLayout from './RoutesWithLayout'; -import { useTimeout, useSafeSetState } from './util'; +import { Ready, useTimeout, useSafeSetState } from './util'; import { AdminChildren, CustomRoutes, @@ -24,12 +23,6 @@ import { ResourceElement, } from './types'; -const welcomeStyles: CSSProperties = { - width: '50%', - margin: '40vh 25vw', - textAlign: 'center', -}; - export interface AdminRouterProps extends LayoutProps { layout: LayoutComponent; catchAll: CatchAllComponent; @@ -119,14 +112,7 @@ const CoreAdminRouter: FunctionComponent = props => { typeof children !== 'function' && !children ) { - return ( -
- React-admin is properly configured. -
- Now you can add a first <Resource> as child of - <Admin>. -
- ); + return ; } if ( diff --git a/packages/ra-core/src/util/Ready.tsx b/packages/ra-core/src/util/Ready.tsx new file mode 100644 index 00000000000..fb5a2fe960f --- /dev/null +++ b/packages/ra-core/src/util/Ready.tsx @@ -0,0 +1,100 @@ +import React, { useState } from 'react'; + +const styles = { + root: { + width: '100vw', + height: '100vh', + display: 'flex', + flexDirection: 'column' as 'column', + fontFamily: '"Roboto", sans-serif', + }, + main: { + flex: 1, + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + textAlign: 'center' as 'center', + flexDirection: 'column' as 'column', + background: + 'linear-gradient(135deg, #00023b 0%, #00023b 50%, #313264 100%)', + color: 'white', + fontSize: '1.5em', + fontWeight: 'bold' as 'bold', + }, + secondary: { + height: '20vh', + background: '#e8e8e8', + color: 'black', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-evenly', + }, + link: { + textAlign: 'center' as 'center', + width: 150, + display: 'block', + textDecoration: 'none', + color: 'black', + opacity: 0.7, + }, + linkHovered: { + opacity: 1, + }, +}; + +const Button = ({ img, label, href }) => { + const [hovered, setHovered] = useState(false); + return ( +
+ setHovered(true)} + onMouseLeave={() => setHovered(false)} + > + {label} +
+ {label} +
+
+ ); +}; + +export default () => ( +
+
+ react-admin logo +

Welcome to React-admin

+
+ Your application is properly configured. +
+ Now you can add a <Resource> as child of <Admin>. +
+
+
+
+
+); diff --git a/packages/ra-core/src/util/index.ts b/packages/ra-core/src/util/index.ts index 8fd2a9af1be..0346a043607 100644 --- a/packages/ra-core/src/util/index.ts +++ b/packages/ra-core/src/util/index.ts @@ -6,6 +6,7 @@ import ComponentPropType from './ComponentPropType'; import linkToRecord from './linkToRecord'; import removeEmpty from './removeEmpty'; import removeKey from './removeKey'; +import Ready from './Ready'; import resolveRedirectTo from './resolveRedirectTo'; import TestContext from './TestContext'; import renderWithRedux from './renderWithRedux'; @@ -20,6 +21,7 @@ export { getFieldLabelTranslationArgs, ComponentPropType, linkToRecord, + Ready, removeEmpty, removeKey, resolveRedirectTo,