diff --git a/docusaurus/package-lock.json b/docusaurus/package-lock.json index d95d69eea6..77a6711448 100644 --- a/docusaurus/package-lock.json +++ b/docusaurus/package-lock.json @@ -13,6 +13,7 @@ "@easyops-cn/docusaurus-search-local": "^0.52.2", "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", + "ionicons": "^8.0.13", "prism-react-renderer": "^2.3.0", "react": "^19.0.0", "react-dom": "^19.0.0" @@ -4848,6 +4849,110 @@ "integrity": "sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==", "license": "MIT" }, + "node_modules/@rollup/rollup-darwin-arm64": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.34.9.tgz", + "integrity": "sha512-0CY3/K54slrzLDjOA7TOjN1NuLKERBgk9nY5V34mhmuu673YNb+7ghaDUs6N0ujXR7fz5XaS5Aa6d2TNxZd0OQ==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-darwin-x64": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.34.9.tgz", + "integrity": "sha512-eOojSEAi/acnsJVYRxnMkPFqcxSMFfrw7r2iD9Q32SGkb/Q9FpUY1UlAu1DH9T7j++gZ0lHjnm4OyH2vCI7l7Q==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-gnu": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.34.9.tgz", + "integrity": "sha512-6TZjPHjKZUQKmVKMUowF3ewHxctrRR09eYyvT5eFv8w/fXarEra83A2mHTVJLA5xU91aCNOUnM+DWFMSbQ0Nxw==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm64-musl": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.34.9.tgz", + "integrity": "sha512-LD2fytxZJZ6xzOKnMbIpgzFOuIKlxVOpiMAXawsAZ2mHBPEYOnLRK5TTEsID6z4eM23DuO88X0Tq1mErHMVq0A==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-gnu": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.34.9.tgz", + "integrity": "sha512-FwBHNSOjUTQLP4MG7y6rR6qbGw4MFeQnIBrMe161QGaQoBQLqSUEKlHIiVgF3g/mb3lxlxzJOpIBhaP+C+KP2A==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-x64-musl": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.34.9.tgz", + "integrity": "sha512-cYRpV4650z2I3/s6+5/LONkjIz8MBeqrk+vPXV10ORBnshpn8S32bPqQ2Utv39jCiDcO2eJTuSlPXpnvmaIgRA==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-win32-arm64-msvc": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.34.9.tgz", + "integrity": "sha512-z4mQK9dAN6byRA/vsSgQiPeuO63wdiDxZ9yg9iyX2QTzKuQM7T4xlBoeUP/J8uiFkqxkcWndWi+W7bXdPbt27Q==", + "cpu": [ + "arm64" + ], + "license": "MIT", + "optional": true, + "os": [ + "win32" + ] + }, + "node_modules/@rollup/rollup-win32-x64-msvc": { + "version": "4.34.9", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.34.9.tgz", + "integrity": "sha512-AyleYRPU7+rgkMWbEh71fQlrzRfeP6SyMnRf9XX4fCdDPAJumdSBqYEcWPMzVQ4ScAl7E4oFfK0GUVn77xSwbw==", + "cpu": [ + "x64" + ], + "license": "MIT", + "optional": true, + "os": [ + "win32" + ] + }, "node_modules/@sideway/address": { "version": "4.1.5", "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz", @@ -4904,6 +5009,29 @@ "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==", "license": "MIT" }, + "node_modules/@stencil/core": { + "version": "4.39.0", + "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.39.0.tgz", + "integrity": "sha512-wLASFh5wecnbxY+9pEPd6bl7AZJksLmuiBd0ShvkJ0v/N1nL4HNSw/jq2+TzgFE1+XqCUhKPDeVXFpZf1uuRDw==", + "license": "MIT", + "bin": { + "stencil": "bin/stencil" + }, + "engines": { + "node": ">=16.0.0", + "npm": ">=7.10.0" + }, + "optionalDependencies": { + "@rollup/rollup-darwin-arm64": "4.34.9", + "@rollup/rollup-darwin-x64": "4.34.9", + "@rollup/rollup-linux-arm64-gnu": "4.34.9", + "@rollup/rollup-linux-arm64-musl": "4.34.9", + "@rollup/rollup-linux-x64-gnu": "4.34.9", + "@rollup/rollup-linux-x64-musl": "4.34.9", + "@rollup/rollup-win32-arm64-msvc": "4.34.9", + "@rollup/rollup-win32-x64-msvc": "4.34.9" + } + }, "node_modules/@svgr/babel-plugin-add-jsx-attribute": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz", @@ -9923,6 +10051,15 @@ "loose-envify": "^1.0.0" } }, + "node_modules/ionicons": { + "version": "8.0.13", + "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-8.0.13.tgz", + "integrity": "sha512-2QQVyG2P4wszne79jemMjWYLp0DBbDhr4/yFroPCxvPP1wtMxgdIV3l5n+XZ5E9mgoXU79w7yTWpm2XzJsISxQ==", + "license": "MIT", + "dependencies": { + "@stencil/core": "^4.35.3" + } + }, "node_modules/ipaddr.js": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.3.0.tgz", diff --git a/docusaurus/package.json b/docusaurus/package.json index 89a7cd7c0f..aabd306943 100644 --- a/docusaurus/package.json +++ b/docusaurus/package.json @@ -20,6 +20,7 @@ "@easyops-cn/docusaurus-search-local": "^0.52.2", "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", + "ionicons": "^8.0.13", "prism-react-renderer": "^2.3.0", "react": "^19.0.0", "react-dom": "^19.0.0" diff --git a/docusaurus/src/pages/index.module.css b/docusaurus/src/pages/index.module.css index 8f16892b2b..2e161080f7 100644 --- a/docusaurus/src/pages/index.module.css +++ b/docusaurus/src/pages/index.module.css @@ -3,85 +3,340 @@ } .hero { - padding: 5rem 0 4rem; - background: linear-gradient(140deg, #f6f7fb 0%, #f0f6f3 60%, #e9f2ef 100%); + padding: 4rem 0; + background-color: #FFFFFF; + /* 1st layer: A mask that allows the dots to show only in the center. + 2nd layer: The actual dotted grid. + */ + background-image: + radial-gradient(circle at center, #ffffff96 35%, #ffffffab 35%, transparent 30%), + radial-gradient(circle at 1px 1px, rgba(13, 23, 38, 0.3) 1px, transparent 1px); + + background-size: cover, 20px 20px; + background-position: center, 0 0; + background-repeat: no-repeat, repeat; } .heroInner { margin: 0 auto; max-width: 960px; padding: 0 1.5rem; - text-align: left; -} - -.kicker { - text-transform: uppercase; - letter-spacing: 0.18em; - font-size: 0.75rem; - margin: 0 0 0.75rem; - color: #5b6775; + text-align: center; } -.title { - font-size: clamp(2.2rem, 2.8vw + 1.5rem, 3.6rem); - line-height: 1.05; +.heroTitle { + font-size: clamp(2rem, 2.5vw + 1rem, 3rem); + line-height: 1.2; margin: 0 0 1rem; + color: #0d1726; } -.subtitle { - font-size: 1.125rem; - max-width: 40rem; +.heroSubtitle { + font-size: 1rem; margin: 0 0 2rem; - color: #3b4654; + color: #5b6775; } -.ctaRow { +.searchBox { display: flex; - flex-wrap: wrap; gap: 0.75rem; + justify-content: center; + margin-top: 2rem; } -.primaryCta, -.secondaryCta { - border-radius: 999px; - padding: 0.75rem 1.6rem; +.searchInput { + flex: 0 1 300px; + padding: 0.75rem 1rem; + border: 1px solid #d4d9e0; + border-radius: 0.5rem; + font-size: 0.9rem; + background: #ffffff; +} + +.searchButton { + padding: 0.75rem 1.5rem; + background: #0052cc; + color: #ffffff; + border: none; + border-radius: 0.5rem; font-weight: 600; + cursor: pointer; + font-size: 0.9rem; +} + +.searchButton:hover { + background: #003fa3; +} + +/* Feature Cards Section */ +.featureCardsContainer { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(450px, 1fr)); + gap: 2rem; + margin-bottom: 3rem auto; + max-width: 1200px; + padding: 0 1.5rem; +} + +.featureCard { + background: #ffffff; + border: 1px solid #e1e5ea; + border-radius: 1rem; + padding: 2rem; + box-shadow: 0 4px 12px rgba(13, 23, 38, 0.08); +} + +.featureCardHeader { + display: flex; + align-items: flex-start; + gap: 1rem; + margin-bottom: 1rem; +} + +.featureIcon { + font-size: 2rem; + line-height: 1; +} + +.featureCardHeader h2 { + margin: 0; + font-size: 1.25rem; + color: #0d1726; +} + +.featureCard p { + font-size: 0.9rem; + color: #5b6775; + line-height: 1.6; + margin-bottom: 1.5rem; +} + +.featureCardContent { + background: #f5f7fb; + border-radius: 0.75rem; + padding: 1.5rem; + min-height: 150px; +} + +.featureCardPlaceholder { + color: #5b6775; + font-size: 0.9rem; + font-weight: 500; +} + +/* Codacy AI Section */ +.codacyAiSection { + background: #ffffff; + border: #DFE4EC 1px solid; + border-radius: 1rem; + padding: 2rem; + margin-top: 4rem; + margin-bottom: 4rem; + display: flex; + align-items: center; + justify-content: center; + padding: 2rem 0; +} + +.codacyAiContent { + display: flex; + align-items: center; + gap: 1rem; + padding: 1rem; +} + +.codacyAiIcon { + display: inline-block; + width: 36px; + height: 36px; + object-fit: contain; +} + +.codacyAiContent h2 { + margin: 0; + font-size: 1.5rem; + color: #0d1726; +} + +.viewDocsLink { + color: #0052cc; text-decoration: none; + font-weight: 500; + font-size: 0.95rem; } -.primaryCta { - background: #0d1726; - color: #ffffff; +.viewDocsLink:hover { + text-decoration: underline; } -.secondaryCta { - border: 1px solid #0d1726; +/* Most Popular Topics */ +.topicsSection { + margin: 4rem auto; + max-width: 1200px; + padding: 0 1.5rem; +} + +.sectionTitle { + font-size: 1.75rem; color: #0d1726; + margin: 0 0 2rem; + text-align: center; } -.grid { +.topicsGrid { display: grid; - grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 1.5rem; - margin: 3.5rem auto 0; - max-width: 1000px; +} + +.topicCard { + background: #f5f7fb; + border-radius: 1rem; + padding: 2rem; + transition: background-color 0.2s ease; +} + +.topicCard:hover { + background: #eff1f5; +} + +.topicCardHeader { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 1rem; + margin-bottom: 1rem; +} + +.topicCardHeader h3 { + margin: 0; + font-size: 1.125rem; + color: #0d1726; + font-weight: 600; + flex: 1; +} + +.topicArrow { + color: #0052cc; + font-size: 1.125rem; + flex-shrink: 0; + margin-top: 0.1rem; +} + +.topicCard p { + margin: 0; + font-size: 0.9rem; + color: #5b6775; + line-height: 1.6; +} + +/* Help and Support Section */ +.supportSection { + margin: 4rem auto; + max-width: 1200px; padding: 0 1.5rem; } -.card { +.supportGrid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); + gap: 1.5rem; +} + +.supportCard { background: #ffffff; border: 1px solid #e1e5ea; - border-radius: 1.25rem; - padding: 1.75rem; - box-shadow: 0 10px 30px rgba(13, 23, 38, 0.08); + border-radius: 1rem; + padding: 2rem; + box-shadow: 0 4px 12px rgba(13, 23, 38, 0.08); } -.card h2 { - margin-top: 0; +.supportCardHeader { + display: flex; + align-items: flex-start; + gap: 1rem; + margin-bottom: 1rem; } -@media (max-width: 700px) { - .hero { - padding: 3rem 0 2.5rem; - } +.supportIcon { + font-size: 1.75rem; + line-height: 1; + flex-shrink: 0; +} + +.supportCardHeader h3 { + margin: 0; + font-size: 1.125rem; + color: #0d1726; + font-weight: 600; +} + +.supportCard p { + font-size: 0.9rem; + color: #5b6775; + line-height: 1.6; + margin-bottom: 1.5rem; } + +.supportCardActions { + display: flex; + gap: 0.75rem; +} + +.supportButtonYes, +.supportButtonNo { + padding: 0.5rem 1rem; + border: 1px solid #d4d9e0; + border-radius: 0.5rem; + background: #ffffff; + color: #0d1726; + font-weight: 500; + cursor: pointer; + font-size: 0.85rem; +} + +.supportButtonYes:hover { + background: #f5f7fb; +} + +.supportButtonNo:hover { + background: #f5f7fb; +} + +.supportCardLink { + color: #0052cc; + text-decoration: none; + font-weight: 500; + font-size: 0.9rem; +} + +.supportCardLink:hover { + text-decoration: underline; +} + +@media (max-width: 768px) { + .featureCardsContainer { + grid-template-columns: 1fr; + } + + .codacyAiSection { + flex-direction: column; + text-align: center; + } + + .topicsGrid { + grid-template-columns: 1fr; + } + + .supportGrid { + grid-template-columns: 1fr; + } + + .searchBox { + flex-direction: column; + } + + .searchInput { + flex: 1; + } +} \ No newline at end of file diff --git a/docusaurus/src/pages/index.tsx b/docusaurus/src/pages/index.tsx index 685d069647..e54f1e20da 100644 --- a/docusaurus/src/pages/index.tsx +++ b/docusaurus/src/pages/index.tsx @@ -8,41 +8,140 @@ export default function Home(): React.JSX.Element { return (
+ {/* Hero Section */}
-

Codacy Docs

-

Documentation that ships fast

-

- Practical guides, API references, and release notes for Codacy. -

-
- - Explore docs - - - Release notes - +

Codacy Docs

+

This is a placeholder to say how amazing we are.

+ +
+ +
-
-
-

Get started

-

Install, configure, and ship with confidence.

- Start here -
-
-

API guides

-

Automate workflows with Codacy APIs.

- Browse API docs + {/* Feature Cards Section */} +
+
+
+
🚀
+

Get started

+
+

Codacy is an automated code quality and coverage platform that analyzes your source code and identifies issues as you go.

+
+ {/* Placeholder for embedded content */} +
+

Configuring poc-codacy

+
+
-
-

Integrations

-

Connect Codacy with your CI and SCM tools.

- See integrations + +
+
+
📁
+

Manage organizations

+
+

Codacy let you automatically import your Git provider organizations, repositories and team members into Codacy with a few clicks.

+
+ {/* Placeholder for embedded content */} +
+

Organizations

+
+
+ + {/* Codacy AI Section */} +
+
+ Codacy AI +

Codacy AI

+
+ + View documentation → + +
+ + {/* Most Popular Topics */} +
+

Most popular topics

+ +
+
+
+

Adding coverage to your repository

+ → +
+

Set up your repositories to show code coverage reports directly on Codacy.

+
+ +
+
+

Understanding issues

+ → +
+

Learn how Codacy report issues, how to triage them, and what to do next.

+
+ +
+
+

Managing people in organizations

+ → +
+

Invite your teammates to join Codacy to analyze their commits on private repositories.

+
+ +
+
+

Using the Codacy API

+ → +
+

Retrieve and analyze data from Codacy and perform configuration changes programmatically.

+
+
+
+ + {/* Help and Support Section */} +
+

Help and support

+ +
+
+
+ 🔍 +

Did you find everything you need?

+
+

Help us improve your experience. Let us know whether this page answered your questions, so we can make our documentation clearer and more useful for you.

+
+ + +
+
+ +
+
+ 💬 +

Support

+
+

Our support team is here to assist you with any questions about using Codacy effectively in your workflow.

+ Contact us → +
+ +
+
+ ❓ +

FAQs

+
+

Browse our frequently asked questions to find clear explanations and best practices for getting the most out of Codacy. No support ticket required.

+ View FAQs → +
+
+
); diff --git a/docusaurus/src/theme/Footer/styles.module.css b/docusaurus/src/theme/Footer/styles.module.css index 1e03379394..825c484878 100644 --- a/docusaurus/src/theme/Footer/styles.module.css +++ b/docusaurus/src/theme/Footer/styles.module.css @@ -1,5 +1,5 @@ .footer { - --footer-bg: var(--ifm-color-emphasis-300); + --footer-bg: var(--ifm-color-gray-200); --footer-text: var(--ifm-color-emphasis-800); --footer-link: var(--ifm-color-emphasis-800); --footer-gap: 2rem; diff --git a/docusaurus/static/img/icons/bubble.svg b/docusaurus/static/img/icons/bubble.svg new file mode 100644 index 0000000000..54a12db2b6 --- /dev/null +++ b/docusaurus/static/img/icons/bubble.svg @@ -0,0 +1,4 @@ + + + + diff --git a/docusaurus/static/img/icons/folder.svg b/docusaurus/static/img/icons/folder.svg new file mode 100644 index 0000000000..f7b10b39a4 --- /dev/null +++ b/docusaurus/static/img/icons/folder.svg @@ -0,0 +1,4 @@ + + + + diff --git a/docusaurus/static/img/icons/person.svg b/docusaurus/static/img/icons/person.svg new file mode 100644 index 0000000000..61d677519b --- /dev/null +++ b/docusaurus/static/img/icons/person.svg @@ -0,0 +1,4 @@ + + + + diff --git a/docusaurus/static/img/icons/rocket.svg b/docusaurus/static/img/icons/rocket.svg new file mode 100644 index 0000000000..f94a1f0f4c --- /dev/null +++ b/docusaurus/static/img/icons/rocket.svg @@ -0,0 +1,3 @@ + + + diff --git a/docusaurus/static/img/icons/search.svg b/docusaurus/static/img/icons/search.svg new file mode 100644 index 0000000000..59e4bf67c7 --- /dev/null +++ b/docusaurus/static/img/icons/search.svg @@ -0,0 +1,4 @@ + + + + diff --git a/docusaurus/static/img/icons/sparkles.svg b/docusaurus/static/img/icons/sparkles.svg new file mode 100644 index 0000000000..dc5ef47cff --- /dev/null +++ b/docusaurus/static/img/icons/sparkles.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + +