Modern

src/components/sections/CommunitySection.tsx

@@ -78,6 +78,7 @@ const exchangesData: ColumnData = {
   items: [
     { label: 'nonKYC CCX/BTC', url: 'https://nonkyc.io/market/CCX_BTC' },
     { label: 'nonKYC CCX/USDT', url: 'https://nonkyc.io/market/CCX_USDT' },
+    { label: 'nonlogs CCX/USDT', url: 'https://nonlogs.io/trade/CCX-USDT' },
   ],
 };
 
@@ -127,6 +128,14 @@ const bscData: ColumnData = {
       label: 'PancakeSwap - wCCX/USDT',
       url: 'https://pancakeswap.finance/swap?inputCurrency=0x55d398326f99059fF775485246999027B3197955&outputCurrency=0x988c11625472340b7b36ff1534893780e0d8d841',
     },
+    {
+      label: 'MEXC DEX - wCCX/BNB',
+      url: 'https://www.mexc.com/dex/trade?pair_ca=0x523d5d8ae2f38dd2d8900eb195c132ff19bf6d18&chain_id=56&token_ca=0x988c11625472340b7b36ff1534893780e0d8d841',
+    },
+    {
+      label: 'KyberSwap - wCCX/BNB',
+      url: 'https://kyberswap.com/swap/bnb/-to-0x988c11625472340b7b36ff1534893780e0d8d841',
+    },
   ],
 };
 

src/components/sections/CryptoWidgetSection.tsx

@@ -1,27 +1,35 @@
 import { useEffect, useState } from 'react';
 import { appConfig } from '@/config/app.config';
 
