Merge pull request #316 from alirezarezvani/feat/google-workspace-cli

Feat/google workspace cli
This commit is contained in:
Alireza Rezvani
2026-03-11 11:58:13 +01:00
committed by GitHub
7 changed files with 897 additions and 37 deletions

View File

@@ -2,12 +2,12 @@
**173 production-ready skills and plugins for Claude Code, OpenAI Codex, Gemini CLI, and OpenClaw** — reusable expertise bundles that transform AI coding agents into specialized professionals across engineering, product, marketing, compliance, and more.
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![Skills](https://img.shields.io/badge/Skills-173-brightgreen.svg)](#skills-overview)
[![Agents](https://img.shields.io/badge/Agents-15-blue.svg)](#agents)
[![Commands](https://img.shields.io/badge/Commands-15-orange.svg)](#commands)
[![Stars](https://img.shields.io/github/stars/alirezarezvani/claude-skills?style=flat)](https://github.com/alirezarezvani/claude-skills/stargazers)
[![SkillCheck Validated](https://img.shields.io/badge/SkillCheck-Validated-4c1)](https://getskillcheck.com)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow?style=for-the-badge)](https://opensource.org/licenses/MIT)
[![Skills](https://img.shields.io/badge/Skills-173-brightgreen?style=for-the-badge)](#skills-overview)
[![Agents](https://img.shields.io/badge/Agents-15-blue?style=for-the-badge)](#agents)
[![Commands](https://img.shields.io/badge/Commands-15-orange?style=for-the-badge)](#commands)
[![Stars](https://img.shields.io/github/stars/alirezarezvani/claude-skills?style=for-the-badge)](https://github.com/alirezarezvani/claude-skills/stargazers)
[![SkillCheck Validated](https://img.shields.io/badge/SkillCheck-Validated-4c1?style=for-the-badge)](https://getskillcheck.com)
> ⭐ **2,500+ GitHub stars** — the most comprehensive open-source skill library for AI coding agents.

19
docs/overrides/404.html Normal file
View File

@@ -0,0 +1,19 @@
{% extends "main.html" %}
{% block content %}
<div style="text-align: center; padding: 4rem 1rem;">
<h1 style="font-size: 6rem; font-weight: 800; margin-bottom: 0.5rem; opacity: 0.15; line-height: 1;">404</h1>
<p style="font-size: 1.1rem; margin-bottom: 0.5rem; font-weight: 600;">
Page not found
</p>
<p style="font-size: 0.9rem; opacity: 0.6; margin-bottom: 2rem;">
The page you're looking for doesn't exist or has been moved.
</p>
<a href="{{ config.site_url }}" class="md-button md-button--primary">
Back to Home
</a>
<a href="{{ config.site_url }}skills/" class="md-button">
Browse Skills
</a>
</div>
{% endblock %}

View File

@@ -9,4 +9,55 @@
gtag('js', new Date());
gtag('config', 'G-VHRY2VKY9K');
</script>
{% if page and page.meta %}
<!-- Open Graph -->
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ page.meta.title or page.title }} - {{ config.site_name }}" />
<meta property="og:description" content="{{ page.meta.description or config.site_description }}" />
<meta property="og:url" content="{{ page.canonical_url }}" />
<meta property="og:site_name" content="{{ config.site_name }}" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="{{ page.meta.title or page.title }} - {{ config.site_name }}" />
<meta name="twitter:description" content="{{ page.meta.description or config.site_description }}" />
<meta name="twitter:site" content="@nginitycloud" />
{% endif %}
<!-- JSON-LD Structured Data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "{{ config.site_name }}",
"url": "{{ config.site_url }}",
"description": "{{ config.site_description }}",
"author": {
"@type": "Person",
"name": "{{ config.site_author }}"
}
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "Claude Code Skills",
"applicationCategory": "DeveloperApplication",
"operatingSystem": "Cross-platform",
"description": "{{ config.site_description }}",
"url": "{{ config.site_url }}",
"author": {
"@type": "Person",
"name": "{{ config.site_author }}"
},
"license": "https://opensource.org/licenses/MIT",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
}
}
</script>
{% endblock %}

View File

@@ -0,0 +1,3 @@
<a href="https://github.com/alirezarezvani/claude-skills/releases/tag/v2.1.2">
<strong>v2.1.2</strong> — 173 skills across 9 domains. Landing page generator now outputs Next.js TSX + Tailwind CSS!
</a>

438
docs/skills/index.md Normal file
View File

@@ -0,0 +1,438 @@
---
title: "Skills Overview"
description: "Browse all 173 production-ready skills across 9 domains — engineering, product, marketing, C-level advisory, project management, regulatory, business growth, and finance."
hide:
- edit
---
<div class="skills-hero" markdown>
# Skills Library
Browse 173 production-ready skills across 9 domains.
{ .skills-hero-sub }
</div>
<div class="grid cards" markdown>
- :material-counter:{ .lg .middle } **173 Skills**
---
Across 9 professional domains
- :material-language-python:{ .lg .middle } **250 Tools**
---
Python CLI tools, all stdlib-only
- :material-package-variant-closed:{ .lg .middle } **19 Plugins**
---
Install bundles or individual skills
- :material-devices:{ .lg .middle } **4 Platforms**
---
Claude Code, Codex, Gemini, OpenClaw
</div>
## Quick Install
=== "Claude Code"
```bash
# Add the marketplace
/plugin marketplace add alirezarezvani/claude-skills
# Install any skill bundle
/plugin install engineering-skills@claude-code-skills
/plugin install marketing-skills@claude-code-skills
/plugin install c-level-skills@claude-code-skills
```
=== "Gemini CLI"
```bash
git clone https://github.com/alirezarezvani/claude-skills.git
cd claude-skills && python3 scripts/sync-gemini-skills.py
```
=== "OpenAI Codex"
```bash
git clone https://github.com/alirezarezvani/claude-skills.git
cd claude-skills && python3 scripts/sync-codex-skills.py
```
=== "OpenClaw"
```bash
git clone https://github.com/alirezarezvani/claude-skills.git
cd claude-skills && bash scripts/openclaw-install.sh
```
[Full Install Guide :octicons-arrow-right-24:](../getting-started.md){ .md-button .md-button--primary }
[GitHub :fontawesome-brands-github:](https://github.com/alirezarezvani/claude-skills){ .md-button }
---
## Architecture
Every skill follows the same self-contained package pattern — no cross-dependencies, no external APIs, no setup required:
```mermaid
graph LR
A["SKILL.md<br/><small>Instructions + Workflows</small>"] --> D["Agent uses skill"]
B["scripts/<br/><small>Python CLI tools</small>"] --> D
C["references/<br/><small>Expert knowledge</small>"] --> D
E["assets/<br/><small>Templates + configs</small>"] --> D
D --> F["Specialized output"]
style A fill:#7c3aed,color:#fff,stroke:none
style B fill:#c026d3,color:#fff,stroke:none
style C fill:#d97706,color:#fff,stroke:none
style E fill:#059669,color:#fff,stroke:none
style D fill:#2563eb,color:#fff,stroke:none
style F fill:#475569,color:#fff,stroke:none
```
---
## Domains at a Glance
<div class="grid cards" markdown>
- :material-cog:{ .lg .middle } **Engineering — Core** <span class="skill-count">24</span>
---
Full-stack engineering team: architecture, frontend, backend, DevOps, security, AI/ML, data, QA, plus Playwright testing, self-improving agent, Google Workspace CLI, and Stripe integration.
**30+ Python tools** | 3 sub-skill trees
[:octicons-arrow-right-24: Browse skills](engineering-team/){ .md-button .md-button--primary }
- :material-lightning-bolt:{ .lg .middle } **Engineering — POWERFUL** <span class="skill-count">25</span>
---
Advanced engineering capabilities: agent designer, RAG architect, MCP server builder, CI/CD pipelines, database design, observability, security auditing, release management.
**Platform-level tools** for building infrastructure
[:octicons-arrow-right-24: Browse skills](engineering/){ .md-button .md-button--primary }
- :material-bullhorn:{ .lg .middle } **Marketing** <span class="skill-count">43</span>
---
Complete marketing division across 7 specialist pods — content, SEO, CRO, channels, growth hacking, intelligence, and sales enablement. Plus X/Twitter growth tools.
**32 Python tools** | Foundation context system
[:octicons-arrow-right-24: Browse skills](marketing-skill/){ .md-button .md-button--primary }
- :material-star-circle:{ .lg .middle } **C-Level Advisory** <span class="skill-count">28</span>
---
Virtual board of directors: CEO, CTO, COO, CPO, CMO, CFO, CRO, CISO, CHRO. Board meeting orchestration, decision logger, scenario war room, M&A playbook, culture frameworks.
**10 executive roles** | Strategic alignment engine
[:octicons-arrow-right-24: Browse skills](c-level-advisor/){ .md-button .md-button--primary }
- :material-bullseye-arrow:{ .lg .middle } **Product** <span class="skill-count">8</span>
---
Product manager toolkit (RICE scoring, PRDs), agile product owner, strategist, UX researcher, UI design system, competitive teardown, landing page generator, SaaS scaffolder.
**9 Python tools** | Next.js TSX + Tailwind output
[:octicons-arrow-right-24: Browse skills](product-team/){ .md-button .md-button--primary }
- :material-clipboard-check:{ .lg .middle } **Project Management** <span class="skill-count">6</span>
---
Senior PM, scrum master, Jira expert, Confluence expert, Atlassian admin, and template creator. Live MCP integration for Jira/Confluence automation.
**12 Python tools** | Atlassian MCP integration
[:octicons-arrow-right-24: Browse skills](project-management/){ .md-button .md-button--primary }
- :material-shield-check:{ .lg .middle } **Regulatory & Quality** <span class="skill-count">12</span>
---
HealthTech/MedTech compliance: ISO 13485 QMS, MDR 2017/745, FDA 510(k)/PMA, ISO 27001 ISMS, GDPR/DSGVO, CAPA management, risk management (ISO 14971), clinical evaluation.
**Enterprise compliance** | Audit-ready documentation
[:octicons-arrow-right-24: Browse skills](ra-qm-team/){ .md-button .md-button--primary }
- :material-trending-up:{ .lg .middle } **Business & Growth** <span class="skill-count">4</span>
---
Customer success manager with health scoring and churn prediction, sales engineer with RFP analysis, revenue operations with pipeline metrics, contract & proposal writer.
**9 Python tools** | GTM strategy support
[:octicons-arrow-right-24: Browse skills](business-growth/){ .md-button .md-button--primary }
- :material-currency-usd:{ .lg .middle } **Finance** <span class="skill-count">2</span>
---
Financial analyst (ratio analysis, DCF valuation, budgeting, forecasting) and SaaS metrics coach (ARR, MRR, churn, CAC, LTV, NRR, Quick Ratio, projections).
**7 Python tools** | Industry benchmarks built-in
[:octicons-arrow-right-24: Browse skills](finance/){ .md-button .md-button--primary }
</div>
---
## Skills by Category
=== ":material-cog: Engineering"
**49 skills** across Core and POWERFUL tiers.
??? note "Core Engineering (24 skills)"
| Skill | Focus |
|-------|-------|
| [Senior Architect](engineering-team/senior-architect.md) | System design, trade-offs, ADRs |
| [Senior Frontend](engineering-team/senior-frontend.md) | React, Next.js, performance |
| [Senior Backend](engineering-team/senior-backend.md) | Node.js, APIs, databases |
| [Senior Fullstack](engineering-team/senior-fullstack.md) | End-to-end development |
| [Senior QA](engineering-team/senior-qa.md) | Test strategy, automation |
| [Senior DevOps](engineering-team/senior-devops.md) | CI/CD, infrastructure |
| [Senior SecOps](engineering-team/senior-secops.md) | Security operations |
| [Senior Security](engineering-team/senior-security.md) | AppSec, vulnerability assessment |
| [Senior ML Engineer](engineering-team/senior-ml-engineer.md) | Model deployment, MLOps |
| [Senior Data Scientist](engineering-team/senior-data-scientist.md) | Statistics, experiments |
| [Senior Data Engineer](engineering-team/senior-data-engineer.md) | Pipelines, ETL, data quality |
| [Senior Prompt Engineer](engineering-team/senior-prompt-engineer.md) | Prompt optimization, RAG |
| [Senior Computer Vision](engineering-team/senior-computer-vision.md) | Object detection, segmentation |
| [Code Reviewer](engineering-team/code-reviewer.md) | Code quality analysis |
| [AWS Solution Architect](engineering-team/aws-solution-architect.md) | Serverless, IaC, cost optimization |
| [MS365 Tenant Manager](engineering-team/ms365-tenant-manager.md) | Microsoft 365 administration |
| [Google Workspace CLI](engineering-team/google-workspace-cli.md) | Gmail, Drive, Sheets via gws CLI |
| [Stripe Integration](engineering-team/stripe-integration-expert.md) | Payments, subscriptions |
| [TDD Guide](engineering-team/tdd-guide.md) | Test-driven development |
| [Tech Stack Evaluator](engineering-team/tech-stack-evaluator.md) | Technology selection |
| [Playwright Pro](engineering-team/playwright-pro.md) | E2E testing (9 sub-skills) |
| [Self-Improving Agent](engineering-team/self-improving-agent.md) | Memory curation (5 sub-skills) |
| [Email Template Builder](engineering-team/email-template-builder.md) | HTML email templates |
| [Incident Commander](engineering-team/incident-commander.md) | Incident response |
??? note "POWERFUL Engineering (25 skills)"
| Skill | Focus |
|-------|-------|
| [Agent Designer](engineering/agent-designer.md) | Multi-agent system architecture |
| [Agent Workflow Designer](engineering/agent-workflow-designer.md) | Agent orchestration patterns |
| [RAG Architect](engineering/rag-architect.md) | Retrieval-augmented generation |
| [MCP Server Builder](engineering/mcp-server-builder.md) | Model Context Protocol servers |
| [Database Designer](engineering/database-designer.md) | Schema design, optimization |
| [Database Schema Designer](engineering/database-schema-designer.md) | ERD, migrations |
| [CI/CD Pipeline Builder](engineering/ci-cd-pipeline-builder.md) | GitHub Actions, GitLab CI |
| [Migration Architect](engineering/migration-architect.md) | System migration planning |
| [Observability Designer](engineering/observability-designer.md) | Monitoring, tracing, alerting |
| [Performance Profiler](engineering/performance-profiler.md) | Bottleneck analysis |
| [Skill Security Auditor](engineering/skill-security-auditor.md) | Vulnerability scanning |
| [Release Manager](engineering/release-manager.md) | Release orchestration |
| [Dependency Auditor](engineering/dependency-auditor.md) | Supply chain security |
| [API Design Reviewer](engineering/api-design-reviewer.md) | REST/GraphQL review |
| [API Test Suite Builder](engineering/api-test-suite-builder.md) | API test generation |
| [PR Review Expert](engineering/pr-review-expert.md) | Pull request analysis |
| [Tech Debt Tracker](engineering/tech-debt-tracker.md) | Debt scoring, prioritization |
| [Changelog Generator](engineering/changelog-generator.md) | Keep a Changelog format |
| [Codebase Onboarding](engineering/codebase-onboarding.md) | New developer guides |
| [Runbook Generator](engineering/runbook-generator.md) | Operations documentation |
| [Git Worktree Manager](engineering/git-worktree-manager.md) | Parallel development |
| [Monorepo Navigator](engineering/monorepo-navigator.md) | Monorepo workflows |
| [Env & Secrets Manager](engineering/env-secrets-manager.md) | Configuration management |
| [Interview System Designer](engineering/interview-system-designer.md) | Technical interviews |
| [Skill Tester](engineering/skill-tester.md) | Skill quality validation |
=== ":material-bullhorn: Marketing"
**43 skills** across 7 specialist pods.
??? note "Content & Copy (8 skills)"
| Skill | Focus |
|-------|-------|
| [Content Creator](marketing-skill/content-creator.md) | SEO-optimized content |
| [Copywriting](marketing-skill/copywriting.md) | Conversion copy frameworks |
| [Brand Voice Analyzer](marketing-skill/brand-voice-analyzer.md) | Voice consistency |
| [Content Repurposer](marketing-skill/content-repurposer.md) | Multi-format adaptation |
| [Content Strategy](marketing-skill/content-strategy.md) | Editorial calendars |
| [Blog Post Creator](marketing-skill/blog-post-creator.md) | Long-form content |
| [Ad Creative](marketing-skill/ad-creative.md) | Ad copy and creative |
| [Email Template Builder](marketing-skill/email-template-builder.md) | Email campaigns |
??? note "SEO & Analytics (7 skills)"
| Skill | Focus |
|-------|-------|
| [SEO Audit](marketing-skill/seo-audit.md) | Technical SEO analysis |
| [AI SEO](marketing-skill/ai-seo.md) | AI-optimized search |
| [App Store Optimization](marketing-skill/app-store-optimization.md) | ASO strategy |
| [Keyword Research](marketing-skill/keyword-research.md) | Keyword analysis |
| [Analytics Tracking](marketing-skill/analytics-tracking.md) | Tag management |
| [Marketing Analytics](marketing-skill/marketing-analytics.md) | Campaign metrics |
| [A/B Test Setup](marketing-skill/ab-test-setup.md) | Experiment design |
??? note "Growth, Channels & More (28 skills)"
Includes CRO, demand generation, social media, paid ads, PR, partnerships, competitive intelligence, sales enablement, X/Twitter growth, and more. [Browse all marketing skills :octicons-arrow-right-24:](marketing-skill/)
=== ":material-star-circle: C-Level"
**28 skills** — 10 executive roles plus orchestration and strategic tools.
??? note "Executive Roles (10)"
| Role | Focus |
|------|-------|
| [CEO Advisor](c-level-advisor/ceo-advisor.md) | Vision, fundraising, product-market fit |
| [CTO Advisor](c-level-advisor/cto-advisor.md) | Architecture, tech debt, build vs buy |
| [COO Advisor](c-level-advisor/coo-advisor.md) | Operations, scaling, process |
| [CPO Advisor](c-level-advisor/cpo-advisor.md) | Product strategy, roadmaps |
| [CMO Advisor](c-level-advisor/cmo-advisor.md) | Brand, GTM, demand generation |
| [CFO Advisor](c-level-advisor/cfo-advisor.md) | Finance, burn rate, fundraising |
| [CRO Advisor](c-level-advisor/cro-advisor.md) | Revenue, sales, pipeline |
| [CISO Advisor](c-level-advisor/ciso-advisor.md) | Security, compliance, risk |
| [CHRO Advisor](c-level-advisor/chro-advisor.md) | People, culture, org design |
| [Executive Mentor](c-level-advisor/executive-mentor.md) | Coaching (5 sub-skills) |
??? note "Orchestration & Strategy (18)"
Board meetings, Chief of Staff, decision logger, board deck builder, scenario war room, competitive intelligence, M&A playbook, culture architect, founder coach, and more. [Browse all C-level skills :octicons-arrow-right-24:](c-level-advisor/)
=== ":material-bullseye-arrow: Product & PM"
**14 skills** across Product and Project Management.
| Skill | Domain | Focus |
|-------|--------|-------|
| [Product Manager Toolkit](product-team/product-manager-toolkit.md) | Product | RICE scoring, PRDs, roadmaps |
| [Agile Product Owner](product-team/agile-product-owner.md) | Product | Backlog, sprints, user stories |
| [Product Strategist](product-team/product-strategist.md) | Product | OKRs, market analysis |
| [UX Researcher](product-team/ux-researcher-designer.md) | Product | User research, design |
| [UI Design System](product-team/ui-design-system.md) | Product | Component libraries |
| [Competitive Teardown](product-team/competitive-teardown.md) | Product | Feature comparison |
| [Landing Page Generator](product-team/landing-page-generator.md) | Product | Next.js TSX + Tailwind |
| [SaaS Scaffolder](product-team/saas-scaffolder.md) | Product | Full SaaS boilerplate |
| [Senior PM](project-management/senior-pm.md) | PM | Portfolio management |
| [Scrum Master](project-management/scrum-master.md) | PM | Sprint facilitation |
| [Jira Expert](project-management/jira-expert.md) | PM | JQL, workflows |
| [Confluence Expert](project-management/confluence-expert.md) | PM | Documentation |
| [Atlassian Admin](project-management/atlassian-admin.md) | PM | Platform administration |
| [Template Creator](project-management/atlassian-templates.md) | PM | Reusable templates |
=== ":material-shield-check: Compliance & Finance"
**14 skills** for regulated industries and financial analysis.
??? note "Regulatory & Quality (12 skills)"
| Skill | Standard |
|-------|----------|
| [ISO 13485 QMS](ra-qm-team/iso-13485-qms-expert.md) | Quality Management System |
| [MDR Expert](ra-qm-team/mdr-expert.md) | EU MDR 2017/745 |
| [FDA Consultant](ra-qm-team/fda-consultant-specialist.md) | 510(k), PMA submissions |
| [GDPR/DSGVO Expert](ra-qm-team/gdpr-dsgvo-expert.md) | Data protection |
| [ISO 27001 ISMS](ra-qm-team/information-security-manager-iso27001.md) | Information security |
| [ISMS Audit Expert](ra-qm-team/isms-audit-expert.md) | Security auditing |
| [CAPA Officer](ra-qm-team/capa-officer.md) | Corrective actions |
| [Risk Manager](ra-qm-team/risk-manager-iso14971.md) | ISO 14971 |
| [Clinical Evaluation](ra-qm-team/clinical-evaluation-expert.md) | CER, PMCF |
| [QMS Auditor](ra-qm-team/qms-auditor.md) | Internal audits |
| [Document Control](ra-qm-team/document-control-expert.md) | SOP management |
| [Regulatory Strategy](ra-qm-team/regulatory-strategy-expert.md) | Market access |
??? note "Finance (2 skills)"
| Skill | Focus |
|-------|-------|
| [Financial Analyst](finance/financial-analyst.md) | DCF valuation, ratio analysis, budgeting, forecasting |
| [SaaS Metrics Coach](finance/saas-metrics-coach.md) | ARR, MRR, churn, CAC, LTV, NRR, Quick Ratio |
??? note "Business & Growth (4 skills)"
| Skill | Focus |
|-------|-------|
| [Customer Success Manager](business-growth/customer-success-manager.md) | Health scoring, churn prediction |
| [Sales Engineer](business-growth/sales-engineer.md) | RFP analysis, demo prep |
| [Revenue Operations](business-growth/revenue-operations.md) | Pipeline metrics, GTM |
| [Contract & Proposal Writer](business-growth/contract-and-proposal-writer.md) | SOWs, proposals |
---
## Python Tools Distribution
```mermaid
pie title 250 Python Tools by Domain
"Marketing" : 32
"Engineering Core" : 30
"Engineering POWERFUL" : 25
"Project Management" : 12
"Product" : 9
"Business & Growth" : 9
"Finance" : 7
"Other" : 126
```
!!! tip "All tools are stdlib-only"
Every Python script uses only the standard library — zero `pip install` required. All 250 tools are verified passing `--help`. Scripts support both human-readable and `--json` output for automation.
---
## How Skills Work
<div class="grid cards" markdown>
- :material-numeric-1-circle:{ .lg .middle } **Install**
---
Add a skill bundle or individual skill via the plugin marketplace.
```bash
/plugin install engineering-skills@claude-code-skills
```
- :material-numeric-2-circle:{ .lg .middle } **Trigger**
---
Skills activate automatically when your prompt matches their domain — or invoke directly.
- :material-numeric-3-circle:{ .lg .middle } **Execute**
---
The agent follows SKILL.md workflows, runs Python tools for analysis, and references expert knowledge bases.
- :material-numeric-4-circle:{ .lg .middle } **Output**
---
Get structured, actionable results — reports, code, configurations, strategies, or documentation.
</div>

View File

@@ -1,9 +1,297 @@
/* ============================================
Claude Code Skills — Custom Theme
Minimal overrides on Material's native grid
Claude Code Skills — GitHub Primer Theme
MkDocs Material custom properties override
============================================ */
/* --- Hero Section --- */
/* ===========================================
A. Light Mode — GitHub Primer Light
=========================================== */
[data-md-color-scheme="default"] {
--md-primary-fg-color: #0969da;
--md-primary-fg-color--light: #218bff;
--md-primary-fg-color--dark: #0550ae;
--md-primary-bg-color: #ffffff;
--md-primary-bg-color--light: #f6f8fa;
--md-accent-fg-color: #0969da;
--md-accent-fg-color--transparent: rgba(9, 105, 218, 0.1);
--md-default-fg-color: #1f2328;
--md-default-fg-color--light: #656d76;
--md-default-fg-color--lighter: #8b949e;
--md-default-fg-color--lightest: rgba(31, 35, 40, 0.12);
--md-default-bg-color: #ffffff;
--md-default-bg-color--light: #f6f8fa;
--md-default-bg-color--lighter: #f6f8fa;
--md-default-bg-color--lightest: #eaeef2;
--md-code-fg-color: #1f2328;
--md-code-bg-color: #f6f8fa;
--md-code-hl-color: rgba(9, 105, 218, 0.1);
--md-typeset-color: #1f2328;
--md-typeset-a-color: #0969da;
--md-footer-fg-color: #f0f6fc;
--md-footer-fg-color--light: rgba(240, 246, 252, 0.7);
--md-footer-fg-color--lighter: rgba(240, 246, 252, 0.4);
--md-footer-bg-color: #24292f;
--md-footer-bg-color--dark: #1c2128;
}
/* ===========================================
B. Dark Mode — GitHub Primer Dark
=========================================== */
[data-md-color-scheme="slate"] {
--md-hue: 210;
--md-primary-fg-color: #1f6feb;
--md-primary-fg-color--light: #388bfd;
--md-primary-fg-color--dark: #1158c7;
--md-primary-bg-color: #0d1117;
--md-primary-bg-color--light: #161b22;
--md-accent-fg-color: #58a6ff;
--md-accent-fg-color--transparent: rgba(31, 111, 235, 0.15);
--md-default-fg-color: #f0f6fc;
--md-default-fg-color--light: #c9d1d9;
--md-default-fg-color--lighter: #8b949e;
--md-default-fg-color--lightest: rgba(240, 246, 252, 0.1);
--md-default-bg-color: #0d1117;
--md-default-bg-color--light: #161b22;
--md-default-bg-color--lighter: #161b22;
--md-default-bg-color--lightest: #21262d;
--md-code-fg-color: #c9d1d9;
--md-code-bg-color: #161b22;
--md-code-hl-color: rgba(31, 111, 235, 0.15);
--md-typeset-color: #f0f6fc;
--md-typeset-a-color: #58a6ff;
--md-footer-fg-color: #f0f6fc;
--md-footer-fg-color--light: rgba(240, 246, 252, 0.7);
--md-footer-fg-color--lighter: rgba(240, 246, 252, 0.4);
--md-footer-bg-color: #010409;
--md-footer-bg-color--dark: #010409;
}
/* ===========================================
C. Header & Navigation Bar
=========================================== */
.md-header {
border-bottom: 1px solid var(--md-default-fg-color--lightest);
box-shadow: none;
}
[data-md-color-scheme="default"] .md-header {
background-color: #ffffff;
color: #1f2328;
}
[data-md-color-scheme="slate"] .md-header {
background-color: #161b22;
}
/* Header title color fix */
[data-md-color-scheme="default"] .md-header .md-header__title {
color: #1f2328;
}
/* Header icons */
[data-md-color-scheme="default"] .md-header .md-icon {
color: #656d76;
}
/* Tab bar */
.md-tabs {
border-bottom: 1px solid var(--md-default-fg-color--lightest);
}
[data-md-color-scheme="default"] .md-tabs {
background-color: #ffffff;
}
[data-md-color-scheme="slate"] .md-tabs {
background-color: #0d1117;
}
.md-tabs__link {
font-weight: 500;
font-size: 0.8rem;
opacity: 0.7;
transition: opacity 0.15s ease;
}
.md-tabs__link:hover,
.md-tabs__link--active {
opacity: 1;
}
/* ===========================================
D. Sidebar Navigation
=========================================== */
.md-nav {
font-size: 0.78rem;
line-height: 1.5;
}
.md-nav__item {
padding: 0;
}
.md-nav__link {
padding: 0.35rem 0.75rem;
border-radius: 6px;
margin: 1px 4px;
font-weight: 400;
transition: background-color 0.15s ease;
}
.md-nav__link:hover {
background-color: var(--md-accent-fg-color--transparent);
}
.md-nav__link--active,
.md-nav__item .md-nav__link--active {
font-weight: 600;
color: var(--md-accent-fg-color);
background-color: var(--md-accent-fg-color--transparent);
}
/* Section labels in sidebar */
.md-nav__item--nested > .md-nav__link {
font-weight: 600;
font-size: 0.72rem;
letter-spacing: 0.03em;
opacity: 0.8;
}
/* Sidebar scrollbar */
.md-sidebar__scrollwrap::-webkit-scrollbar {
width: 4px;
}
.md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
background-color: var(--md-default-fg-color--lightest);
border-radius: 4px;
}
/* ===========================================
E. Buttons — GitHub-style
=========================================== */
.md-typeset .md-button--primary {
background-color: var(--md-primary-fg-color);
color: #ffffff !important;
border: 1px solid var(--md-primary-fg-color);
border-radius: 6px;
padding: 0.5rem 1.25rem;
font-weight: 500;
font-size: 0.82rem;
transition: background-color 0.15s ease, border-color 0.15s ease;
box-shadow: none;
}
.md-typeset .md-button--primary:hover {
background-color: var(--md-primary-fg-color--dark);
border-color: var(--md-primary-fg-color--dark);
color: #ffffff !important;
}
/* Outline / secondary button */
.md-typeset .md-button:not(.md-button--primary) {
color: var(--md-primary-fg-color);
border: 1px solid var(--md-default-fg-color--lightest);
border-radius: 6px;
padding: 0.5rem 1.25rem;
font-weight: 500;
font-size: 0.82rem;
background-color: transparent;
transition: background-color 0.15s ease, border-color 0.15s ease;
box-shadow: none;
}
.md-typeset .md-button:not(.md-button--primary):hover {
background-color: var(--md-accent-fg-color--transparent);
border-color: var(--md-primary-fg-color);
}
/* ===========================================
F. Grid Cards
=========================================== */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid.cards > ol > li,
.md-typeset .grid > .card {
border: 1px solid var(--md-default-fg-color--lightest);
border-radius: 6px;
box-shadow: none;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid.cards > ol > li:hover,
.md-typeset .grid > .card:hover {
border-color: var(--md-default-fg-color--lighter);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
[data-md-color-scheme="slate"] .md-typeset .grid.cards > ul > li:hover,
[data-md-color-scheme="slate"] .md-typeset .grid.cards > ol > li:hover {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
/* ===========================================
G. Code Blocks
=========================================== */
.md-typeset code {
border-radius: 6px;
border: 1px solid var(--md-default-fg-color--lightest);
padding: 0.1em 0.35em;
font-size: 0.85em;
}
.md-typeset pre {
border-radius: 6px;
border: 1px solid var(--md-default-fg-color--lightest);
}
.md-typeset pre > code {
border: none;
padding: 0;
}
/* ===========================================
H. Tables
=========================================== */
.md-typeset table:not([class]) {
border: 1px solid var(--md-default-fg-color--lightest);
border-radius: 6px;
border-collapse: separate;
border-spacing: 0;
overflow: hidden;
}
.md-typeset table:not([class]) th {
background-color: var(--md-default-bg-color--light);
font-weight: 600;
font-size: 0.78rem;
border-bottom: 1px solid var(--md-default-fg-color--lightest);
}
.md-typeset table:not([class]) td {
border-top: 1px solid var(--md-default-fg-color--lightest);
}
/* ===========================================
I. Admonitions
=========================================== */
.md-typeset .admonition,
.md-typeset details {
border-radius: 6px;
box-shadow: none;
}
/* ===========================================
J. Hero Section
=========================================== */
.hero {
text-align: center;
padding: 2.5rem 1rem 1rem;
@@ -17,14 +305,14 @@
letter-spacing: -0.03em;
line-height: 1.15;
margin-bottom: 0.75rem !important;
background: linear-gradient(135deg, #a78bfa 0%, #e879f9 50%, #f59e0b 100%);
background: linear-gradient(135deg, #58a6ff 0%, #1f6feb 50%, #388bfd 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
[data-md-color-scheme="default"] .hero h1 {
background: linear-gradient(135deg, #7c3aed 0%, #c026d3 50%, #d97706 100%);
background: linear-gradient(135deg, #0550ae 0%, #0969da 50%, #218bff 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
@@ -47,28 +335,56 @@
margin: 0.25rem;
}
/* --- Tighter grid card spacing --- */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid.cards > ol > li,
.md-typeset .grid > .card {
border-radius: 10px;
/* Skills page hero */
.skills-hero {
text-align: center;
padding: 2rem 1rem 0.5rem;
max-width: 700px;
margin: 0 auto;
}
/* --- Section dividers --- */
.md-typeset hr {
border-color: var(--md-default-fg-color--lightest);
.skills-hero h1 {
font-size: 2.2rem !important;
font-weight: 800 !important;
letter-spacing: -0.03em;
line-height: 1.15;
margin-bottom: 0.5rem !important;
background: linear-gradient(135deg, #58a6ff 0%, #1f6feb 50%, #388bfd 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
/* --- Code block polish --- */
.md-typeset code {
border-radius: 6px;
[data-md-color-scheme="default"] .skills-hero h1 {
background: linear-gradient(135deg, #0550ae 0%, #0969da 50%, #218bff 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.md-typeset pre {
border-radius: 8px;
.skills-hero-sub {
font-size: 1.05rem;
opacity: 0.6;
max-width: 520px;
margin: 0 auto 1.5rem;
}
/* --- Typography --- */
/* Skill count badge */
.skill-count {
display: inline-block;
background: var(--md-primary-fg-color);
color: #ffffff;
font-size: 0.7rem;
font-weight: 700;
padding: 0.15rem 0.5rem;
border-radius: 999px;
vertical-align: middle;
margin-left: 0.35rem;
}
/* ===========================================
K. Typography
=========================================== */
.md-typeset {
font-size: 0.82rem;
line-height: 1.7;
@@ -79,7 +395,37 @@
letter-spacing: -0.01em;
}
/* --- Mobile --- */
/* ===========================================
L. Section Dividers
=========================================== */
.md-typeset hr {
border-color: var(--md-default-fg-color--lightest);
}
/* ===========================================
M. Search Dialog
=========================================== */
[data-md-color-scheme="default"] .md-search__form {
background-color: #f6f8fa;
border: 1px solid var(--md-default-fg-color--lightest);
}
/* ===========================================
N. Announcement Bar
=========================================== */
.md-banner {
background-color: var(--md-primary-fg-color);
color: #ffffff;
font-size: 0.78rem;
}
.md-banner a {
color: #ffffff;
}
/* ===========================================
O. Mobile Responsive
=========================================== */
@media (max-width: 768px) {
.hero h1 {
font-size: 1.8rem !important;
@@ -88,4 +434,8 @@
.hero-subtitle {
font-size: 0.95rem;
}
.skills-hero h1 {
font-size: 1.8rem !important;
}
}

View File

@@ -11,20 +11,18 @@ theme:
name: material
custom_dir: docs/overrides
palette:
- media: "(prefers-color-scheme)"
scheme: slate
primary: deep purple
accent: deep purple
toggle:
icon: material/brightness-4
name: Switch to light mode
- media: "(prefers-color-scheme: light)"
scheme: default
primary: deep purple
accent: deep purple
- scheme: default
primary: custom
accent: custom
toggle:
icon: material/brightness-7
name: Switch to dark mode
- scheme: slate
primary: custom
accent: custom
toggle:
icon: material/brightness-4
name: Switch to light mode
font:
text: Inter
code: JetBrains Mono
@@ -118,6 +116,7 @@ nav:
- Home: index.md
- Getting Started: getting-started.md
- Skills:
- Overview: skills/index.md
- Engineering - Core:
- Overview: skills/engineering-team/index.md
- "AWS Solution Architect": skills/engineering-team/aws-solution-architect.md