Spaces:
Running
Running
File size: 11,456 Bytes
c6ccee3 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DPIcon - Sponsorship & Support</title>
<link rel="stylesheet" href="css/style.css">
<!-- Firebase SDK -->
<script src="https://www.gstatic.com/firebasejs/9.22.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.0/firebase-auth-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore-compat.js"></script>
</head>
<body>
<div class="container">
<!-- Sidebar -->
<nav class="sidebar">
<button class="close-menu md:hidden text-white text-2xl m-0 p-2 border-none bg-transparent cursor-pointer">
✕
</button>
<div class="sidebar-header">
<svg width="25" height="30" viewBox="0 0 25 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1_917)">
<!-- SVG Path Placeholder -->
</g>
<defs>
<clipPath id="clip0_1_917">
<rect width="25" height="29.59" fill="white" transform="translate(0 0.389893)"/>
</clipPath>
</defs>
</svg>
<span>dpicon</span>
</div>
<div class="nav-items">
<a href="index.html" class="nav-item">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Home</span>
<div class="indicator">
<div></div>
</div>
</a>
<a href="face-fusion.html" class="nav-item">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Face Fusion</span>
</a>
<a href="text-to-image.html" class="nav-item">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Text to Image</span>
</a>
<a href="community.html" class="nav-item">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Community</span>
</a>
<a href="sponsor.html" class="nav-item active">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Sponsor</span>
</a>
<a href="founder.html" class="nav-item">
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- SVG Path Placeholder -->
</svg>
<span>Founder</span>
</a>
</div>
<div class="footer">
<div class="powered-by">Powered by</div>
<img src="public/images/powered-by-logo.jpg" alt="Powered by logo">
<div class="copyright">
<span>© Copyright</span>
<span class="year">2025</span>
<span>by DPIcon</span>
</div>
</div>
</nav>
<!-- Main Content -->
<main class="main-content">
<!-- Top Bar -->
<header class="top-bar">
<button class="top-bar__hamburger md:hidden">
☰
</button>
<div class="top-bar__content">
<span class="top-bar__credits" id="credits-display">50</span>
<button class="top-bar__upgrade" id="upgrade-button">Upgrade</button>
<span class="top-bar__welcome" id="welcome-message">Welcome Guest</span>
<div class="top-bar__avatar"></div>
</div>
</header>
<!-- Connect with Google Button -->
<div class="box-border flex justify-center items-center mb-12 m-0 p-0 w-full">
<button id="google-signin-button" class="inline-block px-6 py-3 bg-[#7550DC] text-white rounded-lg hover:bg-[#6440cc] transition-transform transform hover:scale-105 font-medium text-lg flex items-center">
<svg class="mr-2" width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 0C5.373 0 0 5.373 0 12C0 18.627 5.373 24 12 24C18.627 24 24 18.627 24 12C24 5.373 18.627 0 12 0ZM12 2C17.514 2 22 6.486 22 12C22 17.514 17.514 22 12 22C6.486 22 2 17.514 2 12C2 6.486 6.486 2 12 2ZM12 4C8.962 4 6.5 6.462 6.5 9.5C6.5 12.538 8.962 15 12 15C15.038 15 17.5 12.538 17.5 9.5C17.5 6.462 15.038 4 12 4ZM12 6C13.933 6 15.5 7.567 15.5 9.5C15.5 11.433 13.933 13 12 13C10.067 13 8.5 11.433 8.5 9.5C8.5 7.567 10.067 6 12 6ZM18.5 7.5C18.5 8.328 17.828 9 17 9C16.172 9 15.5 8.328 15.5 7.5C15.5 6.672 16.172 6 17 6C17.828 6 18.5 6.672 18.5 7.5Z" fill="white"/>
</svg>
Connect with Google
<span id="google-signin-spinner" class="ml-2 hidden">⏳</span>
</button>
</div>
<!-- Sponsorship & Support Content -->
<section class="box-border m-0 py-0">
<div class="box-border flex justify-center items-center mb-12 m-0 p-0 w-full">
<h1 class="box-border text-[32px] mb-6 m-0 p-0">Sponsorship & Support</h1>
</div>
<div class="box-border mb-12 m-0 px-12 max-sm:px-5">
<h2 class="box-border text-[24px] mb-4 m-0 p-0">Fuel DPIcon’s AI Galaxy</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
We’re DPIcon, a constellation of AI dreamers, and we’re building a universe where creativity knows no bounds. But every star needs a spark—your sponsorship keeps our engines humming, our tools evolving, and our community thriving. Toss a comet our way, and snag exclusive goodies while you’re at it!
</div>
</div>
<div class="box-border mb-12 m-0 px-12 max-sm:px-5">
<h2 class="box-border text-[24px] mb-4 m-0 p-0">Invest in the Future of AI Creativity</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
At DPIcon, we’re pioneering the next generation of artificial intelligence tools, empowering individuals and businesses to transform ideas into stunning visual realities. Your support plays a vital role in advancing our mission—enhancing our platform, expanding accessibility, and fostering a thriving creative community. Whether you’re an individual, a corporation, or an organization, partnering with us offers a unique opportunity to contribute to cutting-edge AI innovation.
</div>
</div>
<div class="box-border mb-12 m-0 px-12 max-sm:px-5">
<h2 class="box-border text-[24px] mb-4 m-0 p-0">How Your Support Makes a Difference</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
We welcome contributions of all sizes—each one fuels our ability to innovate and grow. Rather than offering predefined plans, we tailor our sponsorship opportunities to suit your goals. Whether you’re looking to support as an individual advocate or establish a corporate partnership, your involvement directly enhances our platform’s capabilities and reach. This is an investment in creativity, technology, and the future.
</div>
</div>
<div class="box-border mb-12 m-0 px-12 max-sm:px-5">
<h2 class="box-border text-[24px] mb-4 m-0 p-0">How to Get Involved</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
Contact Us: Reach out to our team at support@dpicon.com to discuss your interest in supporting DPIcon. Explore Opportunities: We’ll work with you to identify a collaboration that aligns with your vision. Make an Impact: Your support will be implemented to drive meaningful advancements in our platform.
</div>
</div>
<div class="box-border mb-12 m-0 px-12 max-sm:px-5">
<h2 class="box-border text-[24px] mb-4 m-0 p-0">Questions or Assistance?</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
Our dedicated support team is available to assist you at any time. For inquiries about sponsorship, technical support, general feedback, please email us at support@dpicon.com. We value your input and are committed to building partnerships that benefits both our community and your objectives.
</div>
</div>
<div class="box-border flex justify-center items-center mb-12 m-0 p-0 w-full">
<div class="text-center">
<h2 class="box-border text-[12px] mb-4 m-0 p-0" style="font-size: 12px !important;">Thank You for Supporting Our Vision ❤️</h2>
<div class="box-border text-base leading-[1.4] m-0 p-0">
<a href="mailto:support@dpicon.com" class="inline-block px-6 py-3 bg-[#7550DC] text-white rounded-lg hover:bg-[#6440cc] transition-colors font-medium text-lg">
Contact Us
</a>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="box-border text-center m-0 px-12 py-6 max-sm:px-5 max-sm:py-6">
</footer>
</main>
</div>
<!-- Upgrade Popup -->
<div id="upgrade-popup" class="fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center hidden">
<div class="bg-gradient-to-br from-[#1a1a1a] to-[#2a2a2a] rounded-lg p-8 max-w-4xl w-full mx-4 popup-content">
<div class="flex justify-between items-center mb-6">
<h2 class="text-[32px] text-white">Choose Your Plan</h2>
<button id="close-popup" class="text-white text-2xl">×</button>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<!-- Basic Free Plan -->
<div class="plan-card p-6 rounded-lg text-center">
<h3 class="text-[24px] text-white mb-4">Basic Free</h3>
<p class="text-white text-lg mb-4">50 Credits / Month</p>
<p class="text-white text-2xl font-bold mb-4">$0</p>
<button id="select-basic" class="inline-block px-6 py-3 bg-[#7550DC] text-white rounded-lg hover:bg-[#6440cc] font-medium text-lg">Select Plan</button>
</div>
<!-- Pro Plan -->
<div class="plan-card p-6 rounded-lg text-center">
<h3 class="text-[24px] text-white mb-4">Pro</h3>
<p class="text-white text-lg mb-4">Unlimited for 1 Month</p>
<p class="text-white text-2xl font-bold mb-4">$80</p>
<button id="select-pro" class="inline-block px-6 py-3 bg-[#7550DC] text-white rounded-lg hover:bg-[#6440cc] font-medium text-lg">Select Plan</button>
</div>
<!-- Premium Plan -->
<div class="plan-card p-6 rounded-lg text-center">
<h3 class="text-[24px] text-white mb-4">Premium</h3>
<p class="text-white text-lg mb-4">Unlimited for 1 Year</p>
<p class="text-white text-2xl font-bold mb-4">$900</p>
<button id="select-premium" class="inline-block px-6 py-3 bg-[#7550DC] text-white rounded-lg hover:bg-[#6440cc] font-medium text-lg">Select Plan</button>
</div>
</div>
</div>
</div>
<script src="js/firebase.js"></script>
<script src="js/script.js"></script>
</body>
</html> |