-interface CoinGeckoPrice {
+interface PriceData {
   usd: number;
   usd_24h_change: number;
+  source: 'coingecko' | 'coinpaprika';
 }
 
 export function CryptoWidgetSection() {
-  const [price, setPrice] = useState<CoinGeckoPrice | null>(null);
+  const [price, setPrice] = useState<PriceData | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(false);
 
   useEffect(() => {
-    // Fetch price from CoinGecko API
+    // Fetch price from CoinGecko API (primary) or CoinPaprika (fallback)
     const fetchPrice = async () => {
       try {
-        // Try common Conceal Network coin IDs
-        const coinIds = ['conceal-network', 'conceal', 'ccx'];
+        // Try CoinGecko first
+        const coinIds = ['conceal', 'conceal-network'];
+        let coingeckoSuccess = false;
 
         for (const coinId of coinIds) {
           try {
             const response = await fetch(
-              `https://api.coingecko.com/api/v3/simple/price?ids=${coinId}&vs_currencies=usd&include_24hr_change=true`
+              `https://api.coingecko.com/api/v3/simple/price?ids=${coinId}&vs_currencies=usd&include_24hr_change=true`,
+              {
+                mode: 'cors',
+                headers: {
+                  Accept: 'application/json',
+                },
+              }
             );
 
             if (response.ok) {
@@ -30,26 +38,58 @@ export function CryptoWidgetSection() {
                 setPrice({
                   usd: data[coinId].usd,
                   usd_24h_change: data[coinId].usd_24h_change || 0,
+                  source: 'coingecko',
                 });
                 setLoading(false);
                 setError(false);
+                coingeckoSuccess = true;
                 return;
               }
             } else if (response.status === 429) {
-              // Rate limited - wait longer before retry
-              console.warn('CoinGecko API rate limited');
-              setError(true);
-              setLoading(false);
-              return;
+              // Rate limited - will try fallback
+              console.warn('CoinGecko API rate limited, trying fallback...');
+              break;
             }
           } catch (err) {
-            console.error(`Error fetching price for ${coinId}:`, err);
+            // CORS or network error - will try fallback
+            console.warn(`CoinGecko failed for ${coinId}, trying fallback...`);
           }
         }
 
-        // If none worked, set error
-        setError(true);
-        setLoading(false);
+        // If CoinGecko failed, try CoinPaprika as fallback
+        if (!coingeckoSuccess) {
+          try {
+            // CoinPaprika API - ticker ID is ccx-conceal
+            const response = await fetch('https://api.coinpaprika.com/v1/tickers/ccx-conceal', {
+              mode: 'cors',
+              headers: {
+                Accept: 'application/json',
+              },
+            });
+
+            if (response.ok) {
+              const data = await response.json();
+              if (data.quotes?.USD) {
+                setPrice({
+                  usd: data.quotes.USD.price,
+                  usd_24h_change: data.quotes.USD.percent_change_24h || 0,
+                  source: 'coinpaprika',
+                });
+                setLoading(false);
+                setError(false);
+                return;
+              }
+            }
+          } catch (err) {
+            console.error('CoinPaprika API failed:', err);
+          }
+        }
+
+        // If both APIs failed, set error
+        if (!coingeckoSuccess) {
+          setError(true);
+          setLoading(false);
+        }
       } catch (err) {
         console.error('Error in fetchPrice:', err);
         setError(true);
@@ -132,14 +172,26 @@ export function CryptoWidgetSection() {
           </div>
           <div className="mt-4 text-[1.2rem] text-[#999] flex items-center justify-center gap-2">
             <span data-tkey="dataProvidedBy">Data provided by</span>
-            <a
-              href="https://www.coingecko.com/en/coins/conceal-network"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="inline-flex items-center hover:opacity-80 transition-opacity bg-[#444] rounded px-2 py-1"
-            >
-              <img src="/external/logo/coingecko-logo.svg" alt="CoinGecko" className="h-6" />
-            </a>
+            {price.source === 'coingecko' ? (
+              <a
+                href="https://www.coingecko.com/en/coins/conceal"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center hover:opacity-80 transition-opacity bg-[#444] rounded px-2 py-1"
+              >
+                <img src="/external/logo/coingecko-logo.svg" alt="CoinGecko" className="h-6" />
+              </a>
+            ) : (
+              <a
+                href="https://coinpaprika.com/coin/ccx-conceal/"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center hover:opacity-80 transition-opacity bg-[#444] rounded px-2 py-1"
+              >
+                <img src="/external/logo/coinpaprika.ico" alt="CoinPaprika" className="h-6" />{' '}
+                <span className="text-white font-semibold">CoinPaprika</span>
+              </a>
+            )}
           </div>
         </div>
       </div>

src/components/sections/HeroSection.tsx

@@ -56,16 +56,16 @@ export function HeroSection({ onMount }: HeroSectionProps) {
           {/* Call-to-action buttons */}
           <div className="flex flex-wrap justify-center gap-8 md:gap-18 mb-12">
             <Button variant="primary" asChild href="/#wallets" size="default">
-              <a href="/#wallets">
+              <>
                 <i className="fas fa-wallet text-3xl mr-2"></i>
                 <span className="text-1.1xl md:text-1.2xl">Get Started</span>
-              </a>
+              </>
             </Button>
             <Button variant="primary" targetId="features" asChild href="/#features" size="default">
-              <a href="/#features">
+              <>
                 <i className="fas fa-info-circle text-3xl mr-2"></i>
                 <span className="text-1.1xl md:text-1.2xl">Learn More</span>
-              </a>
+              </>
             </Button>
           </div>
         </div>

src/components/sections/MarketsSection.tsx

@@ -1,6 +1,13 @@
 import { Button } from '@/components/ui/Button';
 import { SectionHeading } from '@/components/ui/SectionHeading';
 
+const exchanges = [
+  { label: 'nonKYC BTC/CCX', href: 'https://nonkyc.io/market/CCX_BTC' },
+  { label: 'nonKYC USDT/CCX', href: 'https://nonkyc.io/market/CCX_USDT' },
+  { label: 'Nonlogs USDT/CCX', href: 'https://nonlogs.io/trade/CCX-USDT' },
+  //  { label: 'AnonEx USDT/CCX', href: 'https://anonex.io/market/CCX_USDT' },
+];
+
 export function MarketsSection() {
   return (
     <>
@@ -15,33 +22,18 @@ export function MarketsSection() {
         <div className="max-w-6xl mx-auto text-center">
           <SectionHeading subtitle={<span data-tkey="rBuyCCX">Buy CCX</span>} title="Markets" />
           <div className="flex flex-wrap justify-center gap-4">
-            <Button
-              variant="download"
-              asChild
-              href="https://nonkyc.io/market/CCX_BTC"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              nonKYC BTC/CCX
-            </Button>
-            <Button
-              variant="download"
-              asChild
-              href="https://nonkyc.io/market/CCX_USDT"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              nonKYC USDT/CCX
-            </Button>
-            <Button
-              variant="download"
-              asChild
-              href="https://nonlogs.io/trade/CCX-BTC"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              Nonlogs BTC/CCX
-            </Button>
+            {exchanges.map((exchange) => (
+              <Button
+                key={exchange.href}
+                variant="download"
+                asChild
+                href={exchange.href}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                {exchange.label}
+              </Button>
+            ))}
           </div>
         </div>
       </section>
@@ -108,6 +100,24 @@ export function MarketsSection() {
                 Bakeryswap
               </a>
             </Button>
+            <Button variant="download" asChild>
+              <a
+                href="https://www.mexc.com/dex/trade?pair_ca=0x523d5d8ae2f38dd2d8900eb195c132ff19bf6d18&chain_id=56&token_ca=0x988c11625472340b7b36ff1534893780e0d8d841"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                MEXC DEX
+              </a>
+            </Button>
+            <Button variant="download" asChild>
+              <a
+                href="https://kyberswap.com/swap/bnb/-to-0x988c11625472340b7b36ff1534893780e0d8d841"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                KyberSwap
+              </a>
+            </Button>
           </div>
           <a
             href="https://conceal.network/community/#exchanges"

src/components/sections/RoadmapSection.tsx

@@ -209,14 +209,16 @@ const timelineItems: TimelineItem[] = [
   {
     date: 'Q4 2025',
     title: 'Conceal Labs',
-    description: 'Conceal Authenticator app is launched, your 2FA keys are now stored on the blockchain',
+    description:
+      'Conceal Authenticator app is launched, your 2FA keys are now stored on the blockchain',
     status: 'completed',
     url: 'https://f-droid.org/en/packages/com.acktarius.concealauthenticator/',
   },
   {
     date: 'Q1 2026',
     title: 'Conceal Labs',
-    description: 'Conceal-Faucet-API is launched, "one stop shop" for developpers to create faucet or game rewards',
+    description:
+      'Conceal-Faucet-API is launched, "one stop shop" for developpers to create faucet or game rewards',
     status: 'completed',
     url: 'https://github.com/ConcealNetwork/conceal-faucet-api',
   },
@@ -262,10 +264,10 @@ export function RoadmapSection() {
       if (!sectionRef.current) return;
 
       const sectionRect = sectionRef.current.getBoundingClientRect();
-      
+
       // Only apply effect if roadmap section is in viewport
       const isSectionVisible = sectionRect.bottom > 0 && sectionRect.top < window.innerHeight;
-      
+
       if (!isSectionVisible) {
         // Reset all scales if section is not visible
         const resetScales = new Map<number, number>();
@@ -289,8 +291,8 @@ export function RoadmapSection() {
 
         // Map distance to scale: 1.22 at center, 1.0 at maxDistance
         const normalizedDistance = Math.min(1, distanceFromCenter / maxDistance);
-        const scale = 1.0 + (0.22 * (1 - normalizedDistance)); // 1.6 at center, 1.0 at maxDistance
-        
+        const scale = 1.0 + 0.22 * (1 - normalizedDistance); // 1.6 at center, 1.0 at maxDistance
+
         newScales.set(index, scale);
       });
 
@@ -311,7 +313,11 @@ export function RoadmapSection() {
   }, []);
 
   return (
-    <section ref={sectionRef} id="roadmap" className="py-16 px-4 border-b border-[rgba(255,255,255,0.2)] relative">
+    <section
+      ref={sectionRef}
+      id="roadmap"
+      className="py-16 px-4 border-b border-[rgba(255,255,255,0.2)] relative"
+    >
       {/* Background image */}
       <div
         id="herobg"
@@ -432,7 +438,25 @@ export function RoadmapSection() {
                               {item.title}
                             </h6>
                           )}
-                          {item.description && <span> — {item.url ? <a href={item.url} target="_blank" rel="noopener noreferrer" className="text-inherit hover:text-[var(--color1)]" title={`Visit ${item.url}`}>{item.description}</a> : item.description}</span>}
+                          {item.description && (
+                            <span>
+                              {' '}
+                              —{' '}
+                              {item.url ? (
+                                <a
+                                  href={item.url}
+                                  target="_blank"
+                                  rel="noopener noreferrer"
+                                  className="text-inherit hover:text-[var(--color1)]"
+                                  title={`Visit ${item.url}`}
+                                >
+                                  {item.description}
+                                </a>
+                              ) : (
+                                item.description
+                              )}
+                            </span>
+                          )}
                         </span>
                       </div>
                     </div>