support-us-button 1.0.0

package/README.md

@@ -0,0 +1,608 @@
+<!-- Don't delete it -->
+<div name="readme-top"></div>
+
+<!-- Organization Logo -->
+<div align="center" style="display: flex; align-items: center; justify-content: center; gap: 16px;">
+  <img alt="AOSSIE" src="public/aossie-logo.svg" width="175">
+</div>
+
+&nbsp;
+
+<!-- Organization Name -->
+<div align="center">
+
+[![Static Badge](https://img.shields.io/badge/AOSSIE-SUPPORT_US_BUTTON-228B22?style=for-the-badge&labelColor=FFC517)](https://github.com/AOSSIE-Org/SupportUsButton)
+
+<!-- Correct deployed url to be added -->
+
+</div>
+
+<!-- Organization/Project Social Handles -->
+<p align="center">
+<!-- Telegram -->
+<a href="https://t.me/StabilityNexus">
+<img src="https://img.shields.io/badge/Telegram-black?style=flat&logo=telegram&logoColor=white&logoSize=auto&color=24A1DE" alt="Telegram Badge"/></a>
+&nbsp;&nbsp;
+<!-- X (formerly Twitter) -->
+<a href="https://x.com/aossie_org">
+<img src="https://img.shields.io/twitter/follow/aossie_org" alt="X (formerly Twitter) Badge"/></a>
+&nbsp;&nbsp;
+<!-- Discord -->
+<a href="https://discord.gg/hjUhu33uAn">
+<img src="https://img.shields.io/discord/1022871757289422898?style=flat&logo=discord&logoColor=white&logoSize=auto&label=Discord&labelColor=5865F2&color=57F287" alt="Discord Badge"/></a>
+&nbsp;&nbsp;
+<!-- Medium -->
+<a href="https://news.stability.nexus/">
+  <img src="https://img.shields.io/badge/Medium-black?style=flat&logo=medium&logoColor=black&logoSize=auto&color=white" alt="Medium Badge"></a>
+&nbsp;&nbsp;
+<!-- LinkedIn -->
+<a href="https://www.linkedin.com/company/aossie/">
+  <img src="https://img.shields.io/badge/LinkedIn-black?style=flat&logo=LinkedIn&logoColor=white&logoSize=auto&color=0A66C2" alt="LinkedIn Badge"></a>
+&nbsp;&nbsp;
+<!-- Youtube -->
+<a href="https://www.youtube.com/@AOSSIE-Org">
+  <img src="https://img.shields.io/youtube/channel/subscribers/UCKVVLbawY7Gej_3o2WKsoiA?style=flat&logo=youtube&logoColor=white%20&logoSize=auto&labelColor=FF0000&color=FF0000" alt="Youtube Badge"></a>
+</p>
+
+---
+
+<div align="center">
+<h1>SUPPORT US BUTTON</h1>
+</div>
+
+A lightweight React component library for displaying **Support us page** in a clean and customizable way. It provides pre-built UI components to showcase support us page with tier-based layouts, theme support, and Tailwind CSS styling, making it easy to integrate a professional support us page into any project or website.
+
+---
+
+# 🚀 Features
+
+- **🎨 Tier-based Layouts**: Display sponsors in different tiers with logos and links, styled according to the selected theme.
+
+- **🎨 Theme Support**: Choose from **light**, **dark**, **minimal**, **corporate**, or **AOSSIE** themes for consistent branding.
+
+- **🎨 Customizable Styling**: Tailwind CSS classes for easy customization of the support us page.
+
+- **🖥️ Responsive Design**: Built with responsive design principles for optimal viewing on all devices.
+
+- **🧩 Easy Integration**: Simple to integrate into any project or website with a single component.
+
+- **📦 ESM + CommonJS + UMD builds**: Supports various module systems for flexible integration.
+
+- **🧠 TypeScript support included**: Provides type definitions for seamless development.
+
+- **🎨 Styled with Tailwind (no global resets)**: Uses Tailwind CSS for styling with no global resets.
+
+- **🪶 Lightweight and optimized**: Lightweight and optimized for performance.
+
+---
+
+# 💻 Tech Stack
+
+**[React](https://react.dev/)** – For building reusable UI components
+
+**[TypeScript](https://www.typescriptlang.org/)** – For type safety and better developer experience
+
+**[Tailwind CSS](https://tailwindcss.com/)** – For modern, utility-first styling
+
+**[Rollup](https://rollupjs.org/)** – For bundling and optimizing the package for distribution
+
+**[Node.js](https://nodejs.org/) & [npm](https://www.npmjs.com/)** – For package management and publishing
+
+---
+
+# 🔗 Repository Links
+
+- [Main Repository](https://github.com/AOSSIE-Org/SupportUsButton)
+- [NPM Package](https://www.npmjs.com/package/support-us-button)
+- [CDN](https://cdn.jsdelivr.net/npm/support-us-button@latest/dist/index.umd.js)
+
+---
+
+# Installation
+
+You can install and use this package either through **npm** (recommended for Node.js projects) or directly via a **CDN**.
+
+## Using npm
+
+Install the package using npm:
+
+```bash
+# Install the package
+npm install support-us-button
+```
+
+## Using CDN
+
+You can also use the component directly in the browser via a CDN:
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/support-us-button@latest/dist/index.umd.js"></script>
+```
+
+Once included, the component will be available to use in your project.
+
+---
+
+# Usage
+
+## Using npm
+
+```tsx
+// Import the component in your project:
+import SupportUsButton from "support-us-button";
+
+// Import the styles in your project:
+import "support-us-button/style.css";
+
+// Import the types in your project:
+import type { supportUsButtonProps } from "support-us-button";
+
+// Use the component in your project:
+<SupportUsButton {...props} />; // props is an object of type supportUsButtonProps
+```
+
+## Using CDN
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/support-us-button@latest/dist/index.umd.js"></script>
+
+// Import the styles in your project:
+<link
+    rel="stylesheet"
+    href="https://cdn.jsdelivr.net/npm/support-us-button@latest/dist/style.css"
+/>
+
+// Use the component in your project:
+<SupportUsButton />
+```
+
+Once included, the component will be available to use in your project.
+
+---
+
+## Example Usage
+
+Below is an example configuration for the `SupportUsButton` component.  
+Replace the placeholder text (titles, descriptions, images, links, etc.) with your own project information.
+
+```tsx
+// Example props configuration for SupportUsButton
+// Modify the values according to your project needs
+
+const props: supportUsButtonProps = {
+    // Theme of the widget (e.g., AOSSIE, light, dark, minimal)
+    Theme: "AOSSIE",
+
+    // Background pattern type (e.g., grid, dots)
+    pattern: "grid",
+
+    hero: {
+        Image: {
+            // Replace with your hero image
+            src: "https://your-image-link.com/hero-image.png",
+            alt: "Hero section image",
+        },
+
+        // Main title shown at the top of the widget
+        title: "Your Title Here",
+
+        // Short description about your project or mission
+        description:
+            "Write a brief description about your project, organization, or the purpose of sponsorship here.",
+
+        // Label shown above the sponsors section
+        sponsorLabel: "Your Sponsors",
+    },
+
+    organizationInformation: {
+        // Name of your organization
+        name: "Your Organization Name",
+
+        // Short description about the organization
+        description:
+            "Describe your organization, its mission, and what it works on.",
+
+        // Optional organization logo
+        logo: {
+            src: "https://your-image-link.com/logo.png",
+            alt: "Organization Logo",
+        },
+
+        projectInformation: {
+            // Name of the project that is being sponsored
+            name: "Your Project Name",
+
+            // Short description of the project
+            description:
+                "Provide a short description of the project that sponsors are supporting.",
+        },
+    },
+
+    // List of sponsors
+    sponsors: [
+        {
+            name: "Sponsor Name",
+            logo: "https://your-image-link.com/sponsor-logo.png",
+            link: "https://sponsor-website.com",
+
+            // Optional tier: Bronze | Silver | Gold | Platinum
+            sponsorshipTier: "Bronze",
+        },
+        {
+            name: "Another Sponsor",
+            logo: "https://your-image-link.com/sponsor-logo.png",
+            link: "https://sponsor-website.com",
+            sponsorshipTier: "Silver",
+        },
+        {
+            name: "Company Name",
+            logo: "https://your-image-link.com/company-logo.png",
+            link: "https://company-website.com",
+            sponsorshipTier: "Gold",
+        },
+    ],
+
+    ctaSection: {
+        // Call-to-action title
+        title: "Support This Project",
+
+        // Description encouraging users to sponsor the project
+        description:
+            "Explain why supporting your project matters and how people can help.",
+
+        sponsorLink: [
+            {
+                // Platform name
+                name: "Patreon",
+
+                // Sponsorship link
+                url: "https://www.patreon.com/yourproject",
+
+                // Optional icon for the platform
+                icon: (
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        width="24"
+                        height="24"
+                    >
+                        <path d="M0 0h24v24H0z" fill="none" />
+                        <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
+                    </svg>
+                ),
+
+                // Optional custom class for styling
+                className: "patreon-link",
+
+                // Open link in a new tab
+                newTab: true,
+            },
+            {
+                name: "GitHub Sponsors",
+                url: "https://github.com/sponsors/yourproject",
+                icon: (
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        width="24"
+                        height="24"
+                    >
+                        <path d="M0 0h24v24H0z" fill="none" />
+                        <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
+                    </svg>
+                ),
+                className: "github-sponsors-link",
+                newTab: true,
+            },
+        ],
+    },
+
+    // Button styling variant
+    buttonVariant: "AOSSIE",
+};
+
+// Component usage
+<SupportUsButton {...props} />;
+```
+
+---
+
+<h1>Props API</h1>
+
+<details>
+<summary> <strong> Show details </strong> </summary>
+
+## Available API
+
+| Prop                      | Type             | Required | Description                                                                                                    |
+| ------------------------- | ---------------- | -------- | -------------------------------------------------------------------------------------------------------------- |
+| `Theme`                   | string           | No       | Theme for the button, can be one of "AOSSIE", "light", "dark", "minimal", or "corporate"                       |
+| `pattern`                 | string           | No       | Optional background pattern for the button, can be one of "dots", "grid", "AOSSIE", or "none"                 |
+| `hero`                    | object           | Yes      | Information about the Hero section, including title, description, sponsor label, and optional background Image |
+| `organizationInformation` | object           | Yes      | Information about the organization, including name, description, logo, and project information                 |
+| `sponsors`                | array of objects | No       | List of current sponsors, each with name, optional logo, link, and sponsorship tier                            |
+| `ctaSection`              | object           | Yes      | Information about the call-to-action section, including title, description, and sponsor links                  |
+| `classNames`              | object           | No       | Optional additional CSS class for custom styling                                                               |
+| `buttonVariant`           | string           | No       | Optional button variant for styling the call-to-action buttons                                                 |
+
+</details>
+
+---
+
+# Prop Options Reference
+
+<details>
+<summary><strong>Show details</strong></summary>
+All available options for configurable props in the component.
+
+## Theme
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Controls the overall visual appearance of the widget.
+
+| Value       | Description                              |
+| ----------- | ---------------------------------------- |
+| `AOSSIE`    | Default theme styled for AOSSIE branding |
+| `corporate` | Corporate styled layout                  |
+| `dark`      | Dark mode UI                             |
+| `light`     | Light mode UI                            |
+| `minimal`   | Minimal clean design                     |
+
+</details>
+
+## Pattern
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Adds a decorative background pattern to the hero section.
+
+| Value    | Description               |
+| -------- | ------------------------- |
+| `AOSSIE` | Square and Circle pattern |
+| `dots`   | Dot pattern background    |
+| `grid`   | Subtle grid pattern       |
+| `none`   | None                      |
+
+</details>
+
+## hero
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Controls the top section of the widget.
+
+| Value          | Type    | Required | Description                 |
+| -------------- | ------- | -------- | --------------------------- |
+| `Image`        | `Image` | No       | Background or hero image    |
+| `title`        | string  | Yes      | Main heading                |
+| `description`  | string  | Yes      | Hero description            |
+| `sponsorLabel` | string  | No       | Label above sponsor section |
+
+</details>
+
+## Image
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Used in hero images and organization logos.
+
+| Value | Type   | Required | Description      |
+| ----- | ------ | -------- | ---------------- |
+| `src` | string | No       | Imag URl         |
+| `alt` | string | No       | Alternative text |
+
+</details>
+
+## buttonVariant
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Controls the styling of the call-to-action buttons.
+
+| Value       | Description                |
+| ----------- | -------------------------- |
+| `AOSSIE`    | Default styled button      |
+| `primary`   | Primary action button      |
+| `secondary` | Secondary button style     |
+| `ghost`     | Transparent minimal button |
+| `gradient`  | Gradient styled button     |
+
+</details>
+
+## organizationInformation
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Information about the organization and project.
+
+| Value                | Type                 | Required | Description              |
+| -------------------- | -------------------- | -------- | ------------------------ |
+| `name`               | string               | Yes      | Organization name        |
+| `description`        | string               | Yes      | Organization description |
+| `logo`               | `Image` / string     | No       | Organization logo        |
+| `projectInformation` | `projectInformation` | Yes      | Project details          |
+
+</details>
+
+## projectInformation
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Details about the project being sponsored.
+
+| Value         | Type   | Required | Description         |
+| ------------- | ------ | -------- | ------------------- |
+| `name`        | string | Yes      | Project name        |
+| `description` | string | Yes      | Project description |
+
+</details>
+
+## sponsors
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+List of sponsors displayed in the widget.
+
+| Value             | Type   | Required | Description     |
+| ----------------- | ------ | -------- | --------------- |
+| `name`            | string | Yes      | Sponsor name    |
+| `logo`            | string | No       | Sponsor logo    |
+| `link`            | string | No       | Sponsor website |
+| `sponsorshipTier` | `Tier` | No       | Sponsor tier    |
+
+</details>
+
+## Tier
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Used inside the sponsors array to visually differentiate sponsors.
+
+| Value      | Description          |
+| ---------- | -------------------- |
+| `Platinum` | Highest tier sponsor |
+| `Gold`     | High level sponsor   |
+| `Silver`   | Mid level sponsor    |
+| `Bronze`   | Entry level sponsor  |
+
+</details>
+
+## ctaSection
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Call-to-action section encouraging sponsorship.
+
+| Value         | Type            | Required | Description                   |
+| ------------- | --------------- | -------- | ----------------------------- |
+| `title`       | string          | Yes      | CTA title                     |
+| `description` | string          | Yes      | CTA description               |
+| `sponsorLink` | `sponsorLink[]` | Yes      | List of sponsorship platforms |
+
+</details>
+
+## sponsorLink
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Platform links for sponsorship (Patreon, GitHub Sponsors, etc).
+
+| Value       | Type      | Required | Description           |
+| ----------- | --------- | -------- | --------------------- |
+| `name`      | string    | Yes      | Platform name         |
+| `url`       | string    | Yes      | Sponsorship URL       |
+| `icon`      | ReactNode | No       | Icon for the platform |
+| `className` | string    | No       | Custom CSS class      |
+| `newTab`    | boolean   | No       | Open link in new tab  |
+
+</details>
+
+## classNames
+
+<details>
+<summary><strong>Show details</strong></summary>
+
+Allows custom styling of different widget sections.
+
+| Value                     | Description                  |
+| ------------------------- | ---------------------------- |
+| `container`               | Root container styling       |
+| `Hero`                    | Hero section styling         |
+| `organizationInformation` | Organization section styling |
+| `sponsors`                | Sponsors section styling     |
+| `ctaSection`              | CTA section styling          |
+
+</details>
+
+</details>
+
+---
+
+# 📱 App Screenshots
+
+## AOSSIE-Theme
+
+<details>
+<summary><b>Show details</b></summary>
+
+AOSSIE-Theme mobile screen preview.
+
+<div style="width:fit-content; margin:auto; display:flex; flex-wrap:wrap; gap:12px; justify-content:center;">
+  <img src="./public/AOSSIE_THEME.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/AOSSIE_THEME-SPONSOR.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/AOSSIE_THEME_CTA.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+</div>
+
+</details>
+
+## Light-Theme
+
+<details>
+<summary><b>Show details</b></summary>
+
+Light-Theme mobile screen preview.
+
+<div style="width:fit-content; margin:auto; display:flex; flex-wrap:wrap; gap:12px; justify-content:center;">
+  <img src="./public/LIGHT_THEME.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/LIGHT_THEME_SPONSOR.png" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/LIGHT_THEME_CTA.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+</div>
+
+</details>
+
+## Dark-Theme
+
+<details>
+<summary><b>Show details</b></summary>
+
+Dark-Theme mobile screen preview.
+
+<div style="width:fit-content; margin:auto; display:flex; flex-wrap:wrap; gap:12px; justify-content:center;">
+  <img src="./public/DARK_THEME.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/DARK_THEME_SPONSOR.png" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+  <img src="./public/DARK_THEME_CTA.jpeg" alt="AOSSIE-theme" style="width:fit-content; max-width:100%; height:auto;" />
+</div>
+
+</details>
+
+---
+
+## 🙌 Contributing
+
+⭐ Don't forget to star this repository if you find it useful! ⭐
+
+Thank you for considering contributing to this project! Contributions are highly appreciated and welcomed. To ensure smooth collaboration, please refer to our [Contribution Guidelines](./CONTRIBUTING.md).
+
+---
+
+## ✨ Maintainers
+
+- [Rahul vyas](https://github.com/rahul-vyas-dev/)
+- [Zahnentferner](https://github.com/Zahnentferner)
+
+---
+
+## 📍 License
+
+This project is licensed under the GNU General Public License v3.0.
+See the [LICENSE](LICENSE) file for details.
+
+---
+
+## 💪 Thanks To All Contributors
+
+Thanks a lot for spending your time helping **SupportUsButton** grow. Keep rocking 🥂
+
+[![Contributors](https://contrib.rocks/image?repo=AOSSIE-Org/SupportUsButton)](https://github.com/AOSSIE-Org/SupportUsButton/graphs/contributors)
+
+© 2026 AOSSIE

package/dist/components/SupportUsButton.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { supportUsButtonProps } from "../types/index";
+declare function SupportUsButton({ Theme, pattern, hero, organizationInformation, sponsors, ctaSection, classNames, buttonVariant, }: supportUsButtonProps): React.JSX.Element;
+export default SupportUsButton;

package/dist/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime");function t(e){switch(e){case"AOSSIE":return"bg-primary text-black";case"light":return"bg-gray-100 text-gray-800";case"dark":return"bg-black text-white";case"minimal":return"bg-transparent text-gray-800 border border-gray-800";case"corporate":return"bg-blue-600 text-white";default:return"bg-gray-200 text-gray-800"}}function r(e){const t="w-full px-5 py-3 font-medium transition-all duration-300 flex items-center justify-center gap-2",r=e??"AOSSIE";return"primary"===r?`${t} bg-white text-black hover:bg-white/90`:"secondary"===r?`${t} border border-white/30 text-white hover:bg-white/20`:"ghost"===r?`${t} text-white/80 hover:text-white hover:bg-white/10 outline-2 outline-white/10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-white/20`:"gradient"===r?`${t} bg-gradient-to-r from-indigo-500 to-purple-600 text-white`:`${t} bg-primary hover:bg-primary/90 text-black font-black py-4 transition-all active:scale-[0.98] shadow-lg shadow-primary/20`}module.exports=function({Theme:s="AOSSIE",pattern:i="AOSSIE",hero:l={title:"Support Our Open Source Project",description:"Your support helps us continue to develop and maintain our project.",sponsorLabel:"You're Sponsoring"},organizationInformation:n,sponsors:a,ctaSection:o,classNames:c={container:"",Hero:"",organizationInformation:"",sponsors:"",ctaSection:""},buttonVariant:d="AOSSIE"}){return e.jsxs("div",{className:`w-full font-sans justify-center items-center text-center ${"light"==s||"dark"==s?t(s):"bg-black text-white"} ${c.container}`,children:[e.jsxs("div",{className:"relative w-full h-[50vh] flex justify-center",children:[l.Image&&e.jsx("img",{src:l.Image.src,alt:l.Image.alt,title:l.Image.alt,className:"w-full h-full object-cover object-center pointer-none:cursor-none select-none"}),e.jsx("div",{className:"absolute inset-0 bg-linear-to-b from-transparent via-black/10 to-black/95"})]}),e.jsx("div",{className:"w-full flex justify-center mt-10 mb-5",children:e.jsxs("div",{className:`${c.Hero} w-[80%] flex text-center p-8 flex-col items-center gap-4`,children:[e.jsx("div",{className:"p-2 rounded-full flex items-center justify-center bg-primary text-black",children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"35",height:"35",viewBox:"0 0 24 24",fill:"black",stroke:"black",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"lucide lucide-heart-icon lucide-heart",children:[e.jsx("title",{children:"Support heart icon"}),e.jsx("path",{d:"M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"})]})}),e.jsxs("div",{className:"w-full flex flex-col items-center gap-6",children:[e.jsx("h1",{className:"font-extrabold text-4xl md:text-5xl lg:text-6xl",children:l.title}),e.jsx("p",{className:`wrap-anywhere ${"light"===s?"text-slate-600":"text-slate-400"} text-lg font-semibold`,children:l.description})]})]})}),e.jsx("div",{className:"w-full flex justify-center p-10 mb-50",children:e.jsxs("div",{className:`${c.organizationInformation}\n          relative w-[90%] p-15 rounded-2xl overflow-visible\n\n          // Shadows for different themes\n          ${"AOSSIE"===s&&"shadow-xl shadow-primary/20"}\n          ${"light"===s&&"shadow-xl shadow-gray-300/30"}\n          ${"dark"===s&&"shadow-xl shadow-gray-700/30"}\n          ${"minimal"===s&&"shadow-xl shadow-gray-800/30"}\n          ${"corporate"===s&&"shadow-xl shadow-blue-600/30"}\n          \n          // Outline for light and dark themes\n          ${"light"===s&&"outline-1 outline-gray-300"}\n          ${"dark"===s&&"outline-1 outline-gray-700"}\n          ${t(s)}`,children:[e.jsx("div",{className:"absolute inset-0 bg-[radial-gradient(rgba(0,0,0,0.15)_1.5px,transparent_0)] bg-size-[20px_20px] pointer-events-none opacity-100"}),e.jsx("div",{className:`absolute top-0 left-0 bottom-0 w-1/2 h-full  rounded-2xl p-6 overflow-visible ${t(s)}`}),e.jsxs("div",{className:"relative z-10 flex justify-start flex-col text-start gap-4",children:[l.sponsorLabel&&e.jsx("span",{className:"text-[10px] font-extrabold tracking-[0.2em] uppercase block",children:l.sponsorLabel}),e.jsx("div",{children:"string"==typeof n.logo?e.jsx("span",{className:"block h-fit w-fit p-4 bg-black text-white rounded-2xl",title:n.logo,children:e.jsx("b",{className:"text-2xl italic",children:n.logo})}):e.jsx("img",{className:"w-24 h-24 bg-white/80 pointer-none:cursor-none select-none rounded-2xl object-cover object-center",src:n.logo?.src,alt:n.logo?.alt,title:n.logo?.alt,draggable:!1})}),e.jsxs("div",{className:"flex flex-col gap-4",children:[e.jsx("h2",{className:"font-extrabold text-4xl md:text-5xl lg:text-6xl",children:n.name}),e.jsx("p",{className:"font-[650]",children:n.description})]}),e.jsx("div",{className:`\n            border\n            ${"AOSSIE"===s&&"border-[#f1c514]/50"}\n            ${"light"===s&&"border-gray-300/50"}\n            ${"dark"===s&&"border-gray-700/50"}\n            ${"minimal"===s&&"border-gray-800/50"}\n            ${"corporate"===s&&"border-blue-600/50"}`}),e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("h3",{className:`font-bold w-fit uppercase text-sm p-2 rounded-lg\n                  ${"AOSSIE"===s&&"bg-[#edc214]"}\n                  ${"light"===s&&"bg-gray-300/50"}\n                  ${"dark"===s&&"bg-gray-700/50"}\n                  ${"minimal"===s&&"bg-gray-800/50"}\n                  ${"corporate"===s&&"bg-blue-600/50"}`,children:["ABOUT PROJECT: ",n.projectInformation.name]}),e.jsxs("p",{className:`italic font-semibold \n                ${"AOSSIE"===s&&"text-[#614f08]"}\n                ${"light"===s&&"text-gray-600"}\n                ${"dark"===s&&"text-gray-400"}\n                ${"minimal"===s&&"text-gray-800"}\n                ${"corporate"===s&&"text-blue-600/80"}\n                `,children:['"',n.projectInformation.description,'"']})]})]})]})}),e.jsx("div",{className:`w-full flex justify-center mt-10 p-10\n          ${"AOSSIE"===s&&"bg-[#1f1f1f]"} \n          ${"light"===s&&"bg-gray-300/50"} \n          ${"dark"===s&&"bg-gray-700/50"}\n          ${"minimal"===s&&"bg-gray-800/50"}\n          ${"corporate"===s&&"bg-blue-600/50"}`,children:a&&a.length>0&&e.jsxs("div",{className:`${c.sponsors} ${t(s)}\n            relative w-[90%] flex flex-col p-8 rounded-2xl gap-25 mt-15 overflow-hidden`,children:["AOSSIE"===i&&e.jsx("div",{className:"absolute bottom-0 inset-x-0 h-1/2 sponsor-pattern-AOSSIE opacity-60"}),"grid"===i&&e.jsx("div",{className:"absolute bottom-0 inset-x-0 h-1/2 sponsor-pattern-grid opacity-60"}),"dots"===i&&e.jsx("div",{className:"absolute bottom-0 inset-x-0 h-1/2 bg-[radial-gradient(rgba(0,0,0,0.15)_1.5px,transparent_0)] bg-size-[20px_20px] pointer-events-none opacity-100"}),e.jsx("div",{className:"mt-5 flex justify-center",children:e.jsxs("div",{className:"w-fit flex flex-col gap-5 justify-center items-center",children:[e.jsx("h2",{className:"font-extrabold text-4xl md:text-5xl lg:text-6xl",children:"Our Sponsors"}),e.jsx("div",{className:"border-3 rounded-4xl w-1/2"})]})}),e.jsx("div",{className:"flex flex-row flex-wrap justify-center items-center gap-10 z-10",children:a.map((t,r)=>e.jsx("a",{href:t.link,target:"_blank",rel:"noopener noreferrer",title:`Visit ${t.name}'s website`,children:e.jsxs("div",{className:`${"dark"===s?"bg-gray-800 text-white":"bg-white text-black"} rounded-lg flex flex-col justify-center items-center gap-2 p-8 w-fit transition-transform hover:scale-[1.02] shadow-lg min-h-75 min-w-62.5 hover:border-2 \n\n                    // Shadows for different themes\n                    ${"AOSSIE"===s&&"shadow-primary/20"}\n                    ${"light"===s&&"shadow-gray-300/30"}\n                    ${"dark"===s&&"shadow-gray-700/30"}\n                    ${"minimal"===s&&"shadow-gray-800/30"} \n                    ${"corporate"===s&&"shadow-blue-600/30"}\n                    \n                    // Size based on sponsorship tier\n                    ${"Platinum"===t.sponsorshipTier&&"min-w-80 min-h-90"}\n                    ${"Gold"===t.sponsorshipTier&&"min-w-70 min-h-80"}\n                    ${"Silver"===t.sponsorshipTier&&"min-w-60 min-h-70"}\n                    ${"Bronze"===t.sponsorshipTier&&"min-w-50 min-h-60"}\n                    `,children:[t.logo?e.jsxs("div",{className:"relative",children:[e.jsx("img",{src:t.logo,alt:t.name,title:t.name,className:`w-50 h-40 object-cover object-center rounded-lg\n                          ${"Platinum"===t.sponsorshipTier&&"w-60 h-50"}\n                          ${"Gold"===t.sponsorshipTier&&"w-55 h-45"}\n                          ${"Silver"===t.sponsorshipTier&&"w-50 h-40"}\n                          ${"Bronze"===t.sponsorshipTier&&"w-45 h-35"}\n                          `,draggable:!1}),e.jsxs("div",{className:`absolute  rotate-12\n                          \n                          ${"Platinum"===t.sponsorshipTier&&"rotate-12 -top-4 -right-1"}\n                          ${"Gold"===t.sponsorshipTier&&"rotate-20 -top-4.5 -right-2.5"}\n                          ${"Silver"===t.sponsorshipTier&&"rotate-30 -top-5.5 -right-4.5"}\n                          ${"Bronze"===t.sponsorshipTier&&"rotate-40 -top-3 -right-3"}\n                          `,children:["Platinum"===t.sponsorshipTier&&e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",fill:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("title",{children:"Platinum tier icon"}),e.jsx("path",{d:"M3 7l4 4 5-7 5 7 4-4v11H3V7z"})]}),"Gold"===t.sponsorshipTier&&e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",fill:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("title",{children:"Gold tier icon"}),e.jsx("path",{d:"M6 2h12v3h3v3a5 5 0 0 1-5 5h-1a5 5 0 0 1-4 3.9V20h4v2H9v-2h4v-3.1A5 5 0 0 1 9 13H8a5 5 0 0 1-5-5V5h3V2z"})]}),"Silver"===t.sponsorshipTier&&e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",fill:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("title",{children:"Silver tier icon"}),e.jsx("path",{d:"M12 14a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2l-3 6 3-2 3 2-3-6z"})]}),"Bronze"===t.sponsorshipTier&&e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",fill:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("title",{children:"Bronze tier icon"}),e.jsx("path",{d:"M2 12l5-5 4 4 4-4 7 7-5 5-4-4-4 4-7-7z"})]})]})]}):e.jsx("span",{className:"block h-fit w-full p-5 bg-black text-white rounded-2xl",title:t.name,children:e.jsx("b",{className:"text-3xl italic",children:t.name})}),e.jsxs("div",{className:"w-full",children:[e.jsx("h3",{className:"font-bold text-2xl",children:t.name}),t.sponsorshipTier&&e.jsx("span",{className:"flex text-[16px] p-2 rounded-xl items-center mt-3.5 font-semibold bg-[#d0f2eb] text-black w-fit",children:t.sponsorshipTier})]})]})},r))})]})}),e.jsx("div",{className:`w-full flex justify-center p-10 ${("light"===s||"dark"===s)&&t(s)} ${c.ctaSection}`,children:e.jsxs("div",{className:"w-4/5 flex flex-col items-center gap-5 py-20 border border-primary rounded-sm mt-20 mb-20",children:[e.jsx("h2",{className:"font-extrabold text-4xl md:text-5xl lg:text-6xl",children:o.title}),e.jsx("p",{className:"font-semibold \n              "+("light"===s?"text-gray-600":"text-gray-400"),children:o.description}),e.jsx("div",{className:"flex flex-wrap justify-center items-center gap-5 mt-8",children:o.sponsorLink.map((t,s)=>e.jsx("a",{href:t.url,...t.newTab&&{target:"_blank"},rel:"noopener noreferrer",title:`Support Us using ${t.name}`,children:e.jsxs("div",{className:`${r(d)} w-fit px-6 py-3`,children:[t.icon&&e.jsx("span",{children:t.icon}),e.jsx("h3",{className:"font-bold",children:t.name})]})},s))})]})})]})};
+//# sourceMappingURL=index.cjs.js.map