From e23607fffc17e952c375d3f08702d9e06e95f586 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Vitor=20R=2E=20da=20Silva?= Date: Wed, 2 Sep 2026 16:59:12 -0300 Subject: [PATCH 1/4] feat(website): customizar tema com nova paleta de cores, barra de busca e modernizar documentacao --- website/docs/quickstart.md | 103 ++++ website/docusaurus.config.ts | 47 +- website/package-lock.json | 516 ++++++++++++++++++ website/package.json | 1 + website/sidebars.ts | 76 ++- .../src/components/HomepageFeatures/index.tsx | 82 ++- .../HomepageFeatures/styles.module.css | 96 +++- website/src/css/custom.css | 256 ++++++++- website/src/pages/index.module.css | 199 ++++++- website/src/pages/index.tsx | 110 ++-- website/static/img/logo.svg | 38 +- 11 files changed, 1395 insertions(+), 129 deletions(-) create mode 100644 website/docs/quickstart.md diff --git a/website/docs/quickstart.md b/website/docs/quickstart.md new file mode 100644 index 0000000..3928e5e --- /dev/null +++ b/website/docs/quickstart.md @@ -0,0 +1,103 @@ +--- +sidebar_position: 3 +title: Início Rápido +--- + +# Início Rápido (Quickstart) + +Aprenda a instalar, executar sua primeira varredura e proteger seu repositório Git com o **`envguard`** em menos de 3 minutos. + +--- + +## 1. Instalação Instantânea + +Se você possui o Go instalado (1.22+): + +```bash +go install github.com/joaooncode/envguard/cmd/envguard@latest +``` + +Ou no Windows com PowerShell: + +```powershell +# Verifique a versão instalada +envguard version +``` + +> Para binários pré-compilados do Linux, macOS e Windows sem Go, consulte o [Guia de Instalação](./installation.md). + +--- + +## 2. Execute sua Primeira Varredura + +Navegue até a raiz do seu projeto com Git e execute o comando `scan`: + +```bash +envguard scan +``` + +O `envguard` varrerá todos os arquivos e diretórios recursivamente, identificando arquivos de ambiente e cruzando o status com o Git e o `.gitignore`. + +### Exemplo de Saída: + +```text +[envguard] Iniciando varredura no repositório... + +✗ .env CRITICAL Arquivo rastreado no Git (commitado) +⚠ .env.production WARNING Não ignorado no .gitignore +✓ .env.example INFO Template padrão identificado + +Status: 2 problema(s) encontrado(s). +``` + +--- + +## 3. Gerar Arquivo de Configuração + +Inicialize um arquivo `.envguard.yaml` para customizar permissões e regras do projeto: + +```bash +envguard init +``` + +Isso gerará o arquivo de configuração `.envguard.yaml` na raiz do repositório: + +```yaml +version: 1 +patterns: + - ".env*" +ignore: + - ".env.example" + - ".env.template" +fail_on: "warning" # Interrompe a execução com warning ou critical +``` + +--- + +## 4. Corrigir Problemas Automaticamente + +Se o `envguard` detectar arquivos `.env` soltos que precisam ser adicionados ao `.gitignore` ou removidos do tracking do Git: + +```bash +envguard fix +``` + +--- + +## 5. Instalar Git Hook Automático (Pre-Commit) + +Garanta que nenhum arquivo de ambiente seja commitado por acidente instalando o hook nativo: + +```bash +envguard hook install +``` + +Pronto! Toda vez que alguém executar `git commit`, o `envguard check` será executado automaticamente antes do commit ser gravado. + +--- + +## Próximos Passos + +- Explore todos os [Comandos da CLI](./commands/scan.md). +- Entenda a classificação dos [Níveis de Severidade](./severity-levels.md). +- Configure a integração com [GitHub Actions e CI/CD](./cicd-integration.md). diff --git a/website/docusaurus.config.ts b/website/docusaurus.config.ts index 882ff27..1e1ca0a 100644 --- a/website/docusaurus.config.ts +++ b/website/docusaurus.config.ts @@ -44,9 +44,27 @@ const config: Config = { ], ], + themes: [ + [ + require.resolve('@easyops-cn/docusaurus-search-local'), + { + hashed: true, + language: ['en'], + indexDocs: true, + indexBlog: true, + indexPages: true, + docsRouteBasePath: '/docs', + highlightSearchTermsOnTargetPage: true, + searchResultLimits: 8, + searchResultContextMaxLength: 60, + }, + ], + ], + themeConfig: { image: 'img/docusaurus-social-card.jpg', colorMode: { + defaultMode: 'dark', respectPrefersColorScheme: true, }, navbar: { @@ -58,11 +76,12 @@ const config: Config = { items: [ { type: 'docSidebar', - sidebarId: 'tutorialSidebar', + sidebarId: 'docsSidebar', position: 'left', label: 'Documentação', }, - { to: '/blog', label: 'Blog / Notas de Versão', position: 'left' }, + { to: '/docs/quickstart', label: 'Início Rápido', position: 'left' }, + { to: '/blog', label: 'Blog & Versões', position: 'left' }, { href: 'https://github.com/joaooncode/envguard', label: 'GitHub', @@ -74,29 +93,29 @@ const config: Config = { style: 'dark', links: [ { - title: 'Documentação', + title: 'Começando', items: [ { label: 'Visão Geral', to: '/docs/intro' }, { label: 'Instalação', to: '/docs/installation' }, - { label: 'Comandos CLI', to: '/docs/commands/scan' }, - { label: 'Níveis de Severidade', to: '/docs/severity-levels' }, + { label: 'Início Rápido', to: '/docs/quickstart' }, ], }, { - title: 'Integrações', + title: 'Comandos & Regras', items: [ - { label: 'CI/CD & Git Hooks', to: '/docs/cicd-integration' }, - { label: 'Guia de Contribuição', to: '/docs/contributing' }, + { label: 'Varredura (scan)', to: '/docs/commands/scan' }, + { label: 'Verificação (check)', to: '/docs/commands/check' }, + { label: 'Níveis de Severidade', to: '/docs/severity-levels' }, + { label: 'Configuração (.envguard.yaml)', to: '/docs/configuration' }, ], }, { - title: 'Comunidade', + title: 'Automação & Comunidade', items: [ - { label: 'Repositório GitHub', href: 'https://github.com/joaooncode/envguard' }, - { - label: 'Reportar Problema (Issue)', - href: 'https://github.com/joaooncode/envguard/issues', - }, + { label: 'CI/CD & Git Hooks', to: '/docs/cicd-integration' }, + { label: 'Guia de Contribuição', to: '/docs/contributing' }, + { label: 'GitHub Repository', href: 'https://github.com/joaooncode/envguard' }, + { label: 'Reportar Problema', href: 'https://github.com/joaooncode/envguard/issues' }, ], }, ], diff --git a/website/package-lock.json b/website/package-lock.json index 6d9fc6e..f6d10d6 100644 --- a/website/package-lock.json +++ b/website/package-lock.json @@ -11,6 +11,7 @@ "@docusaurus/core": "3.10.2", "@docusaurus/faster": "3.10.2", "@docusaurus/preset-classic": "3.10.2", + "@easyops-cn/docusaurus-search-local": "^0.55.3", "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", "prism-react-renderer": "^2.3.0", @@ -4148,6 +4149,125 @@ "node": ">=20.0" } }, + "node_modules/@easyops-cn/autocomplete.js": { + "version": "0.38.1", + "resolved": "https://registry.npmjs.org/@easyops-cn/autocomplete.js/-/autocomplete.js-0.38.1.tgz", + "integrity": "sha512-drg76jS6syilOUmVNkyo1c7ZEBPcPuK+aJA7AksM5ZIIbV57DMHCywiCr+uHyv8BE5jUTU98j/H7gVrkHrWW3Q==", + "license": "MIT", + "dependencies": { + "cssesc": "^3.0.0", + "immediate": "^3.2.3" + } + }, + "node_modules/@easyops-cn/docusaurus-search-local": { + "version": "0.55.3", + "resolved": "https://registry.npmjs.org/@easyops-cn/docusaurus-search-local/-/docusaurus-search-local-0.55.3.tgz", + "integrity": "sha512-PlMKmxuonvZ1C+/zJS1hJaF1xaxD1TsUvOMzpP6DdQMtZqmTaYjcLGM12ePzl0m1rp3AgfTBeDbFNHQhwnH/dA==", + "license": "MIT", + "dependencies": { + "@docusaurus/plugin-content-docs": "^2 || ^3", + "@docusaurus/theme-translations": "^2 || ^3", + "@docusaurus/utils": "^2 || ^3", + "@docusaurus/utils-common": "^2 || ^3", + "@docusaurus/utils-validation": "^2 || ^3", + "@easyops-cn/autocomplete.js": "^0.38.1", + "@node-rs/jieba": "^1.6.0", + "cheerio": "^1.0.0", + "clsx": "^2.1.1", + "comlink": "^4.4.2", + "debug": "^4.2.0", + "fs-extra": "^10.0.0", + "klaw-sync": "^6.0.0", + "lunr": "^2.3.9", + "lunr-languages": "^1.4.0", + "mark.js": "^8.11.1", + "tslib": "^2.4.0" + }, + "engines": { + "node": ">=12" + }, + "peerDependencies": { + "@docusaurus/theme-common": "^2 || ^3", + "open-ask-ai": "^0.7.3", + "react": "^16.14.0 || ^17 || ^18 || ^19", + "react-dom": "^16.14.0 || 17 || ^18 || ^19" + }, + "peerDependenciesMeta": { + "open-ask-ai": { + "optional": true + } + } + }, + "node_modules/@easyops-cn/docusaurus-search-local/node_modules/cheerio": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.2.0.tgz", + "integrity": "sha512-WDrybc/gKFpTYQutKIK6UvfcuxijIZfMfXaYm8NMsPQxSYvf+13fXUJ4rztGGbJcBQ/GF55gvrZ0Bc0bj/mqvg==", + "license": "MIT", + "dependencies": { + "cheerio-select": "^2.1.0", + "dom-serializer": "^2.0.0", + "domhandler": "^5.0.3", + "domutils": "^3.2.2", + "encoding-sniffer": "^0.2.1", + "htmlparser2": "^10.1.0", + "parse5": "^7.3.0", + "parse5-htmlparser2-tree-adapter": "^7.1.0", + "parse5-parser-stream": "^7.1.2", + "undici": "^7.19.0", + "whatwg-mimetype": "^4.0.0" + }, + "engines": { + "node": ">=20.18.1" + }, + "funding": { + "url": "https://github.com/cheeriojs/cheerio?sponsor=1" + } + }, + "node_modules/@easyops-cn/docusaurus-search-local/node_modules/entities": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/entities/-/entities-7.0.1.tgz", + "integrity": "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==", + "license": "BSD-2-Clause", + "engines": { + "node": ">=0.12" + }, + "funding": { + "url": "https://github.com/fb55/entities?sponsor=1" + } + }, + "node_modules/@easyops-cn/docusaurus-search-local/node_modules/fs-extra": { + "version": "10.1.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz", + "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==", + "license": "MIT", + "dependencies": { + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@easyops-cn/docusaurus-search-local/node_modules/htmlparser2": { + "version": "10.1.0", + "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-10.1.0.tgz", + "integrity": "sha512-VTZkM9GWRAtEpveh7MSF6SjjrpNVNNVJfFup7xTY3UpFtm67foy9HDVXneLtFVt4pMz5kZtgNcvCniNFb1hlEQ==", + "funding": [ + "https://github.com/fb55/htmlparser2?sponsor=1", + { + "type": "github", + "url": "https://github.com/sponsors/fb55" + } + ], + "license": "MIT", + "dependencies": { + "domelementtype": "^2.3.0", + "domhandler": "^5.0.3", + "domutils": "^3.2.2", + "entities": "^7.0.1" + } + }, "node_modules/@emnapi/core": { "version": "1.11.3", "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.11.3.tgz", @@ -4825,6 +4945,283 @@ "url": "https://paulmillr.com/funding/" } }, + "node_modules/@node-rs/jieba": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba/-/jieba-1.10.4.tgz", + "integrity": "sha512-GvDgi8MnBiyWd6tksojej8anIx18244NmIOc1ovEw8WKNUejcccLfyu8vj66LWSuoZuKILVtNsOy4jvg3aoxIw==", + "license": "MIT", + "engines": { + "node": ">= 10" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/Brooooooklyn" + }, + "optionalDependencies": { + "@node-rs/jieba-android-arm-eabi": "1.10.4", + "@node-rs/jieba-android-arm64": "1.10.4", + "@node-rs/jieba-darwin-arm64": "1.10.4", + "@node-rs/jieba-darwin-x64": "1.10.4", + "@node-rs/jieba-freebsd-x64": "1.10.4", + "@node-rs/jieba-linux-arm-gnueabihf": "1.10.4", + "@node-rs/jieba-linux-arm64-gnu": "1.10.4", + "@node-rs/jieba-linux-arm64-musl": "1.10.4", + "@node-rs/jieba-linux-x64-gnu": "1.10.4", + "@node-rs/jieba-linux-x64-musl": "1.10.4", + "@node-rs/jieba-wasm32-wasi": "1.10.4", + "@node-rs/jieba-win32-arm64-msvc": "1.10.4", + "@node-rs/jieba-win32-ia32-msvc": "1.10.4", + "@node-rs/jieba-win32-x64-msvc": "1.10.4" + } + }, + "node_modules/@node-rs/jieba-android-arm-eabi": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-android-arm-eabi/-/jieba-android-arm-eabi-1.10.4.tgz", + "integrity": "sha512-MhyvW5N3Fwcp385d0rxbCWH42kqDBatQTyP8XbnYbju2+0BO/eTeCCLYj7Agws4pwxn2LtdldXRSKavT7WdzNA==", + "cpu": [ + "arm" + ], + "license": "MIT", + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-android-arm64": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-android-arm64/-/jieba-android-arm64-1.10.4.tgz", + "integrity": "sha512-XyDwq5+rQ+Tk55A+FGi6PtJbzf974oqnpyCcCPzwU3QVXJCa2Rr4Lci+fx8oOpU4plT3GuD+chXMYLsXipMgJA==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-darwin-arm64": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-darwin-arm64/-/jieba-darwin-arm64-1.10.4.tgz", + "integrity": "sha512-G++RYEJ2jo0rxF9626KUy90wp06TRUjAsvY/BrIzEOX/ingQYV/HjwQzNPRR1P1o32a6/U8RGo7zEBhfdybL6w==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-darwin-x64": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-darwin-x64/-/jieba-darwin-x64-1.10.4.tgz", + "integrity": "sha512-MmDNeOb2TXIZCPyWCi2upQnZpPjAxw5ZGEj6R8kNsPXVFALHIKMa6ZZ15LCOkSTsKXVC17j2t4h+hSuyYb6qfQ==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-freebsd-x64": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-freebsd-x64/-/jieba-freebsd-x64-1.10.4.tgz", + "integrity": "sha512-/x7aVQ8nqUWhpXU92RZqd333cq639i/olNpd9Z5hdlyyV5/B65LLy+Je2B2bfs62PVVm5QXRpeBcZqaHelp/bg==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-linux-arm-gnueabihf": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-linux-arm-gnueabihf/-/jieba-linux-arm-gnueabihf-1.10.4.tgz", + "integrity": "sha512-crd2M35oJBRLkoESs0O6QO3BBbhpv+tqXuKsqhIG94B1d02RVxtRIvSDwO33QurxqSdvN9IeSnVpHbDGkuXm3g==", + "cpu": [ + "arm" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-linux-arm64-gnu": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-linux-arm64-gnu/-/jieba-linux-arm64-gnu-1.10.4.tgz", + "integrity": "sha512-omIzNX1psUzPcsdnUhGU6oHeOaTCuCjUgOA/v/DGkvWC1jLcnfXe4vdYbtXMh4XOCuIgS1UCcvZEc8vQLXFbXQ==", + "cpu": [ + "arm64" + ], + "libc": [ + "glibc" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-linux-arm64-musl": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-linux-arm64-musl/-/jieba-linux-arm64-musl-1.10.4.tgz", + "integrity": "sha512-Y/tiJ1+HeS5nnmLbZOE+66LbsPOHZ/PUckAYVeLlQfpygLEpLYdlh0aPpS5uiaWMjAXYZYdFkpZHhxDmSLpwpw==", + "cpu": [ + "arm64" + ], + "libc": [ + "musl" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-linux-x64-gnu": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-linux-x64-gnu/-/jieba-linux-x64-gnu-1.10.4.tgz", + "integrity": "sha512-WZO8ykRJpWGE9MHuZpy1lu3nJluPoeB+fIJJn5CWZ9YTVhNDWoCF4i/7nxz1ntulINYGQ8VVuCU9LD86Mek97g==", + "cpu": [ + "x64" + ], + "libc": [ + "glibc" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-linux-x64-musl": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-linux-x64-musl/-/jieba-linux-x64-musl-1.10.4.tgz", + "integrity": "sha512-uBBD4S1rGKcgCyAk6VCKatEVQb6EDD5I40v/DxODi5CuZVCANi9m5oee/MQbAoaX7RydA2f0OSCE9/tcwXEwUg==", + "cpu": [ + "x64" + ], + "libc": [ + "musl" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-wasm32-wasi": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-wasm32-wasi/-/jieba-wasm32-wasi-1.10.4.tgz", + "integrity": "sha512-Y2umiKHjuIJy0uulNDz9SDYHdfq5Hmy7jY5nORO99B4pySKkcrMjpeVrmWXJLIsEKLJwcCXHxz8tjwU5/uhz0A==", + "cpu": [ + "wasm32" + ], + "license": "MIT", + "optional": true, + "dependencies": { + "@napi-rs/wasm-runtime": "^0.2.3" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/@node-rs/jieba-wasm32-wasi/node_modules/@napi-rs/wasm-runtime": { + "version": "0.2.12", + "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-0.2.12.tgz", + "integrity": "sha512-ZVWUcfwY4E/yPitQJl481FjFo3K22D6qF0DuFH6Y/nbnE11GY5uguDxZMGXPQ8WQ0128MXQD7TnfHyK4oWoIJQ==", + "license": "MIT", + "optional": true, + "dependencies": { + "@emnapi/core": "^1.4.3", + "@emnapi/runtime": "^1.4.3", + "@tybys/wasm-util": "^0.10.0" + } + }, + "node_modules/@node-rs/jieba-win32-arm64-msvc": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-win32-arm64-msvc/-/jieba-win32-arm64-msvc-1.10.4.tgz", + "integrity": "sha512-nwMtViFm4hjqhz1it/juQnxpXgqlGltCuWJ02bw70YUDMDlbyTy3grCJPpQQpueeETcALUnTxda8pZuVrLRcBA==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-win32-ia32-msvc": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-win32-ia32-msvc/-/jieba-win32-ia32-msvc-1.10.4.tgz", + "integrity": "sha512-DCAvLx7Z+W4z5oKS+7vUowAJr0uw9JBw8x1Y23Xs/xMA4Em+OOSiaF5/tCJqZUCJ8uC4QeImmgDFiBqGNwxlyA==", + "cpu": [ + "ia32" + ], + "license": "MIT", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@node-rs/jieba-win32-x64-msvc": { + "version": "1.10.4", + "resolved": "https://registry.npmjs.org/@node-rs/jieba-win32-x64-msvc/-/jieba-win32-x64-msvc-1.10.4.tgz", + "integrity": "sha512-+sqemSfS1jjb+Tt7InNbNzrRh1Ua3vProVvC4BZRPg010/leCbGFFiQHpzcPRfpxAXZrzG5Y0YBTsPzN/I4yHQ==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -7731,6 +8128,12 @@ "node": ">=10" } }, + "node_modules/comlink": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/comlink/-/comlink-4.4.2.tgz", + "integrity": "sha512-OxGdvBmJuNKSCMO4NTl1L47VRp6xn2wG4F/2hYzB6tiCb709otOxtEYCSvK80PtjODfXXZu8ds+Nw5kVCjqd2g==", + "license": "Apache-2.0" + }, "node_modules/comma-separated-tokens": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-2.0.3.tgz", @@ -8950,6 +9353,31 @@ "node": ">= 0.8" } }, + "node_modules/encoding-sniffer": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/encoding-sniffer/-/encoding-sniffer-0.2.1.tgz", + "integrity": "sha512-5gvq20T6vfpekVtqrYQsSCFZ1wEg5+wW0/QaZMWkFr6BqD3NfKs0rLCx4rrVlSWJeZb5NBJgVLswK/w2MWU+Gw==", + "license": "MIT", + "dependencies": { + "iconv-lite": "^0.6.3", + "whatwg-encoding": "^3.1.1" + }, + "funding": { + "url": "https://github.com/fb55/encoding-sniffer?sponsor=1" + } + }, + "node_modules/encoding-sniffer/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "license": "MIT", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/enhanced-resolve": { "version": "5.24.5", "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.24.5.tgz", @@ -10541,6 +10969,12 @@ "node": ">=16.x" } }, + "node_modules/immediate": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.3.0.tgz", + "integrity": "sha512-HR7EVodfFUdQCTIeySw+WDRFJlPcLOJbXfwwZ7Oom6tjsvZ3bOkCDJHehQC3nxJrv7+f9XecwazynjU8e4Vw3Q==", + "license": "MIT" + }, "node_modules/import-fresh": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz", @@ -11137,6 +11571,15 @@ "node": ">=0.10.0" } }, + "node_modules/klaw-sync": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz", + "integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==", + "license": "MIT", + "dependencies": { + "graceful-fs": "^4.1.11" + } + }, "node_modules/kleur": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz", @@ -11564,6 +12007,24 @@ "yallist": "^3.0.2" } }, + "node_modules/lunr": { + "version": "2.3.9", + "resolved": "https://registry.npmjs.org/lunr/-/lunr-2.3.9.tgz", + "integrity": "sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow==", + "license": "MIT" + }, + "node_modules/lunr-languages": { + "version": "1.21.0", + "resolved": "https://registry.npmjs.org/lunr-languages/-/lunr-languages-1.21.0.tgz", + "integrity": "sha512-Hj0VwJP1FGwZzVMMZdDtWY2GB2VVKtvVElYtVajzCZCDr2RTucyLpPibrOPGgTlcq2ENQy2gYLtPnzyFu9jZCg==", + "license": "MPL-1.1" + }, + "node_modules/mark.js": { + "version": "8.11.1", + "resolved": "https://registry.npmjs.org/mark.js/-/mark.js-8.11.1.tgz", + "integrity": "sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==", + "license": "MIT" + }, "node_modules/markdown-extensions": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/markdown-extensions/-/markdown-extensions-2.0.0.tgz", @@ -14613,6 +15074,18 @@ "url": "https://github.com/inikulin/parse5?sponsor=1" } }, + "node_modules/parse5-parser-stream": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/parse5-parser-stream/-/parse5-parser-stream-7.1.2.tgz", + "integrity": "sha512-JyeQc9iwFLn5TbvvqACIF/VXG6abODeB3Fwmv/TGdLk2LfbWkaySGY72at4+Ty7EkPZj854u4CrICqNk2qIbow==", + "license": "MIT", + "dependencies": { + "parse5": "^7.0.0" + }, + "funding": { + "url": "https://github.com/inikulin/parse5?sponsor=1" + } + }, "node_modules/parse5/node_modules/entities": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz", @@ -18451,6 +18924,15 @@ "node": ">=14.17" } }, + "node_modules/undici": { + "version": "7.29.0", + "resolved": "https://registry.npmjs.org/undici/-/undici-7.29.0.tgz", + "integrity": "sha512-IDxfleLmmbSskfWSUATiN1nfn2rDuvnMOqb5CWR92iIfojA0Ud+ulOAAEQ57LPr9rWmsreUyf5lwyao+7GNNVw==", + "license": "MIT", + "engines": { + "node": ">=20.18.1" + } + }, "node_modules/undici-types": { "version": "8.3.0", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-8.3.0.tgz", @@ -19311,6 +19793,40 @@ "node": ">=0.8.0" } }, + "node_modules/whatwg-encoding": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz", + "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==", + "deprecated": "Use @exodus/bytes instead for a more spec-conformant and faster implementation", + "license": "MIT", + "dependencies": { + "iconv-lite": "0.6.3" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/whatwg-encoding/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "license": "MIT", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/whatwg-mimetype": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz", + "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==", + "license": "MIT", + "engines": { + "node": ">=18" + } + }, "node_modules/which": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", diff --git a/website/package.json b/website/package.json index 4e43af3..f8770cd 100644 --- a/website/package.json +++ b/website/package.json @@ -18,6 +18,7 @@ "@docusaurus/core": "3.10.2", "@docusaurus/faster": "3.10.2", "@docusaurus/preset-classic": "3.10.2", + "@easyops-cn/docusaurus-search-local": "^0.55.3", "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", "prism-react-renderer": "^2.3.0", diff --git a/website/sidebars.ts b/website/sidebars.ts index 68d3ae9..2780f51 100644 --- a/website/sidebars.ts +++ b/website/sidebars.ts @@ -1,33 +1,63 @@ import type { SidebarsConfig } from '@docusaurus/plugin-content-docs'; -// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...) - -/** - * Creating a sidebar enables you to: - - create an ordered group of docs - - render a sidebar for each doc of that group - - provide next/previous navigation - - The sidebars can be generated from the filesystem, or explicitly defined here. - - Create as many sidebars as you want. - */ const sidebars: SidebarsConfig = { - // By default, Docusaurus generates a sidebar from the docs folder structure - tutorialSidebar: [{ type: 'autogenerated', dirName: '.' }], - - // But you can create a sidebar manually - /* - tutorialSidebar: [ - 'intro', - 'hello', + docsSidebar: [ + { + type: 'category', + label: '🚀 Primeiros Passos', + collapsed: false, + items: [ + 'intro', + 'installation', + 'quickstart', + ], + }, + { + type: 'category', + label: '🛡️ Conceitos & Segurança', + collapsed: false, + items: [ + 'severity-levels', + ], + }, + { + type: 'category', + label: '💻 Comandos da CLI', + collapsed: false, + items: [ + 'commands/scan', + 'commands/check', + 'commands/init', + 'commands/fix', + 'commands/hook', + 'commands/version', + ], + }, + { + type: 'category', + label: '⚙️ Configuração', + collapsed: false, + items: [ + 'configuration', + ], + }, + { + type: 'category', + label: '🔄 Automação & CI/CD', + collapsed: false, + items: [ + 'cicd-integration', + ], + }, { type: 'category', - label: 'Tutorial', - items: ['tutorial-basics/create-a-document'], + label: '🤝 Comunidade', + collapsed: true, + items: [ + 'contributing', + ], }, ], - */ }; export default sidebars; diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx index 9c5189a..4b67ab7 100644 --- a/website/src/components/HomepageFeatures/index.tsx +++ b/website/src/components/HomepageFeatures/index.tsx @@ -4,46 +4,93 @@ import Heading from '@theme/Heading'; import styles from './styles.module.css'; type FeatureItem = { + icon: string; + badge?: string; title: string; description: ReactNode; }; const FeatureList: FeatureItem[] = [ { + icon: '🛡️', + badge: 'Detecção Ativa', title: 'Git-Aware & Inteligente', description: ( <> - O envguard analisa a árvore do Git e identifica se arquivos .env{' '} - estão rastreados, preparados para commit (staged), ignorados ou desprotegidos. + O envguard analisa a árvore de trabalho do Git e diferencia se arquivos .env{' '} + estão comitados (tracked), preparados (staged) ou desprotegidos pelo .gitignore. ), }, { - title: 'Rápido & 100% Local', + icon: '⚡', + badge: 'Zero Telemetria', + title: 'Ultrarrápido & 100% Local', description: ( <> - Construído em Go nativo, roda instantaneamente e 100% offline. Nunca envia dados para a - internet e nunca expõe valores de variáveis. + Construído em Go nativo, executa instantaneamente e 100% offline. Nunca envia dados para servidores + remotos e jamais expõe o conteúdo dos seus segredos. ), }, { + icon: '🤖', + badge: 'Pre-Commit & CI', title: 'Pronto para CI/CD & Hooks', description: ( <> - Códigos de saída determinísticos e saída estruturada em JSON (--format json) - para integração fácil com GitHub Actions e pre-commit hooks. + Instale pre-commit hooks nativos com envguard hook install e utilize saídas JSON determinísticas + para automação no GitHub Actions e pipelines. + + ), + }, + { + icon: '🛠️', + badge: 'Autocorreção', + title: 'Remediação com 1 Comando', + description: ( + <> + Com o comando envguard fix, você remove arquivos sensíveis do cache do Git e adiciona as regras + necessárias no .gitignore automaticamente. + + ), + }, + { + icon: '📊', + badge: 'Diagnóstico Claro', + title: 'Níveis de Severidade', + description: ( + <> + Classificação precisa dos alertas em CRITICAL, WARNING e INFO, + com suporte a flags como --fail-on para bloquear builds arriscados. + + ), + }, + { + icon: '⚙️', + badge: 'Flexível', + title: 'Configuração Simplificada', + description: ( + <> + Personalize padrões de busca, exceções de templates e regras customizadas através do arquivo central{' '} + .envguard.yaml gerado via envguard init. ), }, ]; -function Feature({ title, description }: FeatureItem) { +function Feature({ icon, badge, title, description }: FeatureItem) { return ( -
-
- {title} -

