AeThex-Labs/AeThex-Bot-Master
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update landing page with new highlight and use cases sections

Browse source 
Adds responsive CSS for highlights and use cases grids, updates navigation links to /features and /commands, and removes duplicate Discord link.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: aed2e46d-25bb-4b73-81a1-bb9e8437c261
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Event-Id: 83c18998-9e10-4a2a-a7f1-500ee97edea5
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3bdfff67-975a-46ad-9845-fbb6b4a4c4b5/aed2e46d-25bb-4b73-81a1-bb9e8437c261/kVU1PZG
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sirpiglr 2025-12-09 23:53:19 +00:00
parent ce786aae4b
commit 3d1b9f6f1d
2 changed files with 217 additions and 230 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
.replit
View file

@ -21,6 +21,10 @@ externalPort = 80
localPort = 8080
externalPort = 8080
[[ports]]
localPort = 33559
externalPort = 3000
[workflows]
runButton = "Project"

443
aethex-bot/public/index.html
View file

@ -758,6 +758,141 @@
font-size: 1.25rem;
font-weight: 600;
}
/* Highlights Grid */
.highlights-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1.5rem;
margin-bottom: 3rem;
}
.highlight-card {
background: var(--card);
border: 1px solid var(--card-border);
border-radius: 16px;
padding: 2rem;
text-align: center;
transition: all 0.3s;
backdrop-filter: blur(10px);
position: relative;
overflow: hidden;
}
.highlight-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 2px;
background: linear-gradient(90deg, transparent, var(--primary), transparent);
opacity: 0;
transition: opacity 0.3s;
}
.highlight-card:hover {
border-color: var(--card-border-hover);
transform: translateY(-4px);
}
.highlight-card:hover::before {
opacity: 1;
}
.highlight-icon {
font-size: 2.5rem;
margin-bottom: 1rem;
transition: transform 0.3s;
}
.highlight-card:hover .highlight-icon {
transform: scale(1.1);
}
.highlight-card h3 {
font-size: 1.25rem;
font-weight: 600;
margin-bottom: 0.5rem;
}
.highlight-card p {
color: var(--muted);
font-size: 0.9rem;
line-height: 1.6;
}
.features-cta {
display: flex;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
/* Use Cases Section */
.use-cases-section {
background: linear-gradient(180deg, rgba(6, 182, 212, 0.02), transparent);
}
.use-cases-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1.5rem;
}
.use-case-card {
background: var(--card);
border: 1px solid var(--card-border);
border-radius: 16px;
padding: 2rem;
transition: all 0.3s;
backdrop-filter: blur(10px);
position: relative;
overflow: hidden;
}
.use-case-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 2px;
background: linear-gradient(90deg, transparent, var(--gradient-3), transparent);
opacity: 0;
transition: opacity 0.3s;
}
.use-case-card:hover {
border-color: var(--card-border-hover);
transform: translateY(-4px);
}
.use-case-card:hover::before {
opacity: 1;
}
.use-case-icon {
font-size: 2rem;
margin-bottom: 1rem;
transition: transform 0.3s;
}
.use-case-card:hover .use-case-icon {
transform: scale(1.1);
}
.use-case-card h3 {
font-size: 1.1rem;
font-weight: 600;
margin-bottom: 0.5rem;
}
.use-case-card p {
color: var(--muted);
font-size: 0.9rem;
line-height: 1.6;
}
/* Add Warden Section */
.add-warden-section {
@ -1269,11 +1404,10 @@
</a>
<nav class="nav-links">
<a href="#ecosystem">Ecosystem</a>
<a href="/features">Features</a>
<a href="/commands">Commands</a>
<a href="#federation">Federation</a>
<a href="#features">Features</a>
<a href="#invite">Add to Server</a>
<a href="#support">Support Us</a>
<a href="https://discord.gg/athx" target="_blank">Discord</a>
</nav>
@ -1469,252 +1603,101 @@
</div>
</section>
<!-- Features Section -->
<!-- Features Highlights Section -->
<section class="section" id="features">
<div class="container">
<div class="section-header">
<p class="section-eyebrow">Powerful Capabilities</p>
<h2 class="section-title">Everything You Need to <span class="text-gradient">Build Community</span></h2>
<p class="section-subtitle">Enterprise-grade features designed for engagement, rewards, security, and growth. All included. All free.</p>
<p class="section-subtitle">60+ features across 6 categories. Enterprise-grade tools for engagement, rewards, security, and growth. All free.</p>
</div>
<!-- Engagement Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">💬</div>
<h3>Engagement & Progression</h3>
<!-- Compact Feature Highlights Grid -->
<div class="highlights-grid">
<div class="highlight-card">
<div class="highlight-icon">📈</div>
<h3>Engagement</h3>
<p>XP, leveling, prestige, leaderboards, daily claims, and streak bonuses</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">📈</div>
<h3>XP & Leveling</h3>
<p>Earn XP from messages, reactions, voice chat. Configurable curves, cooldowns, and multipliers.</p>
</div>
<div class="feature-card">
<div class="feature-icon">⭐</div>
<h3>Prestige System</h3>
<p>Reset at max level for permanent XP bonuses. Up to 15% bonus per prestige tier.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🏆</div>
<h3>Leaderboards</h3>
<p>Weekly, monthly, and all-time rankings. Server-specific and global federation boards.</p>
</div>
<div class="feature-card">
<div class="feature-icon">📅</div>
<h3>Daily Claims</h3>
<p>Reward daily activity with streak bonuses. Configurable rewards and multipliers.</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">🛡️</div>
<h3>Security</h3>
<p>Anti-nuke protection, auto-mod, raid defense, and full audit logging</p>
</div>
</div>
<!-- Rewards Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">🎁</div>
<h3>Rewards & Economy</h3>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🎯</div>
<h3>Quest System</h3>
<p>Daily and weekly challenges with custom objectives. Reward XP, roles, and perks.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎖️</div>
<h3>Achievements</h3>
<p>50+ triggers including levels, messages, voice time, and custom events. Unlock badges.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🛒</div>
<h3>XP Shop</h3>
<p>Let members spend XP on roles, badges, and custom items. Full inventory system.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎉</div>
<h3>Giveaways</h3>
<p>Automated giveaways with requirements, rerolls, and winner announcements.</p>
</div>
</div>
</div>
<!-- Security Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">🛡️</div>
<h3>Security & Moderation</h3>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🔥</div>
<h3>Sentinel Anti-Nuke</h3>
<p>RAM-based heat tracking detects mass bans, kicks, and deletions. Automatic lockdown.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🤖</div>
<h3>Auto-Moderation</h3>
<p>Configurable filters for links, spam, bad words, invites, and mass mentions.</p>
</div>
<div class="feature-card">
<div class="feature-icon">📋</div>
<h3>Mod Tools</h3>
<p>Warn, kick, ban, timeout with full logging. View history and audit trails.</p>
</div>
<div class="feature-card">
<div class="feature-icon">✅</div>
<h3>Verification</h3>
<p>Link Discord to AeThex platform accounts. Verified badges and role assignments.</p>
</div>
</div>
</div>
<!-- Community Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">👥</div>
<h3>Community Tools</h3>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🎭</div>
<h3>Role Panels</h3>
<p>Interactive button-based role selection. Create multiple panels with requirements.</p>
</div>
<div class="feature-card">
<div class="feature-icon">👋</div>
<h3>Welcome System</h3>
<p>Rich embed messages for joins and leaves. Dynamic variables and custom designs.</p>
</div>
<div class="feature-card">
<div class="feature-icon">📢</div>
<h3>Announcements</h3>
<p>Schedule messages with embeds. Recurring daily, weekly, or monthly posts.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🔗</div>
<h3>Federation Sync</h3>
<p>Map roles between servers. Automatic sync across the entire AeThex network.</p>
</div>
</div>
</div>
<!-- Fun & Games Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">🎮</div>
<div class="highlight-card">
<div class="highlight-icon">🎮</div>
<h3>Fun & Games</h3>
<p>Trivia, duels, slots, dice, 8-ball, and XP betting</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🎱</div>
<h3>8-Ball & Fortune</h3>
<p>Ask the magic 8-ball questions, flip coins, and roll dice with custom notation.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🧠</div>
<h3>Trivia</h3>
<p>Multiple categories, earn XP for correct answers. Test your knowledge daily.</p>
</div>
<div class="feature-card">
<div class="feature-icon">⚔️</div>
<h3>Duels</h3>
<p>Challenge others to 1v1 battles. Bet XP on the outcome for extra rewards.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎰</div>
<h3>Slot Machine</h3>
<p>Try your luck at slots. Match symbols for XP jackpots and winning streaks.</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">❤️</div>
<h3>Social</h3>
<p>Reputation, birthdays, reminders, starboard, and social actions</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">💰</div>
<h3>Economy</h3>
<p>Work system, heists, trading, gifting, and XP shop</p>
</div>
<div class="highlight-card">
<div class="highlight-icon">🔧</div>
<h3>Utility</h3>
<p>Translate, QR codes, polls, embeds, and admin tools</p>
</div>
</div>
<!-- Social Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">❤️</div>
<h3>Social & Interaction</h3>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">⭐</div>
<h3>Reputation</h3>
<p>Give and receive rep points. Build your community standing over time.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🤗</div>
<h3>Social Actions</h3>
<p>Hugs, high-fives, and more with animated GIFs. Express yourself!</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎂</div>
<h3>Birthdays</h3>
<p>Set your birthday, view upcoming celebrations, get special recognition.</p>
</div>
<div class="feature-card">
<div class="feature-icon">⏰</div>
<h3>Reminders</h3>
<p>Set personal reminders. Never forget important events or tasks.</p>
</div>
</div>
<div class="features-cta">
<a href="/features" class="btn btn-primary btn-lg">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></svg>
Explore All Features
</a>
<a href="/commands" class="btn btn-secondary btn-lg">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 17l6-6-6-6"/><path d="M12 19h8"/></svg>
View All Commands
</a>
</div>
</div>
</section>
<!-- Use Cases Section -->
<section class="section use-cases-section" id="use-cases">
<div class="container">
<div class="section-header">
<p class="section-eyebrow">Perfect For</p>
<h2 class="section-title">Built for <span class="text-gradient">Every Community</span></h2>
<p class="section-subtitle">From gaming clans to study groups, Warden adapts to your needs.</p>
</div>
<!-- Economy Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">💰</div>
<h3>Economy & Trading</h3>
<div class="use-cases-grid">
<div class="use-case-card">
<div class="use-case-icon">🎮</div>
<h3>Gaming Communities</h3>
<p>Leaderboards, duels, voice XP, and competitive rankings keep gamers engaged</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">💼</div>
<h3>Work System</h3>
<p>Work hourly for XP rewards. Different jobs with varying payouts.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🏦</div>
<h3>Heists</h3>
<p>Team up for group heists. Higher risk, higher rewards. Strategy matters.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎁</div>
<h3>Gifting</h3>
<p>Gift XP to friends and community members. Spread the wealth.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🔄</div>
<h3>Trading</h3>
<p>Trade items between users. Full inventory system with secure trades.</p>
</div>
<div class="use-case-card">
<div class="use-case-icon">🎬</div>
<h3>Content Creators</h3>
<p>Reward viewers, showcase fan art with starboard, run giveaways for subscribers</p>
</div>
</div>
<!-- Utility Features -->
<div class="feature-category">
<div class="category-header">
<div class="category-icon">🔧</div>
<h3>Utility Tools</h3>
<div class="use-case-card">
<div class="use-case-icon">💻</div>
<h3>Developer & Tech</h3>
<p>Trivia for knowledge, rep system for helpers, birthday celebrations for teams</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🌐</div>
<h3>Translation</h3>
<p>Translate text between 100+ languages instantly. Break language barriers.</p>
</div>
<div class="feature-card">
<div class="feature-icon">📖</div>
<h3>Definitions</h3>
<p>Look up word definitions, synonyms, and usage examples.</p>
</div>
<div class="feature-card">
<div class="feature-icon">🔢</div>
<h3>Calculator</h3>
<p>Safe math expression evaluator. Complex calculations made easy.</p>
</div>
<div class="feature-card">
<div class="feature-icon">📱</div>
<h3>QR Codes</h3>
<p>Generate QR codes for any text or URL. Share links instantly.</p>
</div>
<div class="use-case-card">
<div class="use-case-icon">🎨</div>
<h3>Art & Creative</h3>
<p>Starboard showcases best work, achievements for milestones, XP for engagement</p>
</div>
<div class="use-case-card">
<div class="use-case-icon">📚</div>
<h3>Education & Study</h3>
<p>Quests for goals, reminders for deadlines, daily streaks for consistency</p>
</div>
<div class="use-case-card">
<div class="use-case-icon">💼</div>
<h3>Brand & Business</h3>
<p>Giveaways for promotions, verification for authenticity, scheduled announcements</p>
</div>
</div>
</div>