webapp and extension mobile ui

NetSepio · Jul 29, 2024 · 7c06207 · 7c06207
1 parent 055373d
commit 7c06207
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/src/app/webapp/page.jsx b/src/app/webapp/page.jsx
@@ -11,11 +11,11 @@ const Index = () => {
       <div className='absolute right-0 bottom-[40px] md:right-[35%] w-[140px] lg:w-[337px] h-[125px] lg:h-[316px] bg-[#11D9C5] rounded-full blur-3xl opacity-30' />
       <div className='absolute right-0 bottom-0 md:right-[10%] w-[140px] lg:w-[337px] h-[125px] lg:h-[316px] bg-[#11D9C5] rounded-full blur-3xl opacity-30' />
 
-      <div className='relative bottom-[7%] md:bottom-0 flex flex-col h-[55%] md:h-[90%] w-1/2 items-center md:items-start p-[5%] pt-[15%] lg:pt-[8%]'>
+      <div className='relative bottom-[7%] md:bottom-0 flex flex-col lg:w-1/2 md:w-1/2 w-full items-center md:items-start p-[5%] pt-[15%] lg:pt-[8%]'>
         <h2 className='bg-gradient-to-r text-3xl font-semibold md:text-5xl from-[#11D9C5] to-[#91A6FF] bg-clip-text text-transparent'>
         NetSepio WebApp
         </h2>
-        <p className='text-white font-thin text-xl lg:text-lg pt-[5%] md:pt-[8%] mb-[10%] lg:mb-[8%] w-4/5'>
+        <p className='text-white font-thin text-xl lg:text-lg pt-[5%] md:pt-[8%] mb-[10%] lg:mb-[8%] w-4/5 lg:text-start md:text-start text-center'>
         Leave verified reviews, manage projects with ease, and secure your internet connection with a built-in VPN.  
         All while earning rewards for your participation.
         </p>
@@ -26,9 +26,9 @@ const Index = () => {
         />
       </div>
 
-      <div className='relative pr-[3%]'>
+      <div className='relative lg:pr-[3%] md:pr-[3%]'>
         <img
-          className='object-cover bg-primary lg:bg-transparent lg:border-none border-opacity-30 z-20 border-[0.3px] border-cta rounded-md'
+          className='object-cover bg-transparent z-20'
           src={"/images/webapp/hero2.png"}
           fill
           alt='hero'

diff --git a/src/components/extension/HeroExt.jsx b/src/components/extension/HeroExt.jsx
@@ -8,11 +8,11 @@ const Hero = () => {
       <div className='absolute right-0 bottom-[40px] md:right-[35%] w-[140px] lg:w-[337px] h-[125px] lg:h-[316px] bg-[#11D9C5] rounded-full blur-3xl opacity-30' />
       <div className='absolute right-0 bottom-0 md:right-[10%] w-[140px] lg:w-[337px] h-[125px] lg:h-[316px] bg-[#11D9C5] rounded-full blur-3xl opacity-30' />
 
-      <div className='relative bottom-[7%] md:bottom-0 flex flex-col h-[55%] md:h-[90%] w-1/2 items-center md:items-start p-[5%] pt-[15%] lg:pt-[8%]'>
+      <div className='relative bottom-[7%] md:bottom-0 flex flex-col lg:w-1/2 md:w-1/2 items-center md:items-start p-[5%] pt-[15%] lg:pt-[8%]'>
         <h2 className='bg-gradient-to-r text-3xl font-semibold md:text-5xl from-[#11D9C5] to-[#91A6FF] bg-clip-text text-transparent'>
           Browser Extension
         </h2>
-        <p className='text-white font-thin text-xl lg:text-lg pt-[5%] md:pt-[8%] mb-[10%] lg:mb-[8%] w-4/5'>
+        <p className='text-white font-thin text-xl lg:text-lg pt-[5%] md:pt-[8%] mb-[10%] lg:mb-[8%] w-4/5 lg:text-start md:text-start text-center'>
         Combines your Web3 wallet with AI-driven insights and 
 reviews for every site you explore, giving you the power 
 to make safer and more informed online decisions.
@@ -24,9 +24,9 @@ to make safer and more informed online decisions.
         />
       </div>
 
-      <div className='relative w-1/2 pr-[3%]'>
+      <div className='relative lg:w-1/2 lg:pr-[3%] md:w-1/2 md:pr-[3%] w-3/4'>
         <img
-          className='object-cover bg-primary lg:bg-transparent lg:border-none border-opacity-30 z-20 border-[0.3px] border-cta rounded-md'
+          className='object-cover bg-transparent z-20'
           src={"/images/extension/hero.png"}
           fill
           alt='hero'