diff --git a/src/components/PageWrappers/PageWrapperGradient.tsx b/src/components/PageWrappers/PageWrapperGradient.tsx new file mode 100644 index 00000000..51ff650a --- /dev/null +++ b/src/components/PageWrappers/PageWrapperGradient.tsx @@ -0,0 +1,12 @@ +import { ReactNode } from 'react' +import './layoutGradient.css' + +type PageWrapperShadowProps = { + children: ReactNode +} + +const PageWrapperGradient = ({ children }: PageWrapperShadowProps) => { + return
{children}
+} + +export default PageWrapperGradient diff --git a/src/components/PageWrappers/layoutGradient.css b/src/components/PageWrappers/layoutGradient.css new file mode 100644 index 00000000..f155d420 --- /dev/null +++ b/src/components/PageWrappers/layoutGradient.css @@ -0,0 +1,19 @@ +.layout { + background-color: #fff; + height: 100%; + position: relative; + display: flex; + flex-wrap: wrap; + overflow: hidden; +} + +.layout::after { + display: block; + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(to bottom, rgba(113, 64, 253, 0.075) 15%, rgba(255, 255, 255, 0) 50%); +} diff --git a/src/pages/ValidatorOnboarding/ValidatorOnboarding.tsx b/src/pages/ValidatorOnboarding/ValidatorOnboarding.tsx index aff2d6b7..2ffd0613 100644 --- a/src/pages/ValidatorOnboarding/ValidatorOnboarding.tsx +++ b/src/pages/ValidatorOnboarding/ValidatorOnboarding.tsx @@ -1,15 +1,15 @@ import { YStack } from 'tamagui' -import PageWrapperShadow from '../../components/PageWrappers/PageWrapperShadow' import { Shadow, Text } from '@status-im/components' import FormStepper from './Stepper' import Titles from '../../components/General/Titles' +import PageWrapperGradient from '../../components/PageWrappers/PageWrapperGradient' function ValidatorOnboarding() { return ( <> - + - + Create Nimbus Validator @@ -36,7 +36,7 @@ function ValidatorOnboarding() { - + ) }