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() {
-
+
>
)
}