new file: public/partner2-logo.svg

This commit is contained in:
Anderson 2026-02-05 12:29:05 +00:00 committed by GitHub
parent 7b4b614186
commit d42a7825a5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
26 changed files with 2141 additions and 1148 deletions

View file

@ -1,106 +1,64 @@
<!-- Use this file to provide workspace-specific custom instructions to Copilot. For more details, visit https://code.visualstudio.com/docs/copilot/copilot-customization#_use-a-githubcopilotinstructionsmd-file -->
- [ ] Verify that the copilot-instructions.md file in the .github directory is created.
# AeThex.us Copilot Instructions
- [ ] Clarify Project Requirements
<!-- Ask for project type, language, and frameworks if not specified. Skip if already provided. -->
## Project Overview
- [ ] Scaffold the Project
<!--
Ensure that the previous step has been marked as completed.
Call project setup tool with projectType parameter.
Run scaffolding command to create project files and folders.
Use '.' as the working directory.
If no appropriate projectType is available, search documentation using available tools.
Otherwise, create the project structure manually using available file creation tools.
-->
AeThex.us is the main website for AeThex, built with Astro. The platform is organized into three Trinity divisions:
- [ ] Customize the Project
<!--
Verify that all previous steps have been completed successfully and you have marked the step as completed.
Develop a plan to modify codebase according to user requirements.
Apply modifications using appropriate tools and user-provided references.
Skip this step for "Hello World" projects.
-->
- **Foundation** (Red) - Education, community programs, and mentorship for developers
- **Corporation** (Blue) - Technology conglomerate powering digital ecosystems and platforms
- **Labs** (Yellow) - The Grid bounty platform for creators to ship code and earn rewards
- [ ] Install Required Extensions
<!-- ONLY install extensions provided mentioned in the get_project_setup_info. Skip this step otherwise and mark as completed. -->
## Tech Stack
- [ ] Compile the Project
<!--
Verify that all previous steps have been completed.
Install any missing dependencies.
Run diagnostics and resolve any issues.
Check for markdown files in project folder for relevant instructions on how to do this.
-->
- **Framework**: Astro 5.x (static site generator)
- **Styling**: CSS with custom properties, no CSS frameworks
- **Fonts**: System fonts + JetBrains Mono for code
- **Icons**: Emoji-based icons throughout
- [ ] Create and Run Task
<!--
Verify that all previous steps have been completed.
Check https://code.visualstudio.com/docs/debugtest/tasks to determine if the project needs a task. If so, use the create_and_run_task to create and launch a task based on package.json, README.md, and project structure.
Skip this step otherwise.
-->
## Project Structure
- [ ] Launch the Project
<!--
Verify that all previous steps have been completed.
Prompt user for debug mode, launch only if confirmed.
-->
```
src/
├── components/ # Reusable Astro components
├── layouts/ # Page layouts (MainLayout.astro)
├── pages/ # All page routes
│ ├── index.astro # Homepage
│ ├── foundation.astro # Foundation division
│ ├── corporation.astro # Corporation division
│ ├── labs.astro # Labs division (The Grid)
│ ├── gameforge.astro # GameForge product (Labs)
│ └── docs/ # Documentation pages
public/
├── favicon.svg # Trinity circles logo
├── global.css # Global styles
└── *.svg # Logo assets
```
- [ ] Ensure Documentation is Complete
<!--
Verify that all previous steps have been completed.
Verify that README.md and the copilot-instructions.md file in the .github directory exists and contains current project information.
Clean up the copilot-instructions.md file in the .github directory by removing all HTML comments.
-->
## Development Commands
<!--
## Execution Guidelines
PROGRESS TRACKING:
- If any tools are available to manage the above todo list, use it to track progress through this checklist.
- After completing each step, mark it complete and add a summary.
- Read current todo list status before starting each new step.
```bash
npm install # Install dependencies
npm run dev # Start dev server (localhost:4321)
npm run build # Build for production
```
COMMUNICATION RULES:
- Avoid verbose explanations or printing full command outputs.
- If a step is skipped, state that briefly (e.g. "No extensions needed").
- Do not explain project structure unless asked.
- Keep explanations concise and focused.
## Design Guidelines
DEVELOPMENT RULES:
- Use '.' as the working directory unless user specifies otherwise.
- Avoid adding media or external links unless explicitly requested.
- Use placeholders only with a note that they should be replaced.
- Use VS Code API tool only for VS Code extension projects.
- Once the project is created, it is already opened in Visual Studio Code—do not suggest commands to open this project in Visual Studio again.
- If the project setup information has additional rules, follow them strictly.
- **Trinity Colors**: Red (#FF0000), Blue (#0066ff), Yellow (#EAB308)
- **Dark Theme**: Primary backgrounds #0a0a0a, #0f0f0f, #1a1a1a
- **Responsive Breakpoints**: 1024px (tablet), 768px (mobile), 480px (small)
- **Animations**: Subtle CSS transitions, avoid heavy JavaScript animations
FOLDER CREATION RULES:
- Always use the current directory as the project root.
- If you are running any terminal commands, use the '.' argument to ensure that the current working directory is used ALWAYS.
- Do not create a new folder unless the user explicitly requests it besides a .vscode folder for a tasks.json file.
- If any of the scaffolding commands mention that the folder name is not correct, let the user know to create a new folder with the correct name and then reopen it again in vscode.
## Key Conventions
EXTENSION INSTALLATION RULES:
- Only install extension specified by the get_project_setup_info tool. DO NOT INSTALL any other extensions.
1. Each Trinity page has a distinct visual identity matching its purpose
2. Use scoped `<style>` blocks in Astro components
3. Mobile-first responsive design with comprehensive breakpoints
4. Keep external dependencies minimal
5. All educational content is free (Foundation mission)
PROJECT CONTENT RULES:
- If the user has not specified project details, assume they want a "Hello World" project as a starting point.
- Avoid adding links of any type (URLs, files, folders, etc.) or integrations that are not explicitly required.
- Avoid generating images, videos, or any other media files unless explicitly requested.
- If you need to use any media assets as placeholders, let the user know that these are placeholders and should be replaced with the actual assets later.
- Ensure all generated components serve a clear purpose within the user's requested workflow.
- If a feature is assumed but not confirmed, prompt the user for clarification before including it.
- If you are working on a VS Code extension, use the VS Code API tool with a query to find relevant VS Code API references and samples related to that query.
## Notes
TASK COMPLETION RULES:
- Your task is complete when:
- Project is successfully scaffolded and compiled without errors
- copilot-instructions.md file in the .github directory exists in the project
- README.md file exists and is up to date
- User is provided with clear instructions to debug/launch the project
Before starting a new task in the above plan, update progress in the plan.
-->
- Work through each checklist item systematically.
- Keep communication concise and focused.
- Follow development best practices.
- GameForge is a **Labs product**, not a Trinity division
- The favicon shows three overlapping circles (Red, Blue, Yellow)
- Partner logos in public/ folder are placeholder SVGs

View file

@ -6,9 +6,9 @@ Infrastructure for the Metaverse.
AeThex provides foundational infrastructure for building immersive digital experiences. The platform is organized into three divisions:
- **Foundation** - Open-source tools and community governance
- **Corporation** - Commercial products and enterprise services
- **Labs** - Research & development for experimental technologies
- **Foundation** - Education, community programs, and mentorship for developers
- **Corporation** - Technology conglomerate powering digital ecosystems and platforms
- **Labs** - The Grid bounty platform for creators to ship code and earn rewards
## Tech Stack

View file

@ -1,4 +1,8 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" fill="#0A0A0A"/>
<path d="M7 16L12 21L7 26M15 26H25" stroke="#33FF00" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<!-- Red circle - Left -->
<circle cx="11" cy="16" r="6" fill="#FF0000"/>
<!-- Blue circle - Center -->
<circle cx="16" cy="12" r="6" fill="#0066FF"/>
<!-- Yellow circle - Right -->
<circle cx="21" cy="16" r="6" fill="#FFCC00"/>
</svg>

Before

Width:  |  Height:  |  Size: 267 B

After

Width:  |  Height:  |  Size: 331 B

View file

@ -240,36 +240,91 @@ footer::before { content: ''; position: absolute; top: -2px; left: 0; width: 100
.trinity-section { padding: 60px 0; }
.section-header { margin-bottom: 50px; }
.products-section { padding: 60px 0; }
.container { padding: 0 16px; }
.tool-hero { padding: 48px 16px 28px 16px; }
.tool-hero-title { font-size: 2em; letter-spacing: 2px; }
.tool-hero-desc { font-size: 1em; }
}
/* Mobile breakpoint */
@media (max-width: 600px) {
@media (max-width: 768px) {
.container { padding: 0 12px; }
.trinity-grid { grid-template-columns: 1fr; gap: 20px; }
.products-grid { grid-template-columns: 1fr; gap: 20px; }
.hero-title { font-size: 2.2em; letter-spacing: 2px; }
.hero-title { font-size: 2.5em; letter-spacing: 2px; }
.hero-subtitle { font-size: 1em; letter-spacing: 2px; }
.hero-description { font-size: 1em; }
.section-title { font-size: 1.6em; letter-spacing: 2px; }
.hero-description { font-size: 0.95em; padding: 0 12px; }
.section-title { font-size: 1.8em; letter-spacing: 2px; }
.section-subtitle { font-size: 0.9em; }
.hero { padding: 40px 0 60px 0; }
.trinity-section { padding: 40px 0; }
.section-header { margin-bottom: 30px; }
.products-section { padding: 40px 0; }
.trinity-card { padding: 30px 24px; }
.card-icon { font-size: 2.5em; margin-bottom: 20px; }
.card-title { font-size: 1.4em; letter-spacing: 2px; }
.product-card { padding: 24px; }
.product-title { font-size: 1.4em; }
.flow-diagram { flex-direction: column; gap: 20px; }
.flow-node { width: 100%; max-width: 200px; height: 120px; }
.trinity-card { padding: 28px 20px; }
.card-icon { font-size: 2.2em; margin-bottom: 16px; }
.card-title { font-size: 1.3em; letter-spacing: 2px; }
.card-label { font-size: 0.8em; }
.card-description { font-size: 0.9em; line-height: 1.6; }
.card-features li { padding: 10px 0; font-size: 0.9em; }
.product-card { padding: 24px 20px; }
.product-title { font-size: 1.3em; }
.product-subtitle { font-size: 0.8em; }
.product-description { font-size: 0.9em; }
.flow-diagram { flex-direction: column; gap: 16px; }
.flow-node { width: 100%; max-width: 180px; height: 100px; }
.flow-node-title { font-size: 1em; }
.flow-node-desc { font-size: 0.7em; }
.flow-arrow { transform: rotate(90deg); font-size: 1.5em; }
.infra-viz { padding: 30px 16px; }
.viz-title { font-size: 1.2em; margin-bottom: 24px; }
.infra-viz { padding: 24px 12px; }
.viz-title { font-size: 1.1em; margin-bottom: 20px; }
.trinity-badge { flex-direction: column; gap: 10px; align-items: center; }
.badge { padding: 10px 20px; font-size: 0.75em; }
.cta-button { padding: 16px 32px; font-size: 0.9em; letter-spacing: 2px; }
footer { padding: 50px 0 30px 0; }
.footer-logo { font-size: 1.8em; letter-spacing: 4px; }
.footer-links { flex-direction: column; gap: 16px; }
.footer-tagline { font-size: 0.8em; letter-spacing: 2px; }
.badge { padding: 10px 18px; font-size: 0.75em; }
.cta-button { padding: 14px 28px; font-size: 0.85em; letter-spacing: 2px; width: 100%; max-width: 280px; text-align: center; }
footer { padding: 40px 0 24px 0; }
.footer-logo { font-size: 1.6em; letter-spacing: 3px; }
.footer-links { flex-direction: column; gap: 14px; }
.footer-tagline { font-size: 0.75em; letter-spacing: 2px; }
.footer-link { font-size: 0.8em; }
.copyright { font-size: 0.7em; }
.tool-hero { padding: 36px 12px 20px 12px; }
.tool-hero-title { font-size: 1.6em; letter-spacing: 1px; }
.tool-hero-desc { font-size: 0.9em; padding: 0 8px; }
.tool-content { min-height: 180px; margin-bottom: 1.5em; }
.theme-switcher { flex-direction: column; padding: 1em; max-width: 100%; margin: 1em 12px; gap: 0.8em; }
.theme-btn { width: 100%; padding: 0.6em; margin: 0; }
}
/* Small phone breakpoint */
@media (max-width: 480px) {
.container { padding: 0 10px; }
.hero-title { font-size: 1.8em; letter-spacing: 1px; }
.hero-subtitle { font-size: 0.85em; letter-spacing: 1px; }
.hero-description { font-size: 0.85em; line-height: 1.6; }
.section-title { font-size: 1.4em; letter-spacing: 1px; }
.section-subtitle { font-size: 0.8em; letter-spacing: 1px; }
.hero { padding: 30px 0 40px 0; }
.trinity-section { padding: 24px 0; }
.section-header { margin-bottom: 20px; }
.products-section { padding: 30px 0; }
.trinity-card { padding: 20px 16px; border-radius: 12px; }
.card-icon { font-size: 1.8em; margin-bottom: 12px; }
.card-title { font-size: 1.15em; margin-bottom: 6px; }
.card-label { font-size: 0.7em; margin-bottom: 10px; }
.card-description { font-size: 0.85em; margin-bottom: 12px; }
.card-features li { padding: 8px 0; font-size: 0.8em; }
.product-card { padding: 20px 16px; }
.product-title { font-size: 1.15em; }
.infra-viz { display: none; }
.trinity-badge { gap: 8px; }
.badge { padding: 8px 14px; font-size: 0.7em; letter-spacing: 1px; }
.cta-button { padding: 12px 20px; font-size: 0.8em; }
footer { padding: 30px 0 20px 0; }
.footer-logo { font-size: 1.4em; }
.footer-tagline { font-size: 0.7em; margin-bottom: 24px; }
.footer-links { gap: 12px; margin-bottom: 24px; }
.tool-hero { padding: 24px 8px 16px 8px; }
.tool-hero-title { font-size: 1.3em; }
.tool-hero-desc { font-size: 0.8em; }
.tool-content { min-height: 140px; }
.theme-switcher { margin: 0.8em 8px; padding: 0.8em; font-size: 0.95em; }
}

3
public/partner1-logo.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="120" height="40" viewBox="0 0 120 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="28" font-family="system-ui, sans-serif" font-size="18" font-weight="700" fill="#666">MetaPlay</text>
</svg>

After

Width:  |  Height:  |  Size: 221 B

3
public/partner2-logo.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="120" height="40" viewBox="0 0 120 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="28" font-family="system-ui, sans-serif" font-size="18" font-weight="700" fill="#666">GameForge</text>
</svg>

After

Width:  |  Height:  |  Size: 222 B

3
public/partner3-logo.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="120" height="40" viewBox="0 0 120 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="28" font-family="system-ui, sans-serif" font-size="18" font-weight="700" fill="#666">DevHub</text>
</svg>

After

Width:  |  Height:  |  Size: 219 B

3
public/partner4-logo.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="120" height="40" viewBox="0 0 120 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="28" font-family="system-ui, sans-serif" font-size="18" font-weight="700" fill="#666">PressX</text>
</svg>

After

Width:  |  Height:  |  Size: 219 B

3
public/partner5-logo.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="120" height="40" viewBox="0 0 120 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<text x="10" y="28" font-family="system-ui, sans-serif" font-size="16" font-weight="700" fill="#666">OpenSource</text>
</svg>

After

Width:  |  Height:  |  Size: 223 B

View file

@ -12,73 +12,73 @@
<div class="trinity-card foundation" tabindex="0" onclick="showModal('foundation')">
<div class="card-icon">🔴</div>
<h3 class="card-title">Foundation</h3>
<p class="card-label">Critical Infrastructure • Nonprofit</p>
<p class="card-label">Education • Community • Nonprofit</p>
<p class="card-description">
The nonprofit backbone maintaining authentication, security, and core APIs.
Open-source infrastructure that the entire AeThex ecosystem depends on.
Open-source education, community programs, and mentorship for builders.
Learn, grow, and contribute to the future of development.
</p>
<ul class="card-features">
<li>Passport Identity System</li>
<li>Authentication Protocols</li>
<li>Security Infrastructure</li>
<li>Core Open-Source APIs</li>
<li>Community Governance</li>
<li>Open Curriculum</li>
<li>Mentorship Programs</li>
<li>Community Events</li>
<li>Certifications & Badges</li>
<li>Workshops & Hackathons</li>
</ul>
</div>
<div class="trinity-card corporation" tabindex="0" onclick="showModal('corporation')">
<div class="card-icon">🔵</div>
<h3 class="card-title">Corporation</h3>
<p class="card-label">Commercial Services • Production</p>
<p class="card-label">Technology Conglomerate • Platforms</p>
<p class="card-description">
Professional commercial division delivering polished products and enterprise-grade infrastructure
to developers and players worldwide.
Building the future of digital interaction. Platforms for developers,
creators, and innovators across the ecosystem.
</p>
<ul class="card-features">
<li>AeThex Studio IDE</li>
<li>Production Deployment</li>
<li>Premium Services</li>
<li>Enterprise Support</li>
<li>Analytics & Insights</li>
<li>Digital Ecosystems</li>
<li>AeThex Studio</li>
<li>Cloud Infrastructure</li>
<li>Creator Tools</li>
<li>Enterprise Solutions</li>
</ul>
</div>
<div class="trinity-card labs" tabindex="0" onclick="showModal('labs')">
<div class="card-icon">🟡</div>
<h3 class="card-title">Labs</h3>
<p class="card-label">Research & Development • Experimental</p>
<p class="card-label">The Grid • Creators • Bounties</p>
<p class="card-description">
Innovation division pushing boundaries with experimental features, beta technologies,
and next-generation metaverse infrastructure.
Ship code, earn rewards, and build your reputation. The Grid platform
connects creators through bounties and collaboration.
</p>
<ul class="card-features">
<li>Nexus Engine v2.0</li>
<li>AI Copilot Assistant</li>
<li>Experimental Features</li>
<li>Beta Testing Programs</li>
<li>Future R&D Projects</li>
<li>Bounty System</li>
<li>Creator Profiles</li>
<li>Reputation & XP</li>
<li>Collaboration Tools</li>
<li>Reward Payouts</li>
</ul>
</div>
</div>
<div class="infra-viz">
<div class="viz-title">Infrastructure Flow</div>
<div class="viz-title">Ecosystem Flow</div>
<div class="flow-diagram">
<div class="flow-node labs">
<div class="flow-node-title">Labs</div>
<div class="flow-node-desc">Innovation</div>
<div class="flow-node-desc">Create</div>
</div>
<div class="flow-arrow">→</div>
<div class="flow-node foundation">
<div class="flow-node-title">Foundation</div>
<div class="flow-node-desc">Validation</div>
<div class="flow-node-desc">Learn</div>
</div>
<div class="flow-arrow">→</div>
<div class="flow-node corporation">
<div class="flow-node-title">Corporation</div>
<div class="flow-node-desc">Production</div>
<div class="flow-node-desc">Scale</div>
</div>
</div>
<p style="color: #666; margin-top: 40px; line-height: 1.8;">
Labs creates breakthrough technology → Foundation ensures security and stability
Corporation delivers to production. The Trinity doesn't compete—it collaborates.
Labs creators build and ship → Foundation teaches and mentors
Corporation scales to production. The Trinity doesn't compete—it collaborates.
</p>
</div>
</div>
@ -93,9 +93,9 @@
<script type="text/javascript">
const details = {
foundation: `<h3>Foundation</h3><p>The nonprofit backbone maintaining authentication, security, and core APIs. Open-source infrastructure that the entire AeThex ecosystem depends on.</p><ul><li>Passport Identity System</li><li>Authentication Protocols</li><li>Security Infrastructure</li><li>Core Open-Source APIs</li><li>Community Governance</li></ul>`,
corporation: `<h3>Corporation</h3><p>Professional commercial division delivering polished products and enterprise-grade infrastructure to developers and players worldwide.</p><ul><li>AeThex Studio IDE</li><li>Production Deployment</li><li>Premium Services</li><li>Enterprise Support</li><li>Analytics & Insights</li></ul>`,
labs: `<h3>Labs</h3><p>Innovation division pushing boundaries with experimental features, beta technologies, and next-generation metaverse infrastructure.</p><ul><li>Nexus Engine v2.0</li><li>AI Copilot Assistant</li><li>Experimental Features</li><li>Beta Testing Programs</li><li>Future R&D Projects</li></ul>`
foundation: `<h3>Foundation</h3><p>Open-source education, community programs, and mentorship for builders. Learn, grow, and contribute to the future of development.</p><ul><li>Open Curriculum</li><li>Mentorship Programs</li><li>Community Events</li><li>Certifications & Badges</li><li>Workshops & Hackathons</li></ul>`,
corporation: `<h3>Corporation</h3><p>Building the future of digital interaction. Platforms for developers, creators, and innovators across the ecosystem.</p><ul><li>Digital Ecosystems</li><li>AeThex Studio</li><li>Cloud Infrastructure</li><li>Creator Tools</li><li>Enterprise Solutions</li></ul>`,
labs: `<h3>Labs</h3><p>Ship code, earn rewards, and build your reputation. The Grid platform connects creators through bounties and collaboration.</p><ul><li>Bounty System</li><li>Creator Profiles</li><li>Reputation & XP</li><li>Collaboration Tools</li><li>Reward Payouts</li></ul>`
};
window.showModal = function(type) {
document.getElementById('trinity-modal').style.display = 'block';
@ -155,8 +155,8 @@
}
.trinity-grid {
display: grid;
grid-template-columns: repeat(3, minmax(320px, 1fr));
gap: 48px;
grid-template-columns: repeat(3, minmax(280px, 1fr));
gap: 32px;
margin: 56px 0 40px 0;
justify-content: center;
align-items: stretch;
@ -165,36 +165,140 @@
background: rgba(30,30,30,0.92);
border-radius: 28px;
box-shadow: 0 4px 32px #0006;
padding: 48px 36px 36px 36px;
padding: 36px 28px 28px 28px;
color: #fff;
transition: transform 0.18s, box-shadow 0.18s;
cursor: pointer;
outline: none;
border: 2px solid transparent;
min-width: 0;
min-height: 440px;
min-height: 380px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
}
.card-icon {
font-size: 2.5em;
margin-bottom: 16px;
}
.card-title {
font-size: 1.5em;
margin-bottom: 8px;
}
.card-label {
font-size: 0.85em;
color: #888;
margin-bottom: 12px;
}
.card-description {
font-size: 0.95em;
line-height: 1.6;
color: #aaa;
margin-bottom: 16px;
}
.card-features {
list-style: none;
padding: 0;
margin: 0;
font-size: 0.85em;
}
.card-features li {
padding: 4px 0;
color: #666;
}
.card-features li::before {
content: "▸ ";
color: #555;
}
@media (max-width: 1100px) {
.trinity-grid {
grid-template-columns: 1fr 1fr;
gap: 32px;
gap: 24px;
}
.trinity-card {
min-height: 340px;
padding: 28px 24px 24px 24px;
}
}
@media (max-width: 800px) {
.trinity-grid {
grid-template-columns: 1fr;
gap: 28px;
gap: 20px;
margin: 32px 0 24px 0;
}
.trinity-section {
padding: 32px 0 12px 0;
padding: 24px 16px 12px 16px;
}
.trinity-card {
padding: 28px 14px 18px 14px;
min-height: 320px;
padding: 24px 20px 20px 20px;
min-height: auto;
border-radius: 20px;
}
.card-icon {
font-size: 2em;
margin-bottom: 12px;
}
.card-title {
font-size: 1.3em;
}
.card-description {
font-size: 0.9em;
}
.section-title {
font-size: 1.8em;
}
.section-subtitle {
font-size: 0.95em;
}
}
@media (max-width: 480px) {
.trinity-section {
padding: 16px 12px 8px 12px;
}
.trinity-grid {
gap: 16px;
margin: 24px 0 16px 0;
}
.trinity-card {
padding: 20px 16px 16px 16px;
border-radius: 16px;
}
.card-icon {
font-size: 1.8em;
margin-bottom: 10px;
}
.card-title {
font-size: 1.2em;
margin-bottom: 6px;
}
.card-label {
font-size: 0.75em;
margin-bottom: 10px;
}
.card-description {
font-size: 0.85em;
line-height: 1.5;
margin-bottom: 12px;
}
.card-features {
font-size: 0.8em;
}
.card-features li {
padding: 3px 0;
}
.section-title {
font-size: 1.5em;
}
.section-subtitle {
font-size: 0.85em;
}
.infra-viz {
display: none;
}
.modal-content {
padding: 24px 20px;
margin: 20% auto;
}
}
</style>

View file

@ -398,19 +398,35 @@ import MainLayout from '../layouts/MainLayout.astro';
}
/* Responsive */
@media (max-width: 900px) {
.story-grid, .about-cta {
grid-template-columns: 1fr;
}
.trinity-cards, .focus-grid {
grid-template-columns: 1fr;
}
.principles-grid {
grid-template-columns: 1fr;
}
.about-hero .hero-title {
font-size: 2.5em;
}
@media (max-width: 1024px) {
.story-grid, .about-cta { grid-template-columns: 1fr; }
.trinity-cards { grid-template-columns: 1fr 1fr; }
.focus-grid { grid-template-columns: 1fr 1fr; }
.principles-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
.trinity-cards, .focus-grid, .principles-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.about-hero { padding: 40px 12px 32px 12px; }
.about-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.about-hero .hero-subtitle { font-size: 1em; }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.story-content h2 { font-size: 1.4em; }
.story-content p { font-size: 0.9em; }
.trinity-card, .focus-card, .principle-card { padding: 24px 16px; }
.cta-content h2 { font-size: 1.6em; }
.cta-content p { font-size: 0.9em; }
.cta-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.about-hero { padding: 24px 10px 20px 10px; }
.about-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.about-hero .hero-subtitle { font-size: 0.85em; }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.section-header p { font-size: 0.8em; }
.trinity-card, .focus-card, .principle-card { padding: 20px 12px; }
.cta-content h2 { font-size: 1.3em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -437,33 +437,39 @@ const categories = ['All', 'Announcement', 'Product Update', 'Events', 'Foundati
}
/* Responsive */
@media (max-width: 900px) {
.featured-card {
grid-template-columns: 1fr;
}
.featured-image {
height: 250px;
}
.blog-grid {
grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 1024px) {
.featured-card { grid-template-columns: 1fr; }
.blog-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.blog-hero .hero-title {
font-size: 2.5em;
}
.blog-grid {
grid-template-columns: 1fr;
}
.featured-content {
padding: 24px;
}
.featured-title {
font-size: 1.5em;
}
.newsletter-form {
flex-direction: column;
}
@media (max-width: 768px) {
.blog-hero { padding: 40px 12px 32px 12px; }
.blog-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.blog-hero .hero-subtitle { font-size: 1em; }
.featured-image { height: 200px; }
.blog-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.featured-content { padding: 24px 16px; }
.featured-title { font-size: 1.4em; }
.featured-excerpt { font-size: 0.9em; }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.post-title { font-size: 1.2em; }
.post-excerpt { font-size: 0.85em; }
.newsletter-section { padding: 40px 12px; }
.newsletter-form { flex-direction: column; gap: 12px; }
.newsletter-form input { width: 100%; padding: 14px 16px; font-size: 0.9em; }
.newsletter-form button { width: 100%; padding: 14px 24px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.blog-hero { padding: 24px 10px 20px 10px; }
.blog-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.blog-hero .hero-subtitle { font-size: 0.85em; }
.featured-content { padding: 20px 12px; }
.featured-title { font-size: 1.2em; }
.featured-image { height: 160px; }
.post-card { padding: 16px 12px; }
.post-title { font-size: 1.1em; }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.newsletter-section { padding: 24px 10px; }
}
</style>
</MainLayout>

View file

@ -445,14 +445,35 @@ const upcomingEvents = [
}
/* Responsive */
@media (max-width: 900px) {
@media (max-width: 1024px) {
.stats-section, .channels-grid, .contributors-grid { grid-template-columns: repeat(2, 1fr); }
.activity-container { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
.stats-section, .channels-grid, .contributors-grid { grid-template-columns: 1fr; }
.hero-title { font-size: 2.5em; }
.hero-actions, .cta-actions { flex-direction: column; align-items: center; }
@media (max-width: 768px) {
.stats-section, .channels-grid, .contributors-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.community-hero { padding: 40px 12px 32px 12px; }
.hero-title { font-size: 2em; letter-spacing: 2px; }
.hero-subtitle { font-size: 1em; }
.hero-actions, .cta-actions { flex-direction: column; align-items: center; gap: 12px; }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.stat-card, .channel-card, .contributor-card { padding: 20px 16px; }
.stat-number { font-size: 1.8em; }
.stat-label { font-size: 0.75em; }
.cta-section h2 { font-size: 1.6em; }
.cta-section p { font-size: 0.9em; }
.primary-button, .secondary-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.community-hero { padding: 24px 10px 20px 10px; }
.hero-title { font-size: 1.6em; letter-spacing: 1px; }
.hero-subtitle { font-size: 0.85em; }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.stat-card, .channel-card, .contributor-card { padding: 16px 12px; }
.stat-number { font-size: 1.4em; }
.stat-label { font-size: 0.65em; }
.cta-section h2 { font-size: 1.3em; }
.primary-button, .secondary-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -266,13 +266,28 @@ import MainLayout from '../layouts/MainLayout.astro';
box-shadow: 0 10px 30px rgba(59, 130, 246, 0.3);
}
@media (max-width: 900px) {
.contact-grid {
grid-template-columns: 1fr;
}
.contact-hero .hero-title {
font-size: 2.5em;
}
@media (max-width: 1024px) {
.contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
.contact-hero { padding: 40px 12px 32px 12px; }
.contact-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.contact-hero .hero-description { font-size: 0.95em; }
.contact-section { padding: 40px 12px; }
.info-card, .form-card { padding: 24px 16px; }
.info-card h2, .form-card h2 { font-size: 1.4em; }
.form-group label { font-size: 0.85em; }
.form-group input, .form-group textarea { padding: 12px 14px; font-size: 0.9em; }
.submit-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.contact-hero { padding: 24px 10px 20px 10px; }
.contact-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.contact-hero .hero-description { font-size: 0.85em; }
.contact-section { padding: 24px 10px; }
.info-card, .form-card { padding: 20px 12px; }
.info-card h2, .form-card h2 { font-size: 1.2em; }
.submit-button { width: 100%; padding: 12px 20px; }
}
</style>
</MainLayout>

File diff suppressed because it is too large Load diff

View file

@ -482,20 +482,41 @@ const stats = [
}
/* Responsive */
@media (max-width: 900px) {
@media (max-width: 1024px) {
.stats-section { grid-template-columns: repeat(2, 1fr); }
.pillars-grid { grid-template-columns: 1fr; }
.pillars-grid { grid-template-columns: 1fr 1fr; }
.partners-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.stats-section { grid-template-columns: 1fr; }
.hero-title { font-size: 2.5em; }
.node-map { transform: scale(0.8); }
@media (max-width: 768px) {
.stats-section, .pillars-grid, .partners-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.ecosystem-hero { padding: 40px 12px 32px 12px; }
.hero-title { font-size: 2em; letter-spacing: 2px; }
.hero-subtitle { font-size: 1em; }
.node-map { transform: scale(0.7); }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.pillar-card, .partner-card { padding: 24px 16px; }
.pillar-title { font-size: 1.2em; }
.pillar-description { font-size: 0.85em; }
.timeline::before { left: 20px; }
.timeline-item { flex-direction: column !important; text-align: left !important; }
.timeline-item .timeline-content { padding: 16px 0 16px 50px !important; margin: 0 !important; text-align: left !important; }
.timeline-marker { left: 20px; }
.partners-grid { grid-template-columns: 1fr; }
.cta-section h2 { font-size: 1.6em; }
.cta-section p { font-size: 0.9em; }
.cta-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.ecosystem-hero { padding: 24px 10px 20px 10px; }
.hero-title { font-size: 1.6em; letter-spacing: 1px; }
.hero-subtitle { font-size: 0.85em; }
.node-map { transform: scale(0.5); }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.pillar-card, .partner-card { padding: 20px 12px; }
.stat-number { font-size: 1.4em; }
.stat-label { font-size: 0.65em; }
.cta-section h2 { font-size: 1.3em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -938,49 +938,44 @@ const categoryColors: Record<string, string> = {
}
/* Responsive */
@media (max-width: 900px) {
.featured-event {
grid-template-columns: 1fr;
text-align: center;
}
.featured-meta, .featured-highlights {
justify-content: center;
}
.visual-placeholder {
width: 200px;
height: 200px;
font-size: 4em;
}
.past-events-grid {
grid-template-columns: 1fr;
max-width: 400px;
}
.speakers-grid {
grid-template-columns: repeat(2, 1fr);
}
.testimonials-grid {
grid-template-columns: 1fr;
max-width: 500px;
margin: 0 auto;
}
.sponsors-grid {
grid-template-columns: repeat(2, 1fr);
}
.resources-grid {
grid-template-columns: 1fr;
}
@media (max-width: 1024px) {
.featured-event { grid-template-columns: 1fr; text-align: center; }
.speakers-grid { grid-template-columns: repeat(2, 1fr); }
.sponsors-grid { grid-template-columns: repeat(2, 1fr); }
.past-events-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
.events-hero-title { font-size: 2.5em; }
.featured-title { font-size: 1.8em; }
.events-stats { gap: 30px; }
.stat-num { font-size: 2em; }
.speakers-grid {
grid-template-columns: 1fr;
}
.sponsors-grid {
grid-template-columns: 1fr;
}
@media (max-width: 768px) {
.featured-event { grid-template-columns: 1fr; text-align: center; }
.featured-meta, .featured-highlights { justify-content: center; }
.visual-placeholder { width: 160px; height: 160px; font-size: 3em; }
.events-hero { padding: 40px 12px 32px 12px; }
.events-hero-title { font-size: 2em; letter-spacing: 2px; }
.events-hero-subtitle { font-size: 1em; }
.events-stats { gap: 20px; }
.stat-num { font-size: 1.8em; }
.stat-text { font-size: 0.7em; }
.past-events-grid, .speakers-grid, .sponsors-grid, .testimonials-grid, .resources-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.featured-title { font-size: 1.4em; }
.featured-description { font-size: 0.9em; }
.cta-section h2 { font-size: 1.6em; }
.cta-section p { font-size: 0.9em; }
.cta-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.events-hero { padding: 24px 10px 20px 10px; }
.events-hero-title { font-size: 1.6em; letter-spacing: 1px; }
.events-hero-subtitle { font-size: 0.85em; }
.visual-placeholder { width: 120px; height: 120px; font-size: 2.5em; }
.events-stats { flex-direction: column; gap: 12px; }
.stat-num { font-size: 1.4em; }
.stat-text { font-size: 0.65em; }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.featured-title { font-size: 1.2em; }
.event-card, .speaker-card, .sponsor-card { padding: 16px 12px; }
.cta-section h2 { font-size: 1.3em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -131,9 +131,23 @@ const faqs = [
display: inline-block;
transition: background 0.2s, box-shadow 0.2s;
}
.cta-button:hover {
background: linear-gradient(90deg, #0055dd 0%, #003399 100%);
box-shadow: 0 4px 20px #0066ff44;
@media (max-width: 768px) {
.faq-hero { padding: 40px 12px 32px 12px; }
.faq-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.faq-hero .hero-desc { font-size: 1em; }
.faq-content { padding: 40px 12px; }
.faq-question { padding: 16px 18px; font-size: 1em; }
.faq-answer { padding: 0 18px 16px 18px; font-size: 0.9em; }
.cta-button { padding: 12px 24px; font-size: 0.95em; }
}
@media (max-width: 480px) {
.faq-hero { padding: 24px 10px 20px 10px; }
.faq-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.faq-hero .hero-desc { font-size: 0.85em; }
.faq-content { padding: 24px 10px; }
.faq-question { padding: 14px 14px; font-size: 0.9em; }
.faq-answer { padding: 0 14px 14px 14px; font-size: 0.85em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

File diff suppressed because it is too large Load diff

View file

@ -52,11 +52,11 @@ const stats = [
<div class="gf-hero-bg"></div>
<div class="gf-hero-scanlines"></div>
<div class="gf-hero-content">
<span class="gf-badge">AeThex Labs</span>
<span class="gf-badge">Labs Product • Game Development</span>
<h1 class="gf-hero-title">
<span class="gf-title-prefix">&gt;</span> GameForge
</h1>
<p class="gf-hero-desc">Terminal-inspired game development tools and community. Build, share, and play in the AeThex universe.</p>
<p class="gf-hero-desc">Terminal-inspired game development platform. Build, share, and play games on the AeThex ecosystem.</p>
<div class="gf-terminal">
<div class="terminal-header">
<span class="terminal-dot red"></span>
@ -467,16 +467,69 @@ room.<span class="method">on</span>(<span class="string">'player:join'</span>, (
/* Responsive */
@media (max-width: 1024px) {
.features-grid { grid-template-columns: 1fr 1fr; }
.gf-hero { padding: 60px 16px; min-height: auto; }
.gf-features { padding: 60px 16px; }
.gf-code { padding: 60px 16px; }
.gf-cta { padding: 60px 16px; }
}
@media (max-width: 768px) {
.gf-hero-title { font-size: 2.5em; }
.features-grid { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
.gf-stats .stats-grid { grid-template-columns: 1fr 1fr; }
.gf-hero { padding: 40px 12px; }
.gf-hero-title { font-size: 2.2em; }
.gf-hero-desc { font-size: 1em; margin-bottom: 24px; }
.gf-badge { font-size: 0.65em; padding: 5px 12px; }
.gf-terminal { max-width: 100%; margin: 0 0 24px 0; }
.terminal-body { padding: 14px; font-size: 0.8em; }
.gf-ctas { flex-direction: column; gap: 12px; }
.gf-button { width: 100%; text-align: center; padding: 14px 24px; font-size: 0.8em; }
.features-grid { grid-template-columns: 1fr; max-width: 100%; padding: 0; }
.gf-features { padding: 40px 12px; }
.feature-card { padding: 24px 20px; }
.feature-icon { font-size: 2em; margin-bottom: 14px; }
.feature-title { font-size: 1.15em; }
.feature-desc { font-size: 0.9em; }
.gf-stats { padding: 24px 12px; }
.gf-stats .stats-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
.stat-item .stat-value { font-size: 1.6em; }
.stat-item .stat-label { font-size: 0.7em; }
.gf-code { padding: 40px 12px; }
.code-block { padding: 20px 14px; border-radius: 10px; }
.code-block pre { font-size: 0.8em; line-height: 1.6; }
.section-header { margin-bottom: 32px; }
.section-eyebrow { font-size: 0.75em; letter-spacing: 2px; }
.section-title { font-size: 1.8em; }
.section-subtitle { font-size: 0.95em; }
.gf-cta { padding: 40px 12px; }
.gf-cta h2 { font-size: 1.8em; }
.gf-cta p { font-size: 0.95em; }
.gf-cta-buttons { flex-direction: column; gap: 12px; }
}
@media (max-width: 480px) {
.gf-hero-title { font-size: 2em; }
.section-title { font-size: 2em; }
.gf-stats .stats-grid { grid-template-columns: 1fr; }
.gf-hero { padding: 24px 10px; }
.gf-hero-title { font-size: 1.8em; }
.gf-hero-desc { font-size: 0.9em; }
.gf-badge { font-size: 0.6em; padding: 4px 10px; letter-spacing: 1px; }
.terminal-body { padding: 12px; font-size: 0.75em; line-height: 1.6; }
.gf-button { padding: 12px 20px; font-size: 0.75em; letter-spacing: 1px; }
.gf-features { padding: 24px 10px; }
.feature-card { padding: 20px 16px; border-radius: 12px; }
.feature-icon { font-size: 1.8em; margin-bottom: 10px; }
.feature-title { font-size: 1.1em; margin-bottom: 8px; }
.feature-desc { font-size: 0.85em; margin-bottom: 12px; }
.feature-details li { font-size: 0.8em; padding: 5px 0; }
.gf-stats { padding: 16px 10px; }
.gf-stats .stats-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.stat-item .stat-value { font-size: 1.4em; }
.stat-item .stat-label { font-size: 0.65em; }
.gf-code { padding: 24px 10px; }
.code-block { padding: 16px 12px; border-radius: 8px; overflow-x: auto; }
.code-block pre { font-size: 0.7em; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.section-header { margin-bottom: 24px; }
.section-eyebrow { font-size: 0.7em; letter-spacing: 1px; margin-bottom: 8px; }
.section-title { font-size: 1.4em; margin-bottom: 8px; }
.section-subtitle { font-size: 0.85em; }
.gf-cta { padding: 24px 10px; }
.gf-cta h2 { font-size: 1.4em; margin-bottom: 12px; }
.gf-cta p { font-size: 0.85em; margin-bottom: 20px; }
}
</style>
</MainLayout>

View file

@ -870,27 +870,54 @@ import PortalFooterBar from '../components/PortalFooterBar.astro';
.why-grid { grid-template-columns: 1fr 1fr; }
.testimonials-grid { grid-template-columns: 1fr 1fr; }
.hero-title { font-size: 3em; }
.hero { padding: 60px 16px 50px 16px; }
}
@media (max-width: 768px) {
.trinity-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; }
.trinity-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.products-grid { grid-template-columns: 1fr; }
.why-grid { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
.testimonials-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; }
.why-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.testimonials-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.flow-diagram { flex-direction: column; }
.flow-arrow { transform: rotate(90deg); }
.hero { padding: 80px 20px 60px 20px; min-height: auto; }
.hero-title { font-size: 2.4em; }
.hero-subtitle { font-size: 1.2em; }
.section-title { font-size: 2em; }
.cta-title { font-size: 2em; }
.hero { padding: 40px 12px 32px 12px; min-height: auto; }
.hero-title { font-size: 2em; letter-spacing: 2px; margin-bottom: 16px; }
.hero-subtitle { font-size: 1em; letter-spacing: 2px; margin-bottom: 12px; }
.hero-description { font-size: 0.9em; line-height: 1.6; margin-bottom: 24px; padding: 0 8px; }
.section-title { font-size: 1.6em; letter-spacing: 2px; }
.section-subtitle { font-size: 0.9em; }
.cta-title { font-size: 1.6em; }
.trinity-badge { gap: 8px; margin-bottom: 24px; }
.badge { padding: 8px 14px; font-size: 0.7em; letter-spacing: 1px; }
.cta-button { padding: 14px 28px; font-size: 0.85em; letter-spacing: 2px; }
.stats-grid { gap: 16px; }
.stat-item { padding: 20px 12px; }
.stat-value { font-size: 1.8em; }
.stat-label { font-size: 0.7em; }
.newsletter-section { padding: 40px 12px; }
.newsletter-form { gap: 12px; }
.newsletter-form input { padding: 14px 16px; font-size: 0.9em; }
.newsletter-form button { padding: 14px 24px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.stats-grid { grid-template-columns: 1fr; }
.hero-title { font-size: 2em; }
.trinity-badge { flex-direction: column; }
.badge { padding: 8px 16px; }
.stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.hero { padding: 24px 10px 20px 10px; }
.hero-title { font-size: 1.6em; letter-spacing: 1px; }
.hero-subtitle { font-size: 0.85em; letter-spacing: 1px; }
.hero-description { font-size: 0.85em; }
.trinity-badge { flex-direction: column; gap: 6px; }
.badge { padding: 6px 12px; font-size: 0.65em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; font-size: 0.8em; }
.section-title { font-size: 1.4em; letter-spacing: 1px; }
.section-subtitle { font-size: 0.8em; }
.stat-item { padding: 16px 10px; }
.stat-value { font-size: 1.4em; }
.stat-label { font-size: 0.65em; }
.newsletter-section { padding: 24px 10px; }
.newsletter-form { flex-direction: column; }
.newsletter-form input { width: 100%; }
.newsletter-form input { width: 100%; padding: 12px 14px; }
.newsletter-form button { width: 100%; padding: 12px 20px; }
.newsletter-note { font-size: 0.75em; }
.cta-title { font-size: 1.3em; }
}
</style>
<PortalFooterBar />

View file

@ -1,49 +1,49 @@
---
// Labs Division Page
// Labs Division Page - The Grid Platform
import MainLayout from '../layouts/MainLayout.astro';
const projects = [
const bounties = [
{
name: 'Nexus Engine v2.0',
status: 'In Development',
completion: 65,
description: 'Next-generation game engine with real-time collaboration and cloud-native architecture.',
tech: ['Rust', 'WebGPU', 'WASM']
name: 'UI Component Library',
reward: '$500',
difficulty: 'Intermediate',
description: 'Build reusable React components for the AeThex design system.',
skills: ['React', 'TypeScript', 'CSS']
},
{
name: 'AI Copilot Assistant',
status: 'Beta Testing',
completion: 80,
description: 'Intelligent assistant for code generation, debugging, and game design suggestions.',
tech: ['Python', 'LLMs', 'RAG']
name: 'API Documentation',
reward: '$300',
difficulty: 'Beginner',
description: 'Write comprehensive docs for the Platform API endpoints.',
skills: ['Technical Writing', 'Markdown', 'API']
},
{
name: 'Quantum Sync Protocol',
status: 'Research',
completion: 25,
description: 'Experimental low-latency networking protocol for seamless multiplayer experiences.',
tech: ['C++', 'QUIC', 'WebRTC']
name: 'Performance Optimization',
reward: '$800',
difficulty: 'Advanced',
description: 'Optimize rendering performance for the dashboard application.',
skills: ['React', 'Performance', 'Profiling']
},
{
name: 'Neural Asset Generator',
status: 'Alpha',
completion: 45,
description: 'AI-powered 3D asset generation from text descriptions and sketches.',
tech: ['PyTorch', 'Diffusion', '3D Gen']
name: 'Mobile App Feature',
reward: '$600',
difficulty: 'Intermediate',
description: 'Implement push notifications for the mobile companion app.',
skills: ['React Native', 'Firebase', 'Mobile']
}
];
const stats = [
{ label: 'Active Projects', value: '12', icon: '📊', color: '#00ffff' },
{ label: 'Team Members', value: '28', icon: '👥', color: '#ff00ff' },
{ label: 'Beta Testers', value: '2.4K', icon: '🧪', color: '#ffff00' },
{ label: 'Experiments', value: '156', icon: '⚗️', color: '#ff4500' }
{ label: 'Active Bounties', value: '48', icon: '💰', color: '#EAB308' },
{ label: 'Creators', value: '2.4K', icon: '👥', color: '#22c55e' },
{ label: 'Shipped Projects', value: '850+', icon: '🚀', color: '#3b82f6' },
{ label: 'Total Rewards', value: '$125K', icon: '⭐', color: '#f97316' }
];
const quickActions = [
{ label: 'Submit Proposal', icon: '📝' },
{ label: 'Join Beta Program', icon: '🚀' },
{ label: 'View Documentation', icon: '📚' }
{ label: 'Browse Bounties', icon: '💰' },
{ label: 'Create Profile', icon: '👤' },
{ label: 'View Leaderboard', icon: '🏆' }
];
---
<MainLayout>
@ -56,12 +56,12 @@ const quickActions = [
<img src="/labs-logo.svg" alt="Labs Logo" class="entity-logo" />
<h1 class="entity-title animated">
<span class="terminal-prefix">&gt;</span>
<span class="fade-in">AeThex Labs</span>
<span class="fade-in">The Grid</span>
<span class="cursor">_</span>
</h1>
<p class="entity-desc fade-in-delay">Research & Development • Experimental • Bleeding Edge</p>
<p class="terminal-status">System status: <span class="status-online">All modules operational</span>. Ready for deployment.</p>
<a href="#projects" class="cta-btn">Explore R&D Projects</a>
<p class="entity-desc fade-in-delay">Ship Code • Earn Rewards • Build Your Reputation</p>
<p class="terminal-status">Platform status: <span class="status-online">48 bounties available</span>. Join the creator community.</p>
<a href="#bounties" class="cta-btn">Explore Bounties</a>
</div>
</section>
@ -83,26 +83,25 @@ const quickActions = [
<!-- Main Content Grid -->
<section class="labs-content">
<div class="content-grid">
<!-- Projects Panel -->
<div class="panel projects-panel" id="projects">
<!-- Bounties Panel -->
<div class="panel projects-panel" id="bounties">
<div class="panel-header">
<h2><span class="prompt">&gt;</span> Active R&D Projects</h2>
<h2><span class="prompt">&gt;</span> Available Bounties</h2>
</div>
<div class="projects-list">
{projects.map(project => (
{bounties.map(bounty => (
<div class="project-card">
<div class="project-header">
<h3 class="project-name">{project.name}</h3>
<span class={`project-status ${project.status.toLowerCase().replace(' ', '-')}`}>{project.status}</span>
<h3 class="project-name">{bounty.name}</h3>
<span class={`project-status ${bounty.difficulty.toLowerCase()}`}>{bounty.reward}</span>
</div>
<p class="project-desc">{project.description}</p>
<div class="progress-bar">
<div class="progress-fill" style={`width: ${project.completion}%`}></div>
<span class="progress-text">{project.completion}%</span>
<p class="project-desc">{bounty.description}</p>
<div class="bounty-difficulty">
<span class={`difficulty-badge ${bounty.difficulty.toLowerCase()}`}>{bounty.difficulty}</span>
</div>
<div class="project-tech">
{project.tech.map(t => (
<span class="tech-tag">{t}</span>
{bounty.skills.map(skill => (
<span class="tech-tag">{skill}</span>
))}
</div>
</div>
@ -131,13 +130,13 @@ const quickActions = [
<span class="terminal-dot red"></span>
<span class="terminal-dot yellow"></span>
<span class="terminal-dot green"></span>
<span class="terminal-title">labs-terminal</span>
<span class="terminal-title">grid-terminal</span>
</div>
<div class="terminal-body">
<p><span class="prompt">$</span> labs status --all</p>
<p class="output">✓ 4 active projects</p>
<p class="output">✓ 3 pending reviews</p>
<p class="output">✓ 28 contributors online</p>
<p><span class="prompt">$</span> grid bounties --available</p>
<p class="output">✓ 48 open bounties</p>
<p class="output">✓ $12.5K total rewards</p>
<p class="output">✓ 156 creators active</p>
<p><span class="prompt">$</span> <span class="cursor-blink">_</span></p>
</div>
</div>
@ -148,27 +147,27 @@ const quickActions = [
<!-- About Labs -->
<section class="about-section">
<div class="glass-card">
<h2><span class="prompt">&gt;</span> About Labs Division</h2>
<h2><span class="prompt">&gt;</span> About The Grid</h2>
<p class="about-text">
AeThex Labs is our innovation engine — pushing boundaries with experimental features,
beta technologies, and next-generation metaverse infrastructure. We operate at the
bleeding edge, transforming ambitious ideas into production-ready solutions.
The Grid is the creator platform where builders ship code, claim bounties, and grow their reputation.
Collaborate with the community, earn rewards for your contributions, and build your portfolio
as part of the AeThex ecosystem.
</p>
<div class="focus-areas">
<div class="focus-item">
<span class="focus-icon">🔬</span>
<h4>Research</h4>
<p>Exploring emerging technologies and their applications in the metaverse</p>
<span class="focus-icon">💰</span>
<h4>Bounties</h4>
<p>Claim tasks, ship code, earn rewards for your contributions</p>
</div>
<div class="focus-item">
<span class="focus-icon">🧪</span>
<h4>Experimentation</h4>
<p>Rapid prototyping and validation of new concepts and architectures</p>
<span class="focus-icon"></span>
<h4>Reputation</h4>
<p>Build your creator profile with verified achievements and XP</p>
</div>
<div class="focus-item">
<span class="focus-icon">🚀</span>
<h4>Incubation</h4>
<p>Nurturing promising projects from idea to production deployment</p>
<span class="focus-icon">🤝</span>
<h4>Collaborate</h4>
<p>Connect with creators worldwide and build together</p>
</div>
</div>
</div>
@ -177,10 +176,10 @@ const quickActions = [
<style>
/* ========== LABS PAGE STYLES ========== */
:root {
--labs-primary: #ffa500;
--labs-secondary: #ffd580;
--labs-primary: #EAB308;
--labs-secondary: #fde047;
--labs-dark: #0a0a0a;
--labs-glow: #ffa50080;
--labs-glow: #EAB30880;
}
.entity-page.labs {
@ -437,6 +436,35 @@ const quickActions = [
background: rgba(255, 100, 100, 0.2);
color: #ff6464;
}
.project-status.beginner,
.project-status.intermediate,
.project-status.advanced {
background: rgba(234, 179, 8, 0.2);
color: #EAB308;
}
.bounty-difficulty {
margin-bottom: 12px;
}
.difficulty-badge {
font-size: 0.75em;
padding: 4px 10px;
border-radius: 4px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 600;
}
.difficulty-badge.beginner {
background: rgba(34, 197, 94, 0.2);
color: #22c55e;
}
.difficulty-badge.intermediate {
background: rgba(234, 179, 8, 0.2);
color: #EAB308;
}
.difficulty-badge.advanced {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.project-desc {
color: #888;
font-size: 0.9em;
@ -665,17 +693,95 @@ const quickActions = [
.focus-areas {
grid-template-columns: 1fr;
}
.hero-banner { padding: 60px 16px; min-height: auto; }
.labs-content { padding: 24px 16px; }
.stats-section { padding: 24px 16px; }
.about-section { padding: 40px 16px; }
}
@media (max-width: 600px) {
.entity-title {
font-size: 2.2em;
}
.stats-grid {
grid-template-columns: 1fr;
}
.glass-card {
padding: 28px 20px;
}
@media (max-width: 768px) {
.hero-banner { padding: 40px 12px; }
.entity-title { font-size: 2.2em; }
.entity-desc { font-size: 1em; }
.terminal-status { font-size: 0.8em; margin-bottom: 20px; }
.cta-btn { padding: 12px 24px; font-size: 0.9em; }
.entity-logo { width: 60px; height: 60px; margin-bottom: 16px; }
.stats-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.stat-card { padding: 16px; gap: 12px; }
.stat-icon { font-size: 1.5em; }
.stat-value { font-size: 1.4em; }
.stat-label { font-size: 0.7em; }
.labs-content { padding: 20px 12px; }
.panel { border-radius: 12px; }
.panel-header { padding: 12px 16px; }
.panel-header h2 { font-size: 1em; }
.projects-list { padding: 12px; gap: 12px; }
.project-card { padding: 16px; border-radius: 10px; }
.project-name { font-size: 1em; }
.project-status { font-size: 0.65em; padding: 3px 8px; }
.project-desc { font-size: 0.85em; margin-bottom: 10px; }
.tech-tag { font-size: 0.7em; padding: 3px 8px; }
.actions-list { padding: 12px; gap: 10px; }
.action-button { padding: 12px 14px; }
.action-icon { font-size: 1em; }
.action-label { font-size: 0.9em; }
.terminal-widget { margin: 12px; }
.terminal-body { padding: 12px; font-size: 0.8em; }
.about-section { padding: 32px 12px; }
.glass-card { padding: 24px 16px; border-radius: 16px; }
.glass-card h2 { font-size: 1.4em; margin-bottom: 16px; }
.about-text { font-size: 0.95em; margin-bottom: 24px; }
.focus-item { padding: 20px 16px; border-radius: 12px; }
.focus-icon { font-size: 2em; margin-bottom: 10px; }
.focus-item h4 { font-size: 1em; }
.focus-item p { font-size: 0.85em; }
.glass-footer { margin: 32px 12px 0 12px; padding: 16px 20px; font-size: 0.95em; gap: 12px; }
}
@media (max-width: 480px) {
.hero-banner { padding: 24px 10px; }
.entity-title { font-size: 1.8em; letter-spacing: 1px; }
.entity-desc { font-size: 0.9em; }
.terminal-status { font-size: 0.75em; }
.cta-btn { padding: 10px 20px; font-size: 0.85em; width: 100%; max-width: 220px; }
.entity-logo { width: 48px; height: 48px; margin-bottom: 12px; }
.stats-section { padding: 16px 10px; }
.stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.stat-card { padding: 14px 12px; border-radius: 10px; }
.stat-icon { font-size: 1.3em; }
.stat-value { font-size: 1.2em; }
.stat-label { font-size: 0.65em; }
.labs-content { padding: 16px 10px; }
.panel { border-radius: 10px; }
.panel-header { padding: 10px 14px; }
.panel-header h2 { font-size: 0.9em; }
.projects-list { padding: 10px; gap: 10px; }
.project-card { padding: 14px 12px; border-radius: 8px; }
.project-header { flex-direction: column; align-items: flex-start; gap: 6px; }
.project-name { font-size: 0.95em; }
.project-status { font-size: 0.6em; }
.project-desc { font-size: 0.8em; line-height: 1.4; }
.bounty-difficulty { margin-bottom: 8px; }
.difficulty-badge { font-size: 0.65em; padding: 3px 8px; }
.project-tech { gap: 6px; }
.tech-tag { font-size: 0.65em; padding: 2px 6px; }
.actions-list { padding: 10px; gap: 8px; }
.action-button { padding: 10px 12px; border-radius: 6px; }
.action-icon { font-size: 0.9em; }
.action-label { font-size: 0.85em; }
.terminal-widget { margin: 10px; border-radius: 6px; }
.terminal-header { padding: 6px 10px; }
.terminal-dot { width: 8px; height: 8px; }
.terminal-title { font-size: 0.7em; }
.terminal-body { padding: 10px; font-size: 0.75em; line-height: 1.6; }
.about-section { padding: 20px 10px; }
.glass-card { padding: 20px 14px; border-radius: 12px; }
.glass-card h2 { font-size: 1.2em; margin-bottom: 12px; }
.about-text { font-size: 0.85em; line-height: 1.6; margin-bottom: 20px; }
.focus-areas { gap: 12px; }
.focus-item { padding: 16px 14px; border-radius: 10px; }
.focus-icon { font-size: 1.6em; margin-bottom: 8px; }
.focus-item h4 { font-size: 0.95em; margin-bottom: 6px; }
.focus-item p { font-size: 0.8em; }
.glass-footer { margin: 24px 10px 0 10px; padding: 14px 16px; font-size: 0.85em; gap: 10px; border-radius: 12px 12px 0 0; }
}
</style>
</main>

View file

@ -207,12 +207,22 @@ const lastUpdated = new Date().toLocaleDateString('en-US', { year: 'numeric', mo
}
@media (max-width: 768px) {
.privacy-hero .hero-title {
font-size: 2em;
}
.privacy-content {
padding: 40px 16px 60px 16px;
}
.privacy-hero { padding: 40px 12px 32px 12px; }
.privacy-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.privacy-hero .hero-subtitle { font-size: 0.95em; }
.privacy-content { padding: 40px 12px 50px 12px; }
.section-title { font-size: 1.4em; letter-spacing: 1px; }
.section-content { font-size: 0.9em; }
.contact-link { padding: 12px 24px; font-size: 0.9em; }
}
@media (max-width: 480px) {
.privacy-hero { padding: 24px 10px 20px 10px; }
.privacy-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.privacy-hero .hero-subtitle { font-size: 0.85em; }
.privacy-content { padding: 24px 10px 40px 10px; }
.section-title { font-size: 1.2em; }
.section-content { font-size: 0.85em; }
.contact-link { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -376,16 +376,39 @@ const stats = [
.cta-button:hover { transform: translateY(-2px); }
/* Responsive */
@media (max-width: 900px) {
@media (max-width: 1024px) {
.products-grid { grid-template-columns: repeat(2, 1fr); }
.stats-bar { gap: 30px; flex-wrap: wrap; }
.stats-bar { gap: 24px; flex-wrap: wrap; }
}
@media (max-width: 600px) {
.products-grid { grid-template-columns: 1fr; }
.hero-title { font-size: 2.5em; }
.hero-actions { flex-direction: column; align-items: center; }
.enterprise-cta { padding: 40px 20px; }
@media (max-width: 768px) {
.products-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.products-hero { padding: 40px 12px 32px 12px; }
.hero-title { font-size: 2em; letter-spacing: 2px; }
.hero-subtitle { font-size: 1em; }
.hero-actions { flex-direction: column; align-items: center; gap: 12px; }
.stats-bar { gap: 16px; }
.stat-value { font-size: 1.8em; }
.stat-label { font-size: 0.7em; }
.product-card { padding: 24px 16px; }
.product-title { font-size: 1.2em; }
.product-description { font-size: 0.85em; }
.enterprise-cta { padding: 40px 16px; }
.enterprise-cta h2 { font-size: 1.6em; }
.enterprise-cta p { font-size: 0.9em; }
.cta-features { flex-direction: column; gap: 8px; }
.cta-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.products-hero { padding: 24px 10px 20px 10px; }
.hero-title { font-size: 1.6em; letter-spacing: 1px; }
.hero-subtitle { font-size: 0.85em; }
.product-card { padding: 20px 12px; }
.product-title { font-size: 1.1em; }
.stat-value { font-size: 1.4em; }
.stat-label { font-size: 0.65em; }
.enterprise-cta { padding: 24px 12px; }
.enterprise-cta h2 { font-size: 1.3em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -325,10 +325,36 @@ const getDeptColor = (dept: string) => {
background: rgba(255, 255, 255, 0.1);
}
@media (max-width: 1024px) {
.team-grid { grid-template-columns: repeat(2, 1fr); }
.leadership-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
.team-hero .hero-title {
font-size: 2.5em;
}
.team-hero { padding: 40px 12px 32px 12px; }
.team-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.team-hero .hero-description { font-size: 0.95em; }
.team-grid, .leadership-grid { grid-template-columns: 1fr; max-width: 100%; margin: 0 auto; }
.section-header h2 { font-size: 1.6em; letter-spacing: 2px; }
.section-header p { font-size: 0.9em; }
.member-card, .leader-card { padding: 24px 16px; }
.member-name, .leader-name { font-size: 1.2em; }
.member-role, .leader-role { font-size: 0.85em; }
.join-cta { padding: 40px 12px; }
.join-cta h2 { font-size: 1.6em; }
.join-cta p { font-size: 0.95em; }
.cta-buttons { flex-direction: column; gap: 12px; }
.cta-button { padding: 14px 28px; font-size: 0.85em; }
}
@media (max-width: 480px) {
.team-hero { padding: 24px 10px 20px 10px; }
.team-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.team-hero .hero-description { font-size: 0.85em; }
.section-header h2 { font-size: 1.3em; letter-spacing: 1px; }
.member-card, .leader-card { padding: 20px 12px; }
.member-name, .leader-name { font-size: 1.1em; }
.join-cta { padding: 24px 10px; }
.join-cta h2 { font-size: 1.3em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>

View file

@ -295,16 +295,23 @@ const lastUpdated = new Date().toLocaleDateString('en-US', { year: 'numeric', mo
}
@media (max-width: 768px) {
.terms-hero .hero-title {
font-size: 2em;
}
.terms-content {
padding: 40px 16px 60px 16px;
}
.warning-box, .nda-box, .highlight-box {
flex-direction: column;
gap: 12px;
}
.terms-hero { padding: 40px 12px 32px 12px; }
.terms-hero .hero-title { font-size: 2em; letter-spacing: 2px; }
.terms-hero .hero-subtitle { font-size: 0.95em; }
.terms-content { padding: 40px 12px 50px 12px; }
.section-title { font-size: 1.4em; letter-spacing: 1px; }
.section-content { font-size: 0.9em; }
.warning-box, .nda-box, .highlight-box { flex-direction: column; gap: 12px; }
.cta-button { padding: 12px 24px; font-size: 0.9em; }
}
@media (max-width: 480px) {
.terms-hero { padding: 24px 10px 20px 10px; }
.terms-hero .hero-title { font-size: 1.6em; letter-spacing: 1px; }
.terms-hero .hero-subtitle { font-size: 0.85em; }
.terms-content { padding: 24px 10px 40px 10px; }
.section-title { font-size: 1.2em; }
.section-content { font-size: 0.85em; }
.cta-button { width: 100%; max-width: 260px; padding: 12px 20px; }
}
</style>
</MainLayout>