raj/raj.how
raj
/
raj.how
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

grad fixes

This commit is contained in:
Raj Sharma 2024-01-09 23:50:28 +05:30
parent fad9ee3bcc
commit 9dd0910602
5 changed files with 45 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/app/(assets)/symetric-grad.svg
View File

@ -1,28 +1,28 @@
<svg width="2258" height="1534" viewBox="0 0 2258 1534" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_f_458_153)">
<ellipse cx="1123.1" cy="626.098" rx="325.512" ry="383.098" transform="rotate(-90 1123.1 626.098)" fill="#95C6FF"/>
<g filter="url(#filter0_f_467_3)">
<ellipse cx="1123.1" cy="626.098" rx="325.512" ry="383.098" transform="rotate(-90 1123.1 626.098)" fill="#7474FF"/>
</g>
<g filter="url(#filter1_f_458_153)">
<ellipse cx="742.098" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 742.098 905.488)" fill="#95FFFF"/>
<g filter="url(#filter1_f_467_3)">
<ellipse cx="742.098" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 742.098 905.488)" fill="#A7C9FF"/>
</g>
<g filter="url(#filter2_f_458_153)">
<ellipse cx="1504.1" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 1504.1 905.488)" fill="#95FFFF"/>
<g filter="url(#filter2_f_467_3)">
<ellipse cx="1504.1" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 1504.1 905.488)" fill="#A7C9FF"/>
</g>
<defs>
<filter id="filter0_f_458_153" x="440" y="0.585938" width="1366.2" height="1251.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<filter id="filter0_f_467_3" x="440" y="0.585938" width="1366.2" height="1251.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_458_153"/>
<feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_467_3"/>
</filter>
<filter id="filter1_f_458_153" x="-41" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<filter id="filter1_f_467_3" x="-41" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_458_153"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_467_3"/>
</filter>
<filter id="filter2_f_458_153" x="721" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<filter id="filter2_f_467_3" x="721" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_458_153"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_467_3"/>
</filter>
</defs>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

28
src/app/(assets)/symetric-grad1.svg Normal file
View File

@ -0,0 +1,28 @@
<svg width="2258" height="1534" viewBox="0 0 2258 1534" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_f_458_153)">
<ellipse cx="1123.1" cy="626.098" rx="325.512" ry="383.098" transform="rotate(-90 1123.1 626.098)" fill="#95C6FF"/>
</g>
<g filter="url(#filter1_f_458_153)">
<ellipse cx="742.098" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 742.098 905.488)" fill="#95FFFF"/>
</g>
<g filter="url(#filter2_f_458_153)">
<ellipse cx="1504.1" cy="905.488" rx="325.512" ry="383.098" transform="rotate(-90 1504.1 905.488)" fill="#95FFFF"/>
</g>
<defs>
<filter id="filter0_f_458_153" x="440" y="0.585938" width="1366.2" height="1251.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_458_153"/>
</filter>
<filter id="filter1_f_458_153" x="-41" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_458_153"/>
</filter>
<filter id="filter2_f_458_153" x="721" y="179.976" width="1566.2" height="1451.02" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="200" result="effect1_foregroundBlur_458_153"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

6
src/app/(home)/page.tsx
View File

@ -36,9 +36,9 @@ export default function Page() {
<Projects />
</section>
<section className="stories-section">
<SymetricGradProvider>
<Stories />
</SymetricGradProvider>
{/* <SymetricGradProvider> */}
<Stories />
{/* </SymetricGradProvider> */}
</section>
<section className="now-section">
<Now />

2
src/app/(home)/story/page.tsx
View File

@ -43,7 +43,7 @@ export default async function Story({
grainHeight: 1,
}}
/>
<BackgroundGradentProvider className="-z-10 h-screen w-full opacity-90" />
<BackgroundGradentProvider className="-z-10 h-screen w-full opacity-60" />
<SymetricGradProvider gradient_class={cn("rotate-0")} className="w-full">
<Image
width={400}

2
src/components/gradient-provider.tsx
View File

@ -55,7 +55,7 @@ export function BackgroundGradentProvider({
return (
<motion.div
className={cn(
"fixed overflow-hidden w-full h-full opacity-20 top-0 left-0",
"fixed overflow-hidden w-full h-full opacity-60 top-0 left-0",
className,
)}
>