From b402ed3336751b1302c2905915a26f17467f3e7e Mon Sep 17 00:00:00 2001
From: futjr <logan@alrgcorp.com>
Date: Tue, 5 Nov 2024 13:06:06 +0000
Subject: [PATCH] fix error

---
 src/components/ContentContainer.module.css | 21 +++++++++++++++++++++
 src/components/ContentContainer.tsx        |  3 ++-
 src/components/LeaderboardTotals.tsx       |  6 +++---
 src/components/ProfileWallets.module.css   | 11 +++++------
 src/components/Socials.module.css          | 12 +++++-------
 5 files changed, 36 insertions(+), 17 deletions(-)
 create mode 100644 src/components/ContentContainer.module.css

diff --git a/src/components/ContentContainer.module.css b/src/components/ContentContainer.module.css
new file mode 100644
index 0000000..4843d5f
--- /dev/null
+++ b/src/components/ContentContainer.module.css
@@ -0,0 +1,21 @@
+.container {
+    padding: 0 420px;
+  }
+  
+  @media (max-width: 1920px) {
+    .container {
+      padding: 0 240px;
+    }
+  }
+  
+  @media (max-width: 1440px) {
+    .container {
+      padding: 0 120px;
+    }
+  }
+  
+  @media (max-width: 768px) {
+    .container {
+      padding: 0 16px;
+    }
+  }
\ No newline at end of file
diff --git a/src/components/ContentContainer.tsx b/src/components/ContentContainer.tsx
index 10efbcc..f8106c7 100644
--- a/src/components/ContentContainer.tsx
+++ b/src/components/ContentContainer.tsx
@@ -2,6 +2,7 @@ import { FC, ReactNode } from 'react';
 import Link from "next/link";
 import Text from './Text';
 import NavElement from './nav-element';
+import styles from './ContentContainer.module.css';
 
 interface Props {
   children: React.ReactNode;
@@ -9,7 +10,7 @@ interface Props {
 
 export const ContentContainer: FC<{ children: ReactNode }> = ({ children }) => {
   return (
-    <div className="flex-1 container mx-auto px-4 md:px-6">
+    <div className={`flex-1 container mx-auto ${styles.container}`}>
       <div className="h-full w-full flex flex-col items-center justify-center">
         {children}
       </div>
diff --git a/src/components/LeaderboardTotals.tsx b/src/components/LeaderboardTotals.tsx
index 97a5e0a..471af1d 100644
--- a/src/components/LeaderboardTotals.tsx
+++ b/src/components/LeaderboardTotals.tsx
@@ -74,9 +74,9 @@ const LeaderboardTotals: NextPage = () => {
       <div className={styles.instanceParent}>
         {isLoading ? (
           <>
-            {renderMetric(<div className="animate-pulse bg-gray-300 h-8 w-24 rounded" />, 'PARTNERS')}
-            {renderMetric(<div className="animate-pulse bg-gray-300 h-8 w-24 rounded" />, 'TOTAL WORTH')}
-            {renderMetric(<div className="animate-pulse bg-gray-300 h-8 w-24 rounded" />, 'NEW PARTNERS (7D)')}
+            {renderMetric('-', 'PARTNERS')}
+            {renderMetric('-', 'TOTAL WORTH')} 
+            {renderMetric('-', 'NEW PARTNERS (7D)')}
           </>
         ) : error ? (
           <>
diff --git a/src/components/ProfileWallets.module.css b/src/components/ProfileWallets.module.css
index 64ee9e6..6240735 100644
--- a/src/components/ProfileWallets.module.css
+++ b/src/components/ProfileWallets.module.css
@@ -60,10 +60,9 @@
     flex-direction: column;
     align-items: flex-start;
     justify-content: flex-start;
-    padding: 0 8px;
+    padding: 0;
     box-sizing: border-box;
     gap: 10px;
-    max-width: 600px;
     text-align: left;
     font-size: 18px;
     color: #242424;
@@ -81,18 +80,18 @@
     align-items: center;
     gap: 12px;
     width: 100%;
-    margin: 0 0px;
+    margin: 0;
 }
 
 @media (max-width: 768px) {
     .numberParent {
-        padding: 0 24px;  /* Match metricsBar margin */
+        padding: 0;
     }
     
     .title {
-        margin: 24px 0 16px 24px;  /* Add spacing between sections */
+        margin: 24px 0 16px 0;
     }
     .buttonParent {
-        margin: 0 24px;
+        margin: 0;
     }
 }
diff --git a/src/components/Socials.module.css b/src/components/Socials.module.css
index 9b6819b..11fea1a 100644
--- a/src/components/Socials.module.css
+++ b/src/components/Socials.module.css
@@ -55,8 +55,8 @@
     flex-direction: row;
     align-items: left;
     gap: 12px;
-    width: calc(100% - 16px);
-    margin: 0 0px;
+    width: 100%;
+    margin: 0;
 }
 .numberParent {
     width: 100%;
@@ -65,10 +65,9 @@
     flex-direction: column;
     align-items: flex-start;
     justify-content: flex-start;
-    padding: 0 8px;
+    padding: 0;
     box-sizing: border-box;
     gap: 10px;
-    max-width: 600px;
     text-align: left;
     font-size: 18px;
     color: #242424;
@@ -89,13 +88,12 @@
     font-weight: 600;
     color: #242424;
     padding: 24px 0px 10px;
-    margin: 0 0px;
-    
+    margin: 0;
 }
 
 @media (max-width: 768px) {
     .numberParent {
-        padding: 0 8px;  /* Match metricsBar margin */
+        padding: 0;  /* Match metricsBar margin */
     }
     
     .title {