{description}

+
+
+
+ {icon} + {badge && {badge}} +
+ + {title} + +

{description}

); @@ -51,8 +98,16 @@ function Feature({ title, description }: FeatureItem) { export default function HomepageFeatures(): ReactNode { return ( -
+
+
+ + Recursos projetados para proteger seu fluxo de trabalho + +

+ Simplicidade, velocidade e segurança máxima sem atrapalhar a produtividade do time de engenharia. +

+
{FeatureList.map((props, idx) => ( @@ -62,3 +117,4 @@ export default function HomepageFeatures(): ReactNode {
); } + diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css index b248eb2..1ef4d02 100644 --- a/website/src/components/HomepageFeatures/styles.module.css +++ b/website/src/components/HomepageFeatures/styles.module.css @@ -1,11 +1,95 @@ -.features { +.featuresSection { + padding: 5rem 0; + width: 100%; + position: relative; +} + +.sectionHeader { + text-align: center; + margin-bottom: 3.5rem; +} + +.sectionTitle { + font-size: 2.25rem; + font-weight: 800; + letter-spacing: -0.5px; + margin-bottom: 0.75rem; +} + +.sectionSubtitle { + font-size: 1.15rem; + color: var(--ifm-color-emphasis-700); + max-width: 680px; + margin: 0 auto; +} + +.featureCol { + margin-bottom: 2rem; display: flex; - align-items: center; - padding: 2rem 0; +} + +.featureCard { width: 100%; + padding: 2rem; + border-radius: 16px; + background: var(--brand-card-bg); + border: 1px solid var(--brand-card-border); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); + display: flex; + flex-direction: column; } -.featureSvg { - height: 200px; - width: 200px; +.featureCard:hover { + transform: translateY(-5px); + border-color: var(--brand-purple-neon); + box-shadow: var(--brand-glow); } + +.featureHeader { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 1.25rem; +} + +.featureIcon { + font-size: 2rem; + line-height: 1; + display: inline-flex; + align-items: center; + justify-content: center; + width: 48px; + height: 48px; + border-radius: 12px; + background: rgba(139, 93, 255, 0.12); + border: 1px solid rgba(139, 93, 255, 0.2); +} + +.featureBadge { + font-size: 0.75rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.5px; + padding: 0.25rem 0.65rem; + border-radius: 999px; + background: rgba(139, 93, 255, 0.15); + color: var(--brand-purple-neon); + border: 1px solid rgba(139, 93, 255, 0.25); +} + +.featureTitle { + font-size: 1.25rem; + font-weight: 700; + margin-bottom: 0.75rem; +} + +.featureDescription { + font-size: 0.95rem; + line-height: 1.6; + color: var(--ifm-color-emphasis-700); + margin-bottom: 0; +} + diff --git a/website/src/css/custom.css b/website/src/css/custom.css index 613d830..ae54d2a 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -1,40 +1,236 @@ /** - * Any CSS included here will be global. The classic template - * bundles Infima by default. Infima is a CSS framework designed to - * work well for content-centric websites. + * envguard Custom Design System & Theme + * Palette: + * - #FFF7D1 (Cream / Glow Accent) + * - #8B5DFF (Electric Purple) + * - #6A42C2 (Royal Purple) + * - #563A9C (Deep Purple) */ +@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap'); + :root { - --ifm-color-primary: #059669; - --ifm-color-primary-dark: #047857; - --ifm-color-primary-darker: #065f46; - --ifm-color-primary-darkest: #064e3b; - --ifm-color-primary-light: #10b981; - --ifm-color-primary-lighter: #34d399; - --ifm-color-primary-lightest: #6ee7b7; - --ifm-code-font-size: 95%; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1); + --ifm-font-family-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + --ifm-font-family-monospace: 'JetBrains Mono', 'Fira Code', Menlo, Monaco, Consolas, monospace; + --ifm-code-font-size: 90%; + --ifm-heading-font-weight: 700; + --ifm-line-height-base: 1.65; + + /* Brand Palette - Light Mode */ + --ifm-color-primary: #6a42c2; + --ifm-color-primary-dark: #563a9c; + --ifm-color-primary-darker: #462e82; + --ifm-color-primary-darkest: #322060; + --ifm-color-primary-light: #8b5dff; + --ifm-color-primary-lighter: #9e75ff; + --ifm-color-primary-lightest: #be9eff; + + --brand-cream: #fff7d1; + --brand-purple-neon: #8b5dff; + --brand-purple-royal: #6a42c2; + --brand-purple-deep: #563a9c; + + --ifm-background-color: #fcfbfe; + --ifm-background-surface-color: #ffffff; + --ifm-navbar-background-color: rgba(255, 255, 255, 0.85); + --ifm-footer-background-color: #1a162b; + + --brand-hero-bg: radial-gradient(circle at 50% 0%, #20173d 0%, #0f0a1c 100%); + --brand-card-bg: rgba(255, 255, 255, 0.9); + --brand-card-border: rgba(106, 66, 194, 0.15); + --brand-card-hover-border: #8b5dff; + --brand-glow: 0 8px 32px 0 rgba(106, 66, 194, 0.15); + + --docusaurus-highlighted-code-line-bg: rgba(106, 66, 194, 0.1); } [data-theme='dark'] { - --ifm-color-primary: #10b981; - --ifm-color-primary-dark: #059669; - --ifm-color-primary-darker: #047857; - --ifm-color-primary-darkest: #065f46; - --ifm-color-primary-light: #34d399; - --ifm-color-primary-lighter: #6ee7b7; - --ifm-color-primary-lightest: #a7f3d0; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); -} - -.hero--primary { - background: linear-gradient(135deg, #065f46 0%, #047857 50%, #059669 100%); - color: #ffffff; + /* Brand Palette - Dark Mode */ + --ifm-color-primary: #8b5dff; + --ifm-color-primary-dark: #6a42c2; + --ifm-color-primary-darker: #563a9c; + --ifm-color-primary-darkest: #3e2675; + --ifm-color-primary-light: #a37dff; + --ifm-color-primary-lighter: #b89bff; + --ifm-color-primary-lightest: #dcd0ff; + + --ifm-background-color: #0b0914; + --ifm-background-surface-color: #120e21; + --ifm-navbar-background-color: rgba(11, 9, 20, 0.82); + --ifm-footer-background-color: #08060f; + + --brand-hero-bg: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(139, 93, 255, 0.25), transparent), #0b0914; + --brand-card-bg: rgba(18, 14, 33, 0.7); + --brand-card-border: rgba(139, 93, 255, 0.18); + --brand-card-hover-border: #8b5dff; + --brand-glow: 0 8px 32px 0 rgba(139, 93, 255, 0.18); + + --docusaurus-highlighted-code-line-bg: rgba(139, 93, 255, 0.2); +} + +/* ========================================= + Glassmorphism Navbar + ========================================= */ +.navbar { + backdrop-filter: blur(14px); + -webkit-backdrop-filter: blur(14px); + border-bottom: 1px solid var(--brand-card-border); + box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.1); + transition: all 0.3s ease; +} + +.navbar__title { + font-weight: 800; + letter-spacing: -0.5px; + background: linear-gradient(135deg, #8b5dff 0%, #6a42c2 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + font-size: 1.35rem; +} + +.navbar__link { + font-weight: 600; + transition: color 0.2s ease, transform 0.2s ease; +} + +.navbar__link:hover, +.navbar__link--active { + color: var(--ifm-color-primary) !important; +} + +/* ========================================= + Search Bar Customization + ========================================= */ +.navbar__search-input { + border-radius: 9999px !important; + border: 1px solid var(--brand-card-border) !important; + background-color: var(--ifm-background-surface-color) !important; + padding-left: 2.2rem !important; + transition: all 0.25s ease !important; +} + +.navbar__search-input:focus { + border-color: var(--brand-purple-neon) !important; + box-shadow: 0 0 0 3px rgba(139, 93, 255, 0.25) !important; + width: 240px !important; +} + +/* ========================================= + Modern Buttons + ========================================= */ +.button { + font-weight: 700; + border-radius: 12px; + padding: 0.75rem 1.6rem; + transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1); +} + +.button--primary { + background: linear-gradient(135deg, #8b5dff 0%, #6a42c2 100%); + border: none; + color: #ffffff !important; + box-shadow: 0 4px 15px rgba(106, 66, 194, 0.35); +} + +.button--primary:hover { + background: linear-gradient(135deg, #9b74ff 0%, #7c52d8 100%); + transform: translateY(-2px); + box-shadow: 0 6px 20px rgba(139, 93, 255, 0.45); +} + +.button--secondary { + background: rgba(139, 93, 255, 0.12); + color: var(--ifm-color-primary) !important; + border: 1px solid var(--brand-card-border); + backdrop-filter: blur(8px); } -.hero__subtitle { - font-size: 1.25rem; - max-width: 700px; - margin: 0 auto; - opacity: 0.95; +.button--secondary:hover { + background: rgba(139, 93, 255, 0.2); + border-color: var(--brand-purple-neon); + transform: translateY(-2px); +} + +/* ========================================= + Documentation Sidebar & Content + ========================================= */ +.theme-doc-sidebar-container { + border-right: 1px solid var(--brand-card-border) !important; +} + +.menu__link { + border-radius: 8px; + font-weight: 500; + margin: 2px 0; + transition: all 0.2s ease; +} + +.menu__link--active:not(.menu__link--sublist) { + background: linear-gradient(90deg, rgba(139, 93, 255, 0.18) 0%, rgba(106, 66, 194, 0.08) 100%) !important; + color: var(--ifm-color-primary) !important; + font-weight: 700; + border-left: 3px solid var(--brand-purple-neon); +} + +.menu__link:hover:not(.menu__link--active) { + background-color: rgba(139, 93, 255, 0.08); + color: var(--ifm-color-primary); +} + +/* ========================================= + Modern Code Blocks & Admonitions + ========================================= */ +div[class^='codeBlockContainer_'] { + border-radius: 12px; + border: 1px solid var(--brand-card-border); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); + overflow: hidden; +} + +.alert { + border-radius: 12px; + border-width: 1px; + border-left-width: 5px; + backdrop-filter: blur(8px); +} + +.alert--info { + --ifm-alert-background-color: rgba(139, 93, 255, 0.08); + --ifm-alert-border-color: #8b5dff; +} + +.alert--success { + --ifm-alert-background-color: rgba(16, 185, 129, 0.08); + --ifm-alert-border-color: #10b981; +} + +.alert--warning { + --ifm-alert-background-color: rgba(255, 193, 7, 0.08); + --ifm-alert-border-color: #f59e0b; +} + +/* ========================================= + Custom Scrollbar & Highlights + ========================================= */ +::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +::-webkit-scrollbar-track { + background: transparent; +} + +::-webkit-scrollbar-thumb { + background: rgba(106, 66, 194, 0.3); + border-radius: 999px; +} + +::-webkit-scrollbar-thumb:hover { + background: var(--brand-purple-neon); +} + +::selection { + background: #8b5dff; + color: #ffffff; } diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 9f71a5d..67cc7e3 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -1,23 +1,202 @@ -/** - * CSS files with the .module.css suffix will be treated as CSS modules - * and scoped locally. - */ - .heroBanner { - padding: 4rem 0; - text-align: center; + padding: 5.5rem 0 4.5rem; position: relative; overflow: hidden; + background: var(--brand-hero-bg); + border-bottom: 1px solid var(--brand-card-border); } -@media screen and (max-width: 996px) { - .heroBanner { - padding: 2rem; +.heroContent { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + position: relative; + z-index: 2; +} + +.versionBadge { + display: inline-flex; + align-items: center; + gap: 0.5rem; + padding: 0.35rem 1rem; + border-radius: 9999px; + background: rgba(139, 93, 255, 0.15); + border: 1px solid rgba(139, 93, 255, 0.35); + color: var(--brand-purple-neon); + font-size: 0.88rem; + font-weight: 600; + margin-bottom: 1.5rem; + backdrop-filter: blur(8px); +} + +.badgeGlowDot { + width: 8px; + height: 8px; + border-radius: 50%; + background-color: var(--brand-cream); + box-shadow: 0 0 10px var(--brand-cream); + animation: pulseDot 2s infinite ease-in-out; +} + +@keyframes pulseDot { + 0%, 100% { + transform: scale(1); + opacity: 0.8; + } + 50% { + transform: scale(1.3); + opacity: 1; } } +.heroTitle { + font-size: 3.5rem; + font-weight: 800; + letter-spacing: -1.5px; + line-height: 1.15; + margin-bottom: 1.25rem; + max-width: 900px; +} + +.gradientText { + background: linear-gradient(135deg, #ffffff 30%, #8b5dff 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +[data-theme='light'] .gradientText { + background: linear-gradient(135deg, #20173d 20%, #6a42c2 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.heroSubtitle { + font-size: 1.25rem; + max-width: 720px; + margin: 0 auto 2rem; + color: var(--ifm-color-emphasis-700); + line-height: 1.6; +} + .buttons { display: flex; align-items: center; justify-content: center; + gap: 1rem; + margin-bottom: 3rem; + flex-wrap: wrap; +} + +/* ========================================= + Terminal Showcase Component + ========================================= */ +.terminalWrapper { + width: 100%; + max-width: 820px; + border-radius: 14px; + background: #0d0b17; + border: 1px solid rgba(139, 93, 255, 0.3); + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 40px rgba(106, 66, 194, 0.2); + overflow: hidden; + text-align: left; +} + +.terminalHeader { + background: #171328; + padding: 0.75rem 1rem; + display: flex; + align-items: center; + border-bottom: 1px solid rgba(139, 93, 255, 0.15); +} + +.terminalDots { + display: flex; + gap: 6px; +} + +.dot { + width: 11px; + height: 11px; + border-radius: 50%; +} + +.dotRed { + background-color: #ff5f56; +} + +.dotYellow { + background-color: #ffbd2e; +} + +.dotGreen { + background-color: #27c93f; +} + +.terminalTitle { + margin-left: auto; + margin-right: auto; + font-size: 0.82rem; + color: #a49fc4; + font-family: var(--ifm-font-family-monospace); + font-weight: 500; +} + +.terminalBody { + padding: 1.5rem; + font-family: var(--ifm-font-family-monospace); + font-size: 0.92rem; + line-height: 1.7; + color: #e2e0ed; + overflow-x: auto; +} + +.termPrompt { + color: var(--brand-purple-neon); + font-weight: 700; +} + +.termCmd { + color: #ffffff; + font-weight: 600; +} + +.termComment { + color: #7b749d; +} + +.termCrit { + color: #ff5577; + font-weight: 700; +} + +.termWarn { + color: #ffb84d; + font-weight: 700; +} + +.termInfo { + color: #a3e635; + font-weight: 700; +} + +.termOk { + color: #4ade80; + font-weight: 700; +} + +@media screen and (max-width: 768px) { + .heroBanner { + padding: 3rem 1rem; + } + .heroTitle { + font-size: 2.25rem; + } + .heroSubtitle { + font-size: 1.05rem; + } + .terminalBody { + padding: 1rem; + font-size: 0.8rem; + } } diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index 2babe04..6bf63ed 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -8,44 +8,90 @@ import Heading from '@theme/Heading'; import styles from './index.module.css'; +function TerminalPreview() { + return ( +
+
+
+ + + +
+ envguard terminal • zsh / powershell +
+
+
+ $ + envguard scan +
+
[envguard] Varrendo repositório em busca de arquivos de ambiente sensíveis...
+
+
+ ✗ .env                CRITICAL   Arquivo rastreado no Git (commitado) +
+
+ ⚠ .env.production     WARNING    Não ignorado no .gitignore +
+
+ ✓ .env.example        INFO       Template padrão identificado +
+
+
+ [ERRO] Encontrado 1 problema CRITICAL e 1 WARNING. +
+
+ Dica: execute `envguard fix` para adicionar ao .gitignore e remover do cache Git. +
+
+
+ ); +} + function HomepageHeader() { const { siteConfig } = useDocusaurusContext(); return ( -
+
- - {siteConfig.title} - -

{siteConfig.tagline}

+
+
+ + v0.2.0 • Proteção Git-Aware para Segredos +
-
- Go Version - License: MIT - PRs Welcome -
+ + Segurança de .env +
+ com Consciência do Git +
+ +

+ Evite que arquivos .env e credenciais de ambiente vazem ou cheguem ao histórico de versionamento do Git. +

-
- - Comece Agora - - - Ver Comandos CLI - + Go Version + License: MIT + 100% Offline +
+ +
+ + ⚡ Início Rápido (3 min) + + + 📖 Explorar Documentação + +
+ +
@@ -53,7 +99,6 @@ function HomepageHeader() { } export default function Home(): ReactNode { - const { siteConfig } = useDocusaurusContext(); return ( ); } + diff --git a/website/static/img/logo.svg b/website/static/img/logo.svg index 9db6d0d..53f8633 100644 --- a/website/static/img/logo.svg +++ b/website/static/img/logo.svg @@ -1 +1,37 @@ - \ No newline at end of file + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file From 1e1e68fe3d98e6d874d4598f93695274ce93e918 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Vitor=20R=2E=20da=20Silva?= Date: Wed, 2 Sep 2026 17:01:16 -0300 Subject: [PATCH 2/4] style(website): formatar codigo e componentes com prettier --- website/docs/quickstart.md | 8 ++-- website/sidebars.ts | 22 +++------- .../src/components/HomepageFeatures/index.tsx | 30 ++++++------- .../HomepageFeatures/styles.module.css | 1 - website/src/css/custom.css | 17 ++++++-- website/src/pages/index.module.css | 7 +++- website/src/pages/index.tsx | 42 ++++++++++++++----- 7 files changed, 74 insertions(+), 53 deletions(-) diff --git a/website/docs/quickstart.md b/website/docs/quickstart.md index 3928e5e..b2b37f2 100644 --- a/website/docs/quickstart.md +++ b/website/docs/quickstart.md @@ -65,11 +65,11 @@ Isso gerará o arquivo de configuração `.envguard.yaml` na raiz do repositóri ```yaml version: 1 patterns: - - ".env*" + - '.env*' ignore: - - ".env.example" - - ".env.template" -fail_on: "warning" # Interrompe a execução com warning ou critical + - '.env.example' + - '.env.template' +fail_on: 'warning' # Interrompe a execução com warning ou critical ``` --- diff --git a/website/sidebars.ts b/website/sidebars.ts index 2780f51..6e715a9 100644 --- a/website/sidebars.ts +++ b/website/sidebars.ts @@ -6,19 +6,13 @@ const sidebars: SidebarsConfig = { type: 'category', label: '🚀 Primeiros Passos', collapsed: false, - items: [ - 'intro', - 'installation', - 'quickstart', - ], + items: ['intro', 'installation', 'quickstart'], }, { type: 'category', label: '🛡️ Conceitos & Segurança', collapsed: false, - items: [ - 'severity-levels', - ], + items: ['severity-levels'], }, { type: 'category', @@ -37,25 +31,19 @@ const sidebars: SidebarsConfig = { type: 'category', label: '⚙️ Configuração', collapsed: false, - items: [ - 'configuration', - ], + items: ['configuration'], }, { type: 'category', label: '🔄 Automação & CI/CD', collapsed: false, - items: [ - 'cicd-integration', - ], + items: ['cicd-integration'], }, { type: 'category', label: '🤝 Comunidade', collapsed: true, - items: [ - 'contributing', - ], + items: ['contributing'], }, ], }; diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx index 4b67ab7..f4415e9 100644 --- a/website/src/components/HomepageFeatures/index.tsx +++ b/website/src/components/HomepageFeatures/index.tsx @@ -17,8 +17,9 @@ const FeatureList: FeatureItem[] = [ title: 'Git-Aware & Inteligente', description: ( <> - O envguard analisa a árvore de trabalho do Git e diferencia se arquivos .env{' '} - estão comitados (tracked), preparados (staged) ou desprotegidos pelo .gitignore. + O envguard analisa a árvore de trabalho do Git e diferencia se arquivos{' '} + .env estão comitados (tracked), preparados (staged) ou + desprotegidos pelo .gitignore. ), }, @@ -28,8 +29,8 @@ const FeatureList: FeatureItem[] = [ title: 'Ultrarrápido & 100% Local', description: ( <> - Construído em Go nativo, executa instantaneamente e 100% offline. Nunca envia dados para servidores - remotos e jamais expõe o conteúdo dos seus segredos. + Construído em Go nativo, executa instantaneamente e 100% offline. Nunca envia dados para + servidores remotos e jamais expõe o conteúdo dos seus segredos. ), }, @@ -39,8 +40,8 @@ const FeatureList: FeatureItem[] = [ title: 'Pronto para CI/CD & Hooks', description: ( <> - Instale pre-commit hooks nativos com envguard hook install e utilize saídas JSON determinísticas - para automação no GitHub Actions e pipelines. + Instale pre-commit hooks nativos com envguard hook install e utilize saídas + JSON determinísticas para automação no GitHub Actions e pipelines. ), }, @@ -50,8 +51,8 @@ const FeatureList: FeatureItem[] = [ title: 'Remediação com 1 Comando', description: ( <> - Com o comando envguard fix, você remove arquivos sensíveis do cache do Git e adiciona as regras - necessárias no .gitignore automaticamente. + Com o comando envguard fix, você remove arquivos sensíveis do cache do Git e + adiciona as regras necessárias no .gitignore automaticamente. ), }, @@ -61,8 +62,9 @@ const FeatureList: FeatureItem[] = [ title: 'Níveis de Severidade', description: ( <> - Classificação precisa dos alertas em CRITICAL, WARNING e INFO, - com suporte a flags como --fail-on para bloquear builds arriscados. + Classificação precisa dos alertas em CRITICAL, WARNING e{' '} + INFO, com suporte a flags como --fail-on para bloquear builds + arriscados. ), }, @@ -72,8 +74,8 @@ const FeatureList: FeatureItem[] = [ title: 'Configuração Simplificada', description: ( <> - Personalize padrões de busca, exceções de templates e regras customizadas através do arquivo central{' '} - .envguard.yaml gerado via envguard init. + Personalize padrões de busca, exceções de templates e regras customizadas através do arquivo + central .envguard.yaml gerado via envguard init. ), }, @@ -105,7 +107,8 @@ export default function HomepageFeatures(): ReactNode { Recursos projetados para proteger seu fluxo de trabalho

- Simplicidade, velocidade e segurança máxima sem atrapalhar a produtividade do time de engenharia. + Simplicidade, velocidade e segurança máxima sem atrapalhar a produtividade do time de + engenharia.

@@ -117,4 +120,3 @@ export default function HomepageFeatures(): ReactNode { ); } - diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css index 1ef4d02..90c6178 100644 --- a/website/src/components/HomepageFeatures/styles.module.css +++ b/website/src/components/HomepageFeatures/styles.module.css @@ -92,4 +92,3 @@ color: var(--ifm-color-emphasis-700); margin-bottom: 0; } - diff --git a/website/src/css/custom.css b/website/src/css/custom.css index ae54d2a..b4b1283 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -10,7 +10,9 @@ @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap'); :root { - --ifm-font-family-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + --ifm-font-family-base: + 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, + Cantarell, sans-serif; --ifm-font-family-monospace: 'JetBrains Mono', 'Fira Code', Menlo, Monaco, Consolas, monospace; --ifm-code-font-size: 90%; --ifm-heading-font-weight: 700; @@ -59,7 +61,8 @@ --ifm-navbar-background-color: rgba(11, 9, 20, 0.82); --ifm-footer-background-color: #08060f; - --brand-hero-bg: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(139, 93, 255, 0.25), transparent), #0b0914; + --brand-hero-bg: + radial-gradient(ellipse 80% 50% at 50% -20%, rgba(139, 93, 255, 0.25), transparent), #0b0914; --brand-card-bg: rgba(18, 14, 33, 0.7); --brand-card-border: rgba(139, 93, 255, 0.18); --brand-card-hover-border: #8b5dff; @@ -90,7 +93,9 @@ .navbar__link { font-weight: 600; - transition: color 0.2s ease, transform 0.2s ease; + transition: + color 0.2s ease, + transform 0.2s ease; } .navbar__link:hover, @@ -166,7 +171,11 @@ } .menu__link--active:not(.menu__link--sublist) { - background: linear-gradient(90deg, rgba(139, 93, 255, 0.18) 0%, rgba(106, 66, 194, 0.08) 100%) !important; + background: linear-gradient( + 90deg, + rgba(139, 93, 255, 0.18) 0%, + rgba(106, 66, 194, 0.08) 100% + ) !important; color: var(--ifm-color-primary) !important; font-weight: 700; border-left: 3px solid var(--brand-purple-neon); diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 67cc7e3..02c19eb 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -40,7 +40,8 @@ } @keyframes pulseDot { - 0%, 100% { + 0%, + 100% { transform: scale(1); opacity: 0.8; } @@ -97,7 +98,9 @@ border-radius: 14px; background: #0d0b17; border: 1px solid rgba(139, 93, 255, 0.3); - box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 40px rgba(106, 66, 194, 0.2); + box-shadow: + 0 20px 50px rgba(0, 0, 0, 0.5), + 0 0 40px rgba(106, 66, 194, 0.2); overflow: hidden; text-align: left; } diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index 6bf63ed..65c47cd 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -24,23 +24,34 @@ function TerminalPreview() { $ envguard scan
-
[envguard] Varrendo repositório em busca de arquivos de ambiente sensíveis...
+
+ [envguard] Varrendo repositório em busca de arquivos de ambiente sensíveis... +

- ✗ .env                CRITICAL   Arquivo rastreado no Git (commitado) + ✗ .env{' '} +               {' '} + CRITICAL   Arquivo rastreado no Git + (commitado)
- ⚠ .env.production     WARNING    Não ignorado no .gitignore + ⚠ .env.production    {' '} + WARNING    Não ignorado no .gitignore
- ✓ .env.example        INFO       Template padrão identificado + ✓ .env.example{' '} +        INFO{' '} +       Template padrão identificado

- [ERRO] Encontrado 1 problema CRITICAL e 1 WARNING. + [ERRO] Encontrado 1 problema CRITICAL e 1 + WARNING.
- Dica: execute `envguard fix` para adicionar ao .gitignore e remover do cache Git. + + Dica: execute `envguard fix` para adicionar ao .gitignore e remover do cache Git. +
@@ -65,7 +76,8 @@ function HomepageHeader() {

- Evite que arquivos .env e credenciais de ambiente vazem ou cheguem ao histórico de versionamento do Git. + Evite que arquivos .env e credenciais de ambiente vazem ou cheguem ao + histórico de versionamento do Git.

- Go Version - License: MIT - 100% Offline + Go Version + License: MIT + 100% Offline
@@ -111,4 +132,3 @@ export default function Home(): ReactNode { ); } - From beb3f72f2bebf52075a3c08407ac71c88152e5bd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Vitor=20R=2E=20da=20Silva?= Date: Fri, 4 Sep 2026 00:06:50 -0300 Subject: [PATCH 3/4] style(website): aplicar redesign editorial com paleta nordic indigo e vanilla cream --- website/sidebars.ts | 13 +- .../src/components/HomepageFeatures/index.tsx | 94 ++---- .../HomepageFeatures/styles.module.css | 115 +++---- website/src/css/custom.css | 293 +++++++++--------- website/src/pages/index.module.css | 266 +++++++++------- website/src/pages/index.tsx | 134 ++++---- website/static/img/logo.svg | 42 +-- 7 files changed, 452 insertions(+), 505 deletions(-) diff --git a/website/sidebars.ts b/website/sidebars.ts index 6e715a9..9b48c15 100644 --- a/website/sidebars.ts +++ b/website/sidebars.ts @@ -4,19 +4,19 @@ const sidebars: SidebarsConfig = { docsSidebar: [ { type: 'category', - label: '🚀 Primeiros Passos', + label: 'Primeiros Passos', collapsed: false, items: ['intro', 'installation', 'quickstart'], }, { type: 'category', - label: '🛡️ Conceitos & Segurança', + label: 'Conceitos & Segurança', collapsed: false, items: ['severity-levels'], }, { type: 'category', - label: '💻 Comandos da CLI', + label: 'Comandos da CLI', collapsed: false, items: [ 'commands/scan', @@ -29,19 +29,19 @@ const sidebars: SidebarsConfig = { }, { type: 'category', - label: '⚙️ Configuração', + label: 'Configuração', collapsed: false, items: ['configuration'], }, { type: 'category', - label: '🔄 Automação & CI/CD', + label: 'Automação & CI/CD', collapsed: false, items: ['cicd-integration'], }, { type: 'category', - label: '🤝 Comunidade', + label: 'Comunidade', collapsed: true, items: ['contributing'], }, @@ -49,3 +49,4 @@ const sidebars: SidebarsConfig = { }; export default sidebars; + diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx index f4415e9..04f1030 100644 --- a/website/src/components/HomepageFeatures/index.tsx +++ b/website/src/components/HomepageFeatures/index.tsx @@ -3,96 +3,54 @@ import clsx from 'clsx'; import Heading from '@theme/Heading'; import styles from './styles.module.css'; -type FeatureItem = { - icon: string; - badge?: string; +type PillarItem = { + tag: string; title: string; description: ReactNode; }; -const FeatureList: FeatureItem[] = [ +const PillarList: PillarItem[] = [ { - icon: '🛡️', - badge: 'Detecção Ativa', - title: 'Git-Aware & Inteligente', + tag: 'Detecção Git-Native', + title: 'Consciência da Árvore Git', description: ( <> - O envguard analisa a árvore de trabalho do Git e diferencia se arquivos{' '} - .env estão comitados (tracked), preparados (staged) ou - desprotegidos pelo .gitignore. + Diferencia com precisão se arquivos de ambiente estão comitados no histórico (tracked), + preparados para o próximo commit (staged) ou desprotegidos contra regras do .gitignore. ), }, { - icon: '⚡', - badge: 'Zero Telemetria', - title: 'Ultrarrápido & 100% Local', + tag: 'Segurança & Velocidade', + title: '100% Local & Determinístico', description: ( <> - Construído em Go nativo, executa instantaneamente e 100% offline. Nunca envia dados para - servidores remotos e jamais expõe o conteúdo dos seus segredos. + Desenvolvido em Go nativo, executa instantaneamente em pipelines e máquinas locais sem qualquer telemetria. + Valores de variáveis e credenciais nunca são impressos em terminal ou logs. ), }, { - icon: '🤖', - badge: 'Pre-Commit & CI', - title: 'Pronto para CI/CD & Hooks', + tag: 'Automação Contínua', + title: 'Pre-Commit & Autocorreção', description: ( <> - Instale pre-commit hooks nativos com envguard hook install e utilize saídas - JSON determinísticas para automação no GitHub Actions e pipelines. - - ), - }, - { - icon: '🛠️', - badge: 'Autocorreção', - title: 'Remediação com 1 Comando', - description: ( - <> - Com o comando envguard fix, você remove arquivos sensíveis do cache do Git e - adiciona as regras necessárias no .gitignore automaticamente. - - ), - }, - { - icon: '📊', - badge: 'Diagnóstico Claro', - title: 'Níveis de Severidade', - description: ( - <> - Classificação precisa dos alertas em CRITICAL, WARNING e{' '} - INFO, com suporte a flags como --fail-on para bloquear builds - arriscados. - - ), - }, - { - icon: '⚙️', - badge: 'Flexível', - title: 'Configuração Simplificada', - description: ( - <> - Personalize padrões de busca, exceções de templates e regras customizadas através do arquivo - central .envguard.yaml gerado via envguard init. + Instale pre-commit hooks nativos com envguard hook install e execute correções automáticas no + .gitignore e no cache do Git através de envguard fix. ), }, ]; -function Feature({ icon, badge, title, description }: FeatureItem) { +function PillarCard({ tag, title, description }: PillarItem) { return ( -
-
-
- {icon} - {badge && {badge}} -
- +
+
+ {tag} + {title} -

{description}

+

{description}

); @@ -104,19 +62,19 @@ export default function HomepageFeatures(): ReactNode {
- Recursos projetados para proteger seu fluxo de trabalho + Construído para engenharia e segurança

- Simplicidade, velocidade e segurança máxima sem atrapalhar a produtividade do time de - engenharia. + Prevenção ativa contra vazamento de segredos sem adicionar atrito ou dependências lentas.

- {FeatureList.map((props, idx) => ( - + {PillarList.map((props, idx) => ( + ))}
); } + diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css index 90c6178..10f156f 100644 --- a/website/src/components/HomepageFeatures/styles.module.css +++ b/website/src/components/HomepageFeatures/styles.module.css @@ -1,94 +1,97 @@ .featuresSection { - padding: 5rem 0; + padding: 4.5rem 0; width: 100%; - position: relative; + background-color: var(--ifm-background-color); + border-top: 1px solid var(--border-subtle); } .sectionHeader { text-align: center; - margin-bottom: 3.5rem; + margin-bottom: 3rem; } .sectionTitle { - font-size: 2.25rem; + font-size: 2rem; font-weight: 800; - letter-spacing: -0.5px; - margin-bottom: 0.75rem; + letter-spacing: -0.03em; + margin-bottom: 0.5rem; + color: var(--nordic-indigo); +} + +[data-theme='dark'] .sectionTitle { + color: #f8fafc; } .sectionSubtitle { - font-size: 1.15rem; - color: var(--ifm-color-emphasis-700); - max-width: 680px; + font-size: 1.05rem; + color: #64748b; + max-width: 580px; margin: 0 auto; } -.featureCol { - margin-bottom: 2rem; +[data-theme='dark'] .sectionSubtitle { + color: #94a3b8; +} + +.pillarCol { + margin-bottom: 1.5rem; display: flex; } -.featureCard { +.pillarCard { width: 100%; - padding: 2rem; - border-radius: 16px; - background: var(--brand-card-bg); - border: 1px solid var(--brand-card-border); - backdrop-filter: blur(12px); - -webkit-backdrop-filter: blur(12px); - transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); + padding: 1.75rem; + border-radius: 8px; + background-color: var(--card-bg); + border: 1px solid var(--border-subtle); + transition: border-color 0.15s ease, transform 0.15s ease; display: flex; flex-direction: column; } -.featureCard:hover { - transform: translateY(-5px); - border-color: var(--brand-purple-neon); - box-shadow: var(--brand-glow); +.pillarCard:hover { + border-color: var(--nordic-indigo); + transform: translateY(-2px); } -.featureHeader { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 1.25rem; +.pillarTag { + font-size: 0.72rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.05em; + color: var(--nordic-indigo); + background-color: var(--vanilla-cream); + padding: 0.2rem 0.5rem; + border-radius: 4px; + align-self: flex-start; + margin-bottom: 1rem; } -.featureIcon { - font-size: 2rem; - line-height: 1; - display: inline-flex; - align-items: center; - justify-content: center; - width: 48px; - height: 48px; - border-radius: 12px; - background: rgba(139, 93, 255, 0.12); - border: 1px solid rgba(139, 93, 255, 0.2); +[data-theme='dark'] .pillarTag { + background-color: rgba(255, 244, 212, 0.12); + color: var(--vanilla-cream); } -.featureBadge { - font-size: 0.75rem; +.pillarTitle { + font-size: 1.18rem; font-weight: 700; - text-transform: uppercase; - letter-spacing: 0.5px; - padding: 0.25rem 0.65rem; - border-radius: 999px; - background: rgba(139, 93, 255, 0.15); - color: var(--brand-purple-neon); - border: 1px solid rgba(139, 93, 255, 0.25); + letter-spacing: -0.02em; + margin-bottom: 0.6rem; + color: #0f172a; } -.featureTitle { - font-size: 1.25rem; - font-weight: 700; - margin-bottom: 0.75rem; +[data-theme='dark'] .pillarTitle { + color: #f1f5f9; } -.featureDescription { - font-size: 0.95rem; +.pillarDescription { + font-size: 0.9rem; line-height: 1.6; - color: var(--ifm-color-emphasis-700); + color: #64748b; margin-bottom: 0; } + +[data-theme='dark'] .pillarDescription { + color: #94a3b8; +} + diff --git a/website/src/css/custom.css b/website/src/css/custom.css index b4b1283..ccae724 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -1,10 +1,10 @@ /** - * envguard Custom Design System & Theme + * envguard Design System * Palette: - * - #FFF7D1 (Cream / Glow Accent) - * - #8B5DFF (Electric Purple) - * - #6A42C2 (Royal Purple) - * - #563A9C (Deep Purple) + * - Nordic Indigo: #263BAA (Primary Brand) + * - Vanilla Cream: #FFF4D4 (Warm Accent & High-Contrast Cards) + * - Nordic Indigo Deep: #1B2A7A + * - Nordic Indigo Dark: #0A0D1D */ @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap'); @@ -13,89 +13,87 @@ --ifm-font-family-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; - --ifm-font-family-monospace: 'JetBrains Mono', 'Fira Code', Menlo, Monaco, Consolas, monospace; - --ifm-code-font-size: 90%; + --ifm-font-family-monospace: 'JetBrains Mono', Menlo, Monaco, Consolas, monospace; + --ifm-code-font-size: 88%; --ifm-heading-font-weight: 700; - --ifm-line-height-base: 1.65; - - /* Brand Palette - Light Mode */ - --ifm-color-primary: #6a42c2; - --ifm-color-primary-dark: #563a9c; - --ifm-color-primary-darker: #462e82; - --ifm-color-primary-darkest: #322060; - --ifm-color-primary-light: #8b5dff; - --ifm-color-primary-lighter: #9e75ff; - --ifm-color-primary-lightest: #be9eff; - - --brand-cream: #fff7d1; - --brand-purple-neon: #8b5dff; - --brand-purple-royal: #6a42c2; - --brand-purple-deep: #563a9c; - - --ifm-background-color: #fcfbfe; + --ifm-line-height-base: 1.6; + + /* Nordic Indigo & Vanilla Cream Tokens */ + --nordic-indigo: #263baa; + --nordic-indigo-deep: #1b2a7a; + --nordic-indigo-dark: #0a0d1d; + --nordic-indigo-surface: #11162e; + --vanilla-cream: #fff4d4; + --vanilla-cream-warm: #fffdf7; + --vanilla-cream-surface: #fff9e6; + + /* Light Theme */ + --ifm-color-primary: #263baa; + --ifm-color-primary-dark: #1f308f; + --ifm-color-primary-darker: #1b2a7a; + --ifm-color-primary-darkest: #121d54; + --ifm-color-primary-light: #3a4ec0; + --ifm-color-primary-lighter: #4c60cd; + --ifm-color-primary-lightest: #7686dc; + + --ifm-background-color: #fffdf7; --ifm-background-surface-color: #ffffff; - --ifm-navbar-background-color: rgba(255, 255, 255, 0.85); - --ifm-footer-background-color: #1a162b; + --ifm-navbar-background-color: rgba(255, 253, 247, 0.92); + --ifm-footer-background-color: #0a0d1d; - --brand-hero-bg: radial-gradient(circle at 50% 0%, #20173d 0%, #0f0a1c 100%); - --brand-card-bg: rgba(255, 255, 255, 0.9); - --brand-card-border: rgba(106, 66, 194, 0.15); - --brand-card-hover-border: #8b5dff; - --brand-glow: 0 8px 32px 0 rgba(106, 66, 194, 0.15); - - --docusaurus-highlighted-code-line-bg: rgba(106, 66, 194, 0.1); + --border-subtle: #e2e8f0; + --card-bg: #ffffff; + --card-border: rgba(38, 59, 170, 0.1); + --hero-bg: #fffdf7; } [data-theme='dark'] { - /* Brand Palette - Dark Mode */ - --ifm-color-primary: #8b5dff; - --ifm-color-primary-dark: #6a42c2; - --ifm-color-primary-darker: #563a9c; - --ifm-color-primary-darkest: #3e2675; - --ifm-color-primary-light: #a37dff; - --ifm-color-primary-lighter: #b89bff; - --ifm-color-primary-lightest: #dcd0ff; - - --ifm-background-color: #0b0914; - --ifm-background-surface-color: #120e21; - --ifm-navbar-background-color: rgba(11, 9, 20, 0.82); - --ifm-footer-background-color: #08060f; - - --brand-hero-bg: - radial-gradient(ellipse 80% 50% at 50% -20%, rgba(139, 93, 255, 0.25), transparent), #0b0914; - --brand-card-bg: rgba(18, 14, 33, 0.7); - --brand-card-border: rgba(139, 93, 255, 0.18); - --brand-card-hover-border: #8b5dff; - --brand-glow: 0 8px 32px 0 rgba(139, 93, 255, 0.18); - - --docusaurus-highlighted-code-line-bg: rgba(139, 93, 255, 0.2); + /* Dark Theme */ + --ifm-color-primary: #6c80ea; + --ifm-color-primary-dark: #556ce6; + --ifm-color-primary-darker: #4a62e4; + --ifm-color-primary-darkest: #2a45db; + --ifm-color-primary-light: #8394ee; + --ifm-color-primary-lighter: #8f9ff0; + --ifm-color-primary-lightest: #b3bef6; + + --ifm-background-color: #0a0d1d; + --ifm-background-surface-color: #11162e; + --ifm-navbar-background-color: rgba(10, 13, 29, 0.92); + --ifm-footer-background-color: #060814; + + --border-subtle: rgba(255, 255, 255, 0.08); + --card-bg: #11162e; + --card-border: rgba(108, 128, 234, 0.16); + --hero-bg: #0a0d1d; } /* ========================================= - Glassmorphism Navbar + Clean Editorial Navbar ========================================= */ .navbar { - backdrop-filter: blur(14px); - -webkit-backdrop-filter: blur(14px); - border-bottom: 1px solid var(--brand-card-border); - box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.1); - transition: all 0.3s ease; + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + border-bottom: 1px solid var(--border-subtle); + box-shadow: none; + height: 64px; } .navbar__title { font-weight: 800; - letter-spacing: -0.5px; - background: linear-gradient(135deg, #8b5dff 0%, #6a42c2 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - font-size: 1.35rem; + letter-spacing: -0.03em; + color: var(--nordic-indigo); + font-size: 1.25rem; +} + +[data-theme='dark'] .navbar__title { + color: #ffffff; } .navbar__link { font-weight: 600; - transition: - color 0.2s ease, - transform 0.2s ease; + font-size: 0.92rem; + transition: color 0.15s ease; } .navbar__link:hover, @@ -104,142 +102,147 @@ } /* ========================================= - Search Bar Customization + Search Bar ========================================= */ .navbar__search-input { - border-radius: 9999px !important; - border: 1px solid var(--brand-card-border) !important; + border-radius: 8px !important; + border: 1px solid var(--border-subtle) !important; background-color: var(--ifm-background-surface-color) !important; - padding-left: 2.2rem !important; - transition: all 0.25s ease !important; + font-size: 0.85rem !important; + padding: 0.4rem 0.8rem 0.4rem 2rem !important; + transition: border-color 0.15s ease, box-shadow 0.15s ease !important; } .navbar__search-input:focus { - border-color: var(--brand-purple-neon) !important; - box-shadow: 0 0 0 3px rgba(139, 93, 255, 0.25) !important; - width: 240px !important; + border-color: var(--ifm-color-primary) !important; + box-shadow: 0 0 0 2px rgba(38, 59, 170, 0.15) !important; } /* ========================================= - Modern Buttons + Buttons ========================================= */ .button { - font-weight: 700; - border-radius: 12px; - padding: 0.75rem 1.6rem; - transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1); + font-weight: 600; + border-radius: 8px; + padding: 0.65rem 1.35rem; + font-size: 0.95rem; + transition: all 0.15s ease; + letter-spacing: -0.01em; } .button--primary { - background: linear-gradient(135deg, #8b5dff 0%, #6a42c2 100%); - border: none; + background-color: var(--nordic-indigo); + border: 1px solid var(--nordic-indigo); color: #ffffff !important; - box-shadow: 0 4px 15px rgba(106, 66, 194, 0.35); } .button--primary:hover { - background: linear-gradient(135deg, #9b74ff 0%, #7c52d8 100%); - transform: translateY(-2px); - box-shadow: 0 6px 20px rgba(139, 93, 255, 0.45); + background-color: var(--nordic-indigo-deep); + border-color: var(--nordic-indigo-deep); + transform: translateY(-1px); +} + +[data-theme='dark'] .button--primary { + background-color: #3b52d4; + border-color: #3b52d4; + color: #ffffff !important; +} + +[data-theme='dark'] .button--primary:hover { + background-color: #263baa; + border-color: #263baa; } .button--secondary { - background: rgba(139, 93, 255, 0.12); + background-color: transparent; color: var(--ifm-color-primary) !important; - border: 1px solid var(--brand-card-border); - backdrop-filter: blur(8px); + border: 1px solid var(--border-subtle); } .button--secondary:hover { - background: rgba(139, 93, 255, 0.2); - border-color: var(--brand-purple-neon); - transform: translateY(-2px); + background-color: var(--vanilla-cream-surface); + border-color: var(--nordic-indigo); + transform: translateY(-1px); +} + +[data-theme='dark'] .button--secondary { + color: #e2e8f0 !important; + border-color: var(--border-subtle); +} + +[data-theme='dark'] .button--secondary:hover { + background-color: rgba(255, 255, 255, 0.05); + border-color: var(--ifm-color-primary); } /* ========================================= - Documentation Sidebar & Content + Documentation Sidebar ========================================= */ .theme-doc-sidebar-container { - border-right: 1px solid var(--brand-card-border) !important; + border-right: 1px solid var(--border-subtle) !important; } .menu__link { - border-radius: 8px; + border-radius: 6px; font-weight: 500; - margin: 2px 0; - transition: all 0.2s ease; + font-size: 0.9rem; + margin: 1px 0; + padding: 0.4rem 0.75rem; + transition: background-color 0.15s ease, color 0.15s ease; } .menu__link--active:not(.menu__link--sublist) { - background: linear-gradient( - 90deg, - rgba(139, 93, 255, 0.18) 0%, - rgba(106, 66, 194, 0.08) 100% - ) !important; - color: var(--ifm-color-primary) !important; + background-color: rgba(38, 59, 170, 0.08) !important; + color: var(--nordic-indigo) !important; font-weight: 700; - border-left: 3px solid var(--brand-purple-neon); } -.menu__link:hover:not(.menu__link--active) { - background-color: rgba(139, 93, 255, 0.08); - color: var(--ifm-color-primary); +[data-theme='dark'] .menu__link--active:not(.menu__link--sublist) { + background-color: rgba(108, 128, 234, 0.12) !important; + color: #8394ee !important; +} + +.menu__list-item-collapsible { + font-weight: 600; + font-size: 0.92rem; } /* ========================================= - Modern Code Blocks & Admonitions + Code Blocks & Admonitions ========================================= */ div[class^='codeBlockContainer_'] { - border-radius: 12px; - border: 1px solid var(--brand-card-border); - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); - overflow: hidden; + border-radius: 10px; + border: 1px solid var(--border-subtle); + box-shadow: none; } .alert { - border-radius: 12px; + border-radius: 8px; border-width: 1px; - border-left-width: 5px; - backdrop-filter: blur(8px); + border-left-width: 4px; } .alert--info { - --ifm-alert-background-color: rgba(139, 93, 255, 0.08); - --ifm-alert-border-color: #8b5dff; + background-color: rgba(38, 59, 170, 0.05); + border-color: var(--nordic-indigo); } -.alert--success { - --ifm-alert-background-color: rgba(16, 185, 129, 0.08); - --ifm-alert-border-color: #10b981; +.alert--warning { + background-color: rgba(255, 244, 212, 0.7); + border-color: #eab308; + color: #713f12; } -.alert--warning { - --ifm-alert-background-color: rgba(255, 193, 7, 0.08); - --ifm-alert-border-color: #f59e0b; +[data-theme='dark'] .alert--warning { + background-color: rgba(234, 179, 8, 0.1); + color: #fef08a; } /* ========================================= - Custom Scrollbar & Highlights + Selection ========================================= */ -::-webkit-scrollbar { - width: 8px; - height: 8px; -} - -::-webkit-scrollbar-track { - background: transparent; -} - -::-webkit-scrollbar-thumb { - background: rgba(106, 66, 194, 0.3); - border-radius: 999px; -} - -::-webkit-scrollbar-thumb:hover { - background: var(--brand-purple-neon); -} - ::selection { - background: #8b5dff; + background: var(--nordic-indigo); color: #ffffff; } + diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 02c19eb..07f3571 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -1,9 +1,7 @@ .heroBanner { - padding: 5.5rem 0 4.5rem; - position: relative; - overflow: hidden; - background: var(--brand-hero-bg); - border-bottom: 1px solid var(--brand-card-border); + padding: 4.5rem 0 3.5rem; + background-color: var(--hero-bg); + border-bottom: 1px solid var(--border-subtle); } .heroContent { @@ -11,181 +9,209 @@ flex-direction: column; align-items: center; text-align: center; - position: relative; - z-index: 2; } .versionBadge { display: inline-flex; align-items: center; gap: 0.5rem; - padding: 0.35rem 1rem; - border-radius: 9999px; - background: rgba(139, 93, 255, 0.15); - border: 1px solid rgba(139, 93, 255, 0.35); - color: var(--brand-purple-neon); - font-size: 0.88rem; - font-weight: 600; - margin-bottom: 1.5rem; - backdrop-filter: blur(8px); -} - -.badgeGlowDot { - width: 8px; - height: 8px; - border-radius: 50%; - background-color: var(--brand-cream); - box-shadow: 0 0 10px var(--brand-cream); - animation: pulseDot 2s infinite ease-in-out; + padding: 0.25rem 0.75rem; + border-radius: 6px; + background-color: var(--vanilla-cream); + color: var(--nordic-indigo); + font-size: 0.82rem; + font-weight: 700; + margin-bottom: 1.25rem; + letter-spacing: -0.01em; } -@keyframes pulseDot { - 0%, - 100% { - transform: scale(1); - opacity: 0.8; - } - 50% { - transform: scale(1.3); - opacity: 1; - } +[data-theme='dark'] .versionBadge { + background-color: rgba(255, 244, 212, 0.15); + color: var(--vanilla-cream); } .heroTitle { - font-size: 3.5rem; + font-size: 3.25rem; font-weight: 800; - letter-spacing: -1.5px; + letter-spacing: -0.03em; line-height: 1.15; - margin-bottom: 1.25rem; - max-width: 900px; + margin-bottom: 1rem; + max-width: 780px; + color: var(--nordic-indigo); +} + +[data-theme='dark'] .heroTitle { + color: #f8fafc; } -.gradientText { - background: linear-gradient(135deg, #ffffff 30%, #8b5dff 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; +.heroSubtitle { + font-size: 1.15rem; + max-width: 580px; + margin: 0 auto 1.75rem; + color: #475569; + line-height: 1.55; + letter-spacing: -0.01em; } -[data-theme='light'] .gradientText { - background: linear-gradient(135deg, #20173d 20%, #6a42c2 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; +[data-theme='dark'] .heroSubtitle { + color: #94a3b8; } -.heroSubtitle { - font-size: 1.25rem; - max-width: 720px; - margin: 0 auto 2rem; - color: var(--ifm-color-emphasis-700); - line-height: 1.6; +.installPill { + display: inline-flex; + align-items: center; + gap: 0.75rem; + background-color: var(--card-bg); + border: 1px solid var(--border-subtle); + border-radius: 8px; + padding: 0.45rem 0.85rem; + font-family: var(--ifm-font-family-monospace); + font-size: 0.85rem; + color: var(--nordic-indigo); + margin-bottom: 1.75rem; + cursor: pointer; + transition: border-color 0.15s ease, background-color 0.15s ease; + user-select: all; +} + +[data-theme='dark'] .installPill { + color: #cbd5e1; +} + +.installPill:hover { + border-color: var(--nordic-indigo); + background-color: var(--vanilla-cream-surface); +} + +.copyIcon { + font-size: 0.75rem; + opacity: 0.6; + font-family: var(--ifm-font-family-base); + font-weight: 600; + text-transform: uppercase; } .buttons { display: flex; align-items: center; justify-content: center; - gap: 1rem; - margin-bottom: 3rem; - flex-wrap: wrap; + gap: 0.75rem; + margin-bottom: 3.5rem; } /* ========================================= - Terminal Showcase Component + Git Inspection Matrix Showcase ========================================= */ -.terminalWrapper { +.inspectionCard { width: 100%; - max-width: 820px; - border-radius: 14px; - background: #0d0b17; - border: 1px solid rgba(139, 93, 255, 0.3); - box-shadow: - 0 20px 50px rgba(0, 0, 0, 0.5), - 0 0 40px rgba(106, 66, 194, 0.2); + max-width: 760px; + background-color: var(--card-bg); + border: 1px solid var(--border-subtle); + border-radius: 10px; overflow: hidden; text-align: left; } -.terminalHeader { - background: #171328; - padding: 0.75rem 1rem; +.inspectionHeader { + background-color: var(--nordic-indigo); + color: #ffffff; + padding: 0.65rem 1rem; display: flex; align-items: center; - border-bottom: 1px solid rgba(139, 93, 255, 0.15); + justify-content: space-between; + font-size: 0.82rem; + font-weight: 600; } -.terminalDots { - display: flex; - gap: 6px; +[data-theme='dark'] .inspectionHeader { + background-color: #161c38; + border-bottom: 1px solid var(--border-subtle); } -.dot { - width: 11px; - height: 11px; - border-radius: 50%; +.headerTitle { + font-family: var(--ifm-font-family-monospace); + letter-spacing: -0.01em; } -.dotRed { - background-color: #ff5f56; +.headerStatus { + background-color: var(--vanilla-cream); + color: var(--nordic-indigo); + font-size: 0.72rem; + font-weight: 700; + padding: 0.15rem 0.5rem; + border-radius: 4px; } -.dotYellow { - background-color: #ffbd2e; +.inspectionBody { + padding: 0.5rem; } -.dotGreen { - background-color: #27c93f; +.fileRow { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0.65rem 0.85rem; + border-radius: 6px; + font-size: 0.86rem; + transition: background-color 0.1s ease; } -.terminalTitle { - margin-left: auto; - margin-right: auto; - font-size: 0.82rem; - color: #a49fc4; - font-family: var(--ifm-font-family-monospace); - font-weight: 500; +.fileRow:not(:last-child) { + border-bottom: 1px solid var(--border-subtle); } -.terminalBody { - padding: 1.5rem; - font-family: var(--ifm-font-family-monospace); - font-size: 0.92rem; - line-height: 1.7; - color: #e2e0ed; - overflow-x: auto; +.fileRow:hover { + background-color: var(--vanilla-cream-surface); } -.termPrompt { - color: var(--brand-purple-neon); - font-weight: 700; +[data-theme='dark'] .fileRow:hover { + background-color: rgba(255, 255, 255, 0.03); } -.termCmd { - color: #ffffff; +.fileName { + font-family: var(--ifm-font-family-monospace); font-weight: 600; + color: #0f172a; } -.termComment { - color: #7b749d; +[data-theme='dark'] .fileName { + color: #f1f5f9; } -.termCrit { - color: #ff5577; - font-weight: 700; +.fileContext { + color: #64748b; + font-size: 0.8rem; + margin-left: 0.5rem; } -.termWarn { - color: #ffb84d; +.tagCritical { + background-color: #fee2e2; + color: #991b1b; + font-size: 0.72rem; font-weight: 700; + padding: 0.2rem 0.5rem; + border-radius: 4px; + font-family: var(--ifm-font-family-monospace); } -.termInfo { - color: #a3e635; +.tagWarning { + background-color: var(--vanilla-cream); + color: #854d0e; + font-size: 0.72rem; font-weight: 700; + padding: 0.2rem 0.5rem; + border-radius: 4px; + font-family: var(--ifm-font-family-monospace); } -.termOk { - color: #4ade80; +.tagInfo { + background-color: #e2e8f0; + color: #334155; + font-size: 0.72rem; font-weight: 700; + padding: 0.2rem 0.5rem; + border-radius: 4px; + font-family: var(--ifm-font-family-monospace); } @media screen and (max-width: 768px) { @@ -195,11 +221,17 @@ .heroTitle { font-size: 2.25rem; } - .heroSubtitle { - font-size: 1.05rem; + .buttons { + flex-direction: column; + width: 100%; } - .terminalBody { - padding: 1rem; - font-size: 0.8rem; + .buttons .button { + width: 100%; + } + .fileRow { + flex-direction: column; + align-items: flex-start; + gap: 0.4rem; } } + diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index 65c47cd..97e2804 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -1,118 +1,93 @@ -import type { ReactNode } from 'react'; -import clsx from 'clsx'; +import { useState, type ReactNode } from 'react'; import Link from '@docusaurus/Link'; -import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import Layout from '@theme/Layout'; import HomepageFeatures from '@site/src/components/HomepageFeatures'; import Heading from '@theme/Heading'; import styles from './index.module.css'; -function TerminalPreview() { +function GitInspectionShowcase() { return ( -
-
-
- - - -
- envguard terminal • zsh / powershell +
+
+ envguard scan --format text + Git Inspection
-
-
- $ - envguard scan -
-
- [envguard] Varrendo repositório em busca de arquivos de ambiente sensíveis... -
-
-
- ✗ .env{' '} -               {' '} - CRITICAL   Arquivo rastreado no Git - (commitado) -
-
- ⚠ .env.production    {' '} - WARNING    Não ignorado no .gitignore -
-
- ✓ .env.example{' '} -        INFO{' '} -       Template padrão identificado +
+
+
+ .env + • Tracked in Git commit history +
+ CRITICAL
-
-
- [ERRO] Encontrado 1 problema CRITICAL e 1 - WARNING. +
+
+ .env.production + • Not ignored in .gitignore +
+ WARNING
-
- - Dica: execute `envguard fix` para adicionar ao .gitignore e remover do cache Git. - +
+
+ .env.example + • Allowlisted sample template +
+ SAFE (INFO)
); } +function InstallCommand() { + const [copied, setCopied] = useState(false); + const cmd = 'go install github.com/joaooncode/envguard/cmd/envguard@latest'; + + const handleCopy = () => { + navigator.clipboard.writeText(cmd); + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }; + + return ( +
+ $ {cmd} + {copied ? 'COPIADO ✓' : 'COPIAR'} +
+ ); +} + function HomepageHeader() { - const { siteConfig } = useDocusaurusContext(); return (
- - v0.2.0 • Proteção Git-Aware para Segredos + envguard v0.2.0
- Segurança de .env -
- com Consciência do Git + Proteção de segredos .env com inteligência do Git
-

- Evite que arquivos .env e credenciais de ambiente vazem ou cheguem ao - histórico de versionamento do Git. +

+ Detecte, alerte e impeça que arquivos de variáveis de ambiente e credenciais cheguem ao + histórico do Git.

-
- Go Version - License: MIT - 100% Offline -
+
- - ⚡ Início Rápido (3 min) + + Início Rápido - - 📖 Explorar Documentação + + Documentação
- +
@@ -132,3 +107,4 @@ export default function Home(): ReactNode { ); } + diff --git a/website/static/img/logo.svg b/website/static/img/logo.svg index 53f8633..51d25d7 100644 --- a/website/static/img/logo.svg +++ b/website/static/img/logo.svg @@ -1,37 +1,11 @@ - - - - - - - - - - - - - - - - - - - - - - - - - + + + - - - + + - - + + + \ No newline at end of file From 5bd6e8f7edc9513684ef8db5490f2284b6f428f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Vitor=20R=2E=20da=20Silva?= Date: Fri, 4 Sep 2026 00:09:15 -0300 Subject: [PATCH 4/4] style(website): formatar arquivos com prettier --- website/sidebars.ts | 1 - .../src/components/HomepageFeatures/index.tsx | 17 ++++++++++------- .../HomepageFeatures/styles.module.css | 5 +++-- website/src/css/custom.css | 9 ++++++--- website/src/pages/index.module.css | 5 +++-- website/src/pages/index.tsx | 1 - 6 files changed, 22 insertions(+), 16 deletions(-) diff --git a/website/sidebars.ts b/website/sidebars.ts index 9b48c15..00a0b9c 100644 --- a/website/sidebars.ts +++ b/website/sidebars.ts @@ -49,4 +49,3 @@ const sidebars: SidebarsConfig = { }; export default sidebars; - diff --git a/website/src/components/HomepageFeatures/index.tsx b/website/src/components/HomepageFeatures/index.tsx index 04f1030..8f780d1 100644 --- a/website/src/components/HomepageFeatures/index.tsx +++ b/website/src/components/HomepageFeatures/index.tsx @@ -15,8 +15,9 @@ const PillarList: PillarItem[] = [ title: 'Consciência da Árvore Git', description: ( <> - Diferencia com precisão se arquivos de ambiente estão comitados no histórico (tracked), - preparados para o próximo commit (staged) ou desprotegidos contra regras do .gitignore. + Diferencia com precisão se arquivos de ambiente estão comitados no histórico ( + tracked), preparados para o próximo commit (staged) ou desprotegidos + contra regras do .gitignore. ), }, @@ -25,8 +26,9 @@ const PillarList: PillarItem[] = [ title: '100% Local & Determinístico', description: ( <> - Desenvolvido em Go nativo, executa instantaneamente em pipelines e máquinas locais sem qualquer telemetria. - Valores de variáveis e credenciais nunca são impressos em terminal ou logs. + Desenvolvido em Go nativo, executa instantaneamente em pipelines e máquinas locais sem + qualquer telemetria. Valores de variáveis e credenciais nunca são impressos em terminal ou + logs. ), }, @@ -35,7 +37,8 @@ const PillarList: PillarItem[] = [ title: 'Pre-Commit & Autocorreção', description: ( <> - Instale pre-commit hooks nativos com envguard hook install e execute correções automáticas no + Instale pre-commit hooks nativos com envguard hook install e execute correções + automáticas no .gitignore e no cache do Git através de envguard fix. ), @@ -65,7 +68,8 @@ export default function HomepageFeatures(): ReactNode { Construído para engenharia e segurança

- Prevenção ativa contra vazamento de segredos sem adicionar atrito ou dependências lentas. + Prevenção ativa contra vazamento de segredos sem adicionar atrito ou dependências + lentas.

@@ -77,4 +81,3 @@ export default function HomepageFeatures(): ReactNode { ); } - diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css index 10f156f..e9ca367 100644 --- a/website/src/components/HomepageFeatures/styles.module.css +++ b/website/src/components/HomepageFeatures/styles.module.css @@ -44,7 +44,9 @@ border-radius: 8px; background-color: var(--card-bg); border: 1px solid var(--border-subtle); - transition: border-color 0.15s ease, transform 0.15s ease; + transition: + border-color 0.15s ease, + transform 0.15s ease; display: flex; flex-direction: column; } @@ -94,4 +96,3 @@ [data-theme='dark'] .pillarDescription { color: #94a3b8; } - diff --git a/website/src/css/custom.css b/website/src/css/custom.css index ccae724..36da690 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -110,7 +110,9 @@ background-color: var(--ifm-background-surface-color) !important; font-size: 0.85rem !important; padding: 0.4rem 0.8rem 0.4rem 2rem !important; - transition: border-color 0.15s ease, box-shadow 0.15s ease !important; + transition: + border-color 0.15s ease, + box-shadow 0.15s ease !important; } .navbar__search-input:focus { @@ -188,7 +190,9 @@ font-size: 0.9rem; margin: 1px 0; padding: 0.4rem 0.75rem; - transition: background-color 0.15s ease, color 0.15s ease; + transition: + background-color 0.15s ease, + color 0.15s ease; } .menu__link--active:not(.menu__link--sublist) { @@ -245,4 +249,3 @@ div[class^='codeBlockContainer_'] { background: var(--nordic-indigo); color: #ffffff; } - diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css index 07f3571..98e9ce6 100644 --- a/website/src/pages/index.module.css +++ b/website/src/pages/index.module.css @@ -70,7 +70,9 @@ color: var(--nordic-indigo); margin-bottom: 1.75rem; cursor: pointer; - transition: border-color 0.15s ease, background-color 0.15s ease; + transition: + border-color 0.15s ease, + background-color 0.15s ease; user-select: all; } @@ -234,4 +236,3 @@ gap: 0.4rem; } } - diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index 97e2804..a959c73 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -107,4 +107,3 @@ export default function Home(): ReactNode { ); } -