redesign of whole landing page

README.md

@@ -1,6 +1,6 @@
 # DISCLAIMER
 
-### We have ended up rewriting the commit history due to a faulty commit, let's take this as a learning to double check our triple checks before making a PR, just to get a PR merged you don't have to rush, you have ample time to work on an issue once assigned, depending on the magnitude of the issue, anyways due to the same you have to take a fresh fork if you are a recurring contributor and if you are a new contributor, do keep this in mind and start contributing, you are good to go 
+### We have ended up rewriting the commit history due to a faulty commit, let's take this as a learning to double check our triple checks before making a PR, just to get a PR merged you don't have to rush, you have ample time to work on an issue once assigned, depending on the magnitude of the issue, anyways due to the same you have to take a fresh fork if you are a recurring contributor and if you are a new contributor, do keep this in mind and start contributing, you are good to go
 
 # Project Name: Tiplink
 
@@ -45,14 +45,14 @@ Using Docker:
    ```bash
    cd tiplink
    ```
-3. Create a .env file in the root folder of your project. Update it following the convention of the .env.example file. 
+3. Create a .env file in the root folder of your project. Update it following the convention of the .env.example file.
    Here's an example:
    ```bash
     CLIENT_SECRET = '' #Get it from Google developers console
     CLIENT_ID = '' #Get it from Google developers console
-    NEXTAUTH_SECRET = '' 
+    NEXTAUTH_SECRET = ''
     NEXTAUTH_URL = '' #Your frontend base URL
-    #DATABASE_URL = 'postgresql://postgres:password@localhost:5432/mydatabase'   
+    #DATABASE_URL = 'postgresql://postgres:password@localhost:5432/mydatabase'
     DATABASE_URL = 'postgresql://postgres:password@postgres:5432/mydatabase'  #Use this for setting up docker
     NEXT_PUBLIC_SOLANA_RPC = '' #Your Custom Solana RPC URL
    ```
@@ -72,11 +72,12 @@ Using Docker:
    ```bash
    docker compose up
    ```
-Without Docker
+   Without Docker
 
 ### Without Docker
 
 1. clone the repository:
+
    ```bash
    git clone https://github.com/code100x/tiplink.git
    ```
@@ -122,12 +123,14 @@ Contributions are welcome! If you'd like to contribute to the Tiplink project, p
 
 ## Resource Reference Section for various pieces of the project
 
-### For reading up on AWS KMS: 
+### For reading up on AWS KMS:
+
 - [AWS KMS Docs](https://docs.aws.amazon.com/encryption-sdk/latest/developer-guide/js-examples.html)
 - [Data Encryption on AWS](https://enlear.academy/data-encryption-on-aws-8d6be6033351)
 - [AWS Encryption SDK Guide](https://enlear.academy/aws-encryption-sdk-d38bfae40e9f)
 
-### For reading up on GCP KMS: 
+### For reading up on GCP KMS:
+
 - [GCP KMS Docs](https://cloud.google.com/nodejs/docs/reference/kms/latest)
 - [Video Guide for GCP on Google Cloud Tech](https://www.youtube.com/watch?v=WKZC93y-aWI)
 
@@ -138,9 +141,9 @@ Please take an updated pull from the dev branch, and request branches for furthe
 - **main** - Stable branch
 - **dev** - Branch for all the developer changes (Where your code will reside before moving to production)
 - **dev-backend**- Branch for all developer changes in the backend
-- **dev-backend/*** - Branch for changes in specific features within the backend 
+- **dev-backend/\*** - Branch for changes in specific features within the backend
 - **dev-frontend** - Branch for all developer changes in the frontend
-- **dev-frontend/*** - Branch for changes in specific features within the frontend
+- **dev-frontend/\*** - Branch for changes in specific features within the frontend
 
 ## License
 

package.json

@@ -27,6 +27,7 @@
     "@prisma/client": "^5.17.0",
     "@radix-ui/react-accordion": "^1.2.0",
     "@radix-ui/react-dropdown-menu": "^2.1.1",
+    "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-slot": "^1.1.0",
     "@solana/wallet-adapter-react": "^0.15.35",

src/app/page.tsx

@@ -1,13 +1,16 @@
 import { Footer } from '@/components/Appbar/Footer'
 import Home from '@/components/Home/Home'
 import { ScrollToTopButton } from '@/components/ui/scroll-to-top-button'
+import WaveBackground from '@/components/WaveBackground'
 
 export default function Page() {
   return (
     <>
-      <Home />
-      <Footer />
-      <ScrollToTopButton />
+      <div className="w-full bg-[#000000]">
+        <Home />
+        <Footer />
+        <ScrollToTopButton />
+      </div>
     </>
   )
 }

src/app/wallet/page.tsx

@@ -18,13 +18,12 @@ const Wallet = async () => {
       },
     })
     if (user) {
-      wallet = user?.publicKey ? user.publicKey :  await createWallet(user) 
+      wallet = user?.publicKey ? user.publicKey : await createWallet(user)
       balance = await fetchUserBalance(wallet)
       console.log(balance)
     }
   }
 
-
   return (
     <div className="h-full flex flex-col items-center">
       <TopBar />

src/components/Appbar/AppBarSkeleton.tsx

@@ -1,27 +1,24 @@
-const  AppBarSkeleton = () => {
+const AppBarSkeleton = () => {
   return (
-    <header className="animate-pulse w-screen py-4 border-b md:border-none fixed top-0 left-0 right-0 bg-white md:bg-white/0 z-50 ">
-          <div className="container pl-32 px-4 ">
-            <div className="flex justify-between items-center md:border md:p-2.5 rounded-xl max-w-2xl lg:max-w-4xl mx-auto md:bg-white/90 md:backdrop:blur-sm">
-              <div>
-                <div className="h-10 w-10 rounded-lg inline-flex justify-center items-center bg-gray-200">
-              </div>
-              </div>
-              <div className="hidden md:block">
-                <nav className="flex gap-8 rounded-md">
-                    <div className = 'rounded-md bg-gray-300 w-20 h-5'></div>
-                    <div className = 'rounded-md bg-gray-300 w-20 h-5'></div>
-                    <div className = 'rounded-md bg-gray-300 w-20 h-5'></div>
-                    <div className = 'rounded-md bg-gray-300 w-20 h-5'></div>
-                </nav>
-              </div>
-              <div className = 'rounded-md h-8 w-20 bg-gray-200'>
-              </div>
-            </div>
+    <header className="animate-pulse w-screen py-4 border-b md:border-none fixed top-0 left-0 right-0 bg-[#000000] md:bg-white/0 z-50 ">
+      <div className="container pl-32 px-4 ">
+        <div className="flex justify-between items-center md:border md:p-2.5 rounded-xl max-w-2xl lg:max-w-4xl mx-auto md:bg-gray-900 md:backdrop:blur-sm">
+          <div>
+            <div className="h-10 w-10 rounded-lg inline-flex justify-center items-center bg-gray-200"></div>
           </div>
-        </header>
+          <div className="hidden md:block">
+            <nav className="flex gap-8 rounded-md">
+              <div className="rounded-md bg-gray-900 w-20 h-5"></div>
+              <div className="rounded-md bg-gray-900 w-20 h-5"></div>
+              <div className="rounded-md bg-gray-900 w-20 h-5"></div>
+              <div className="rounded-md bg-gray-900 w-20 h-5"></div>
+            </nav>
+          </div>
+          <div className="rounded-md h-8 w-20 bg-gray-200"></div>
+        </div>
+      </div>
+    </header>
   )
 }
 
-
-export default AppBarSkeleton;
+export default AppBarSkeleton