new file: public/partner2-logo.svg
140
.github/copilot-instructions.md
vendored
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
||||
|
|
|
|||
|
|
@ -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 |
|
|
@ -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
|
|
@ -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
|
|
@ -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
|
|
@ -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
|
|
@ -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
|
|
@ -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 |
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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">></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>
|
||||
|
|
|
|||
|
|
@ -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 />
|
||||
|
|
|
|||
|
|
@ -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">></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">></span> Active R&D Projects</h2>
|
||||
<h2><span class="prompt">></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">></span> About Labs Division</h2>
|
||||
<h2><span class="prompt">></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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||