remove background color image

autonomys · Dec 18, 2024 · 7348e1c · 7348e1c
1 parent 59c9d01
commit 7348e1c
Show file tree

Hide file tree

Showing 9 changed files with 31 additions and 87 deletions.
diff --git a/explorer/public/images/backgroundColor.svg b/explorer/public/images/backgroundColor.svg
diff --git a/explorer/src/app/[chain]/consensus/accounts/[accountId]/image/route.tsx b/explorer/src/app/[chain]/consensus/accounts/[accountId]/image/route.tsx
@@ -84,19 +84,13 @@ function Screen({
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-40'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -124,7 +118,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-70 mb-4 p-6 w-100 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -158,7 +152,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-70 mb-4 p-6 w-130 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/consensus/blocks/[blockId]/image/route.tsx b/explorer/src/app/[chain]/consensus/blocks/[blockId]/image/route.tsx
@@ -77,19 +77,13 @@ function Screen({
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-40'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -117,7 +111,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-70 mb-4 p-6 w-100 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -151,7 +145,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-70 mb-4 p-6 w-130 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/consensus/events/[eventId]/image/route.tsx b/explorer/src/app/[chain]/consensus/events/[eventId]/image/route.tsx
@@ -75,19 +75,13 @@ function Screen({
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-40'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -115,7 +109,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-70 mb-4 p-6 w-100 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -141,7 +135,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-70 mb-4 p-6 w-130 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/consensus/extrinsics/[extrinsicId]/image/route.tsx b/explorer/src/app/[chain]/consensus/extrinsics/[extrinsicId]/image/route.tsx
@@ -78,19 +78,13 @@ function Screen({
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-40'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -118,7 +112,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-70 mb-4 p-6 w-100 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -152,7 +146,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-70 mb-4 p-6 w-130 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/consensus/image/route.tsx b/explorer/src/app/[chain]/consensus/image/route.tsx
@@ -65,19 +65,13 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-30'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -97,7 +91,7 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-60 mb-2 p-6 w-100 h-30'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -115,7 +109,7 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-100 mb-1 p-6 w-100 h-30'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -133,7 +127,7 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-60 mb-4 p-6 w-130 h-30'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>
@@ -151,7 +145,7 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-100 mb-1 p-6 w-130 h-30'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/consensus/logs/[logId]/image/route.tsx b/explorer/src/app/[chain]/consensus/logs/[logId]/image/route.tsx
@@ -74,19 +74,13 @@ function Screen({
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={url + '/images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div
         tw='absolute flex flex-row border-none rounded-[20px] p-4 w-240 h-40'
         style={{
-          background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+          background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
         }}
       >
         <h2
@@ -114,7 +108,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-30 mt-70 mb-4 p-6 w-100 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-100 m-6'>
@@ -148,7 +142,7 @@ function Screen({
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-140 mt-70 mb-4 p-6 w-130 h-40'
           style={{
-            background: 'linear-gradient(180deg, #4141B3 0%, #6B5ACF 50%, #896BD2 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-col w-130 m-6'>

diff --git a/explorer/src/app/[chain]/image/route.tsx b/explorer/src/app/[chain]/image/route.tsx
@@ -52,15 +52,9 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
     <div
       tw='relative w-full h-full flex flex-col items-center justify-between'
       style={{
-        background: 'linear-gradient(180deg, #0B050F 0%, #4D2F92 50%, #BC8EDA 100%)',
+        background: 'linear-gradient(180deg, #050D26 0%, #27355D 100%)',
       }}
     >
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={'http://localhost:3000//images/backgroundColor.svg'}
-        tw='w-[1200px] h-[630px]'
-        alt={'Background Color'}
-      />
       <div tw='absolute flex flex-row border-none w-full h-full'>
         <div tw='flex flex-col w-full justify ml-15'>
           <LogoIcon />
@@ -107,13 +101,13 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-155 mt-65 mb-4 p-6 w-60 h-50'
           style={{
-            background: 'linear-gradient(180deg, #AC70E1 0%, #E6ADDC 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         ></div>
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-155 mt-65 mb-4 p-6 w-60 h-50'
           style={{
-            background: 'linear-gradient(180deg, #AC70E1 0%, #E6ADDC 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-row w-full m-6 justify-center'>
@@ -139,7 +133,7 @@ function Screen({ chainMatch, data }: { chainMatch: (typeof indexers)[number]; d
         <div
           tw='absolute flex flex-row border-none rounded-[20px] ml-225 mt-65 mb-4 p-6 w-60 h-50'
           style={{
-            background: 'linear-gradient(180deg, #6E6ECD 0%, #A196E1 50%, #C2B0EE 100%)',
+            background: 'linear-gradient(180deg, #032372 0%, #1949D2 100%)',
           }}
         >
           <div tw='absolute flex flex-row w-full m-6 justify-center'>

diff --git a/explorer/src/components/layout/Layout.tsx b/explorer/src/components/layout/Layout.tsx
@@ -27,7 +27,7 @@ export const MainLayout: FC<Props> = ({ children, subHeader }) => {
 
   return (
     <div className="from-backgroundLight to-backgroundDark dark:from-backgroundDarker dark:to-backgroundDarkest dark:bg-boxDark relative flex min-h-screen w-full flex-col bg-gradient-to-b font-['Montserrat']">
-      <div className="relative flex min-h-screen w-full flex-col bg-[url('/images/backgroundColor.svg')] bg-cover font-['Montserrat']">
+      <div className="relative flex min-h-screen w-full flex-col font-['Montserrat']">
         {outOfSync}
         <SectionHeader />
         {subHeader}