Skip to content

Commit 35553fb

Browse files
claudiacodacyclaudiacodacy
authored
feat: Improve theme (#2)
* main section * added to sidebar too * homepage + sidebar + footer * footer structure * review footer
1 parent 9bf2a26 commit 35553fb

File tree

16 files changed

+498
-99
lines changed

16 files changed

+498
-99
lines changed

‎docusaurus/docusaurus.config.ts‎

Lines changed: 48 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ import type * as Preset from '@docusaurus/preset-classic';
66
// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
77

88
const config: Config = {
9-
title: 'My Site',
10-
tagline: 'Dinosaurs are cool',
9+
title: 'Codacy Docs',
10+
tagline: 'Documentation for the Codacy automated code review tool.',
1111
favicon: 'img/codacy-favicon.ico',
1212

1313
// Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future
@@ -43,12 +43,23 @@ const config: Config = {
4343
locales: ['en'],
4444
},
4545

46+
scripts: [
47+
{
48+
src: "https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js",
49+
type: "module",
50+
},
51+
{
52+
src: "https://unpkg.com/[email protected]/dist/ionicons/ionicons.js",
53+
nomodule: true,
54+
},
55+
],
56+
4657
presets: [
4758
[
4859
'classic',
4960
{
5061
docs: {
51-
routeBasePath: '/',
62+
routeBasePath: '/docs',
5263
sidebarPath: './sidebars.ts',
5364
breadcrumbs: false,
5465
},
@@ -115,13 +126,13 @@ const config: Config = {
115126
darkTheme: prismThemes.dracula,
116127
},
117128
footer: {
118-
style: 'dark',
129+
style: 'light',
119130
links: [
120131
{
121132
title: 'Docs',
122133
items: [
123-
{label: 'Documentation', to: '/'},
124-
{label: 'Release notes', to: '/release-notes/'},
134+
{label: 'Documentation', to: '/docs/'},
135+
{label: 'Release notes', to: '/docs/release-notes/'},
125136
],
126137
},
127138
{
@@ -135,6 +146,37 @@ const config: Config = {
135146
copyright: `Copyright © ${new Date().getFullYear()} Codacy`,
136147
},
137148
} satisfies Preset.ThemeConfig,
149+
customFields: {
150+
footerNavLinks: [
151+
{label: 'Why Codacy', href: 'https://www.codacy.com/why-codacy'},
152+
{label: 'Platform', href: 'https://www.codacy.com'},
153+
{label: 'Resources', href: 'https://www.codacy.com/resources'},
154+
{label: 'About us', href: 'https://www.codacy.com/about'},
155+
],
156+
footerSocialLinks: [
157+
{
158+
label: 'GitHub',
159+
href: 'https://github.com/codacy/docs',
160+
icon: 'logo-github',
161+
},
162+
{
163+
label: 'LinkedIn',
164+
href: 'https://linkedin.com/company/codacy',
165+
icon: 'logo-linkedin',
166+
},
167+
{
168+
label: 'YouTube',
169+
href: 'https://youtube.com/@codacydev',
170+
icon: 'logo-youtube',
171+
},
172+
],
173+
footerPrivacyLink: {
174+
label: 'Privacy policy',
175+
href: 'https://example.com/privacy',
176+
},
177+
},
138178
};
139179

180+
181+
140182
export default config;

‎docusaurus/src/components/ContentFooter/index.tsx‎

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎docusaurus/src/components/ContentFooter/styles.module.css‎

Lines changed: 0 additions & 34 deletions
This file was deleted.

‎docusaurus/src/css/custom.css‎

Lines changed: 2 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@
1313
@import './imports/components/search.css';
1414
@import './imports/components/navbar.css';
1515
@import './imports/components/nav-multistep.css';
16-
17-
16+
@import './imports/components/main-section.css';
17+
@import './imports/components/footer.css';
1818

1919
.table-of-contents__left-border {
2020
border: none;
@@ -25,19 +25,4 @@
2525
background-repeat: no-repeat;
2626
}
2727

28-
.menu {
29-
padding: 0.5rem
30-
}
31-
32-
.theme-layout-main .container {
33-
padding: 0 4rem;
34-
margin: 4rem auto;
35-
}
36-
37-
@media (max-width: 1200px){
38-
.theme-layout-main .container {
39-
padding: 1.5rem;
40-
margin: 0;
41-
}
42-
}
4328

‎docusaurus/src/css/imports/components/footer.css‎

Whitespace-only changes.

‎docusaurus/src/css/imports/components/main-section.css‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
@media (min-width: 997px) {
2+
.main-wrapper {
3+
margin: 0 2rem;
4+
}
5+
6+
.menu {
7+
border: 1px solid var(--ifm-color-emphasis-300);
8+
border-radius: 1rem 0 0 1rem;
9+
padding: 1rem 0.5rem !important;
10+
position: relative;
11+
}
12+
13+
.menu::after {
14+
content: '';
15+
position: fixed;
16+
display: block;
17+
width: calc(var(--doc-sidebar-width));
18+
height: 2rem;
19+
border-color: var(--ifm-color-emphasis-300);
20+
border-style: solid;
21+
border-width: 1px 0 0 1px;
22+
border-radius: 1rem 0 0 0;
23+
top: calc(var(--ifm-navbar-height));
24+
left: 2rem;
25+
z-index: 2;
26+
}
27+
28+
.menu::before {
29+
content: '';
30+
position: fixed;
31+
width: 1rem;
32+
height: 10rem;
33+
background: var(--ifm-background-surface-color);
34+
top: calc(var(--ifm-navbar-height) - 9rem);
35+
left: 2rem;
36+
z-index: 1;
37+
}
38+
39+
}
40+
41+
@media (max-width: 1200px){
42+
.theme-layout-main .container {
43+
padding: 1.5rem;
44+
margin: 0;
45+
}
46+
}
47+
48+
@layer docusaurus.infima {
49+
@media (min-width: 997px) {
50+
.theme-layout-main .container {
51+
padding: 4rem;
52+
}
53+
}
54+
}

‎docusaurus/src/css/imports/components/navbar.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66

77
.navbar {
88
box-shadow: none;
9-
border-bottom: 1px solid var(--ifm-toc-border-color);
109
}
1110

1211
.navbar__title {

‎docusaurus/src/pages/index.module.css‎

Lines changed: 80 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,87 @@
1-
/**
2-
* CSS files with the .module.css suffix will be treated as CSS modules
3-
* and scoped locally.
4-
*/
1+
.homepage {
2+
padding-bottom: 6rem;
3+
}
54

6-
.heroBanner {
7-
padding: 4rem 0;
8-
text-align: center;
9-
position: relative;
10-
overflow: hidden;
5+
.hero {
6+
padding: 5rem 0 4rem;
7+
background: linear-gradient(140deg, #f6f7fb 0%, #f0f6f3 60%, #e9f2ef 100%);
118
}
129

13-
@media screen and (max-width: 996px) {
14-
.heroBanner {
15-
padding: 2rem;
16-
}
10+
.heroInner {
11+
margin: 0 auto;
12+
max-width: 960px;
13+
padding: 0 1.5rem;
14+
text-align: left;
15+
}
16+
17+
.kicker {
18+
text-transform: uppercase;
19+
letter-spacing: 0.18em;
20+
font-size: 0.75rem;
21+
margin: 0 0 0.75rem;
22+
color: #5b6775;
23+
}
24+
25+
.title {
26+
font-size: clamp(2.2rem, 2.8vw + 1.5rem, 3.6rem);
27+
line-height: 1.05;
28+
margin: 0 0 1rem;
1729
}
1830

19-
.buttons {
31+
.subtitle {
32+
font-size: 1.125rem;
33+
max-width: 40rem;
34+
margin: 0 0 2rem;
35+
color: #3b4654;
36+
}
37+
38+
.ctaRow {
2039
display: flex;
21-
align-items: center;
22-
justify-content: center;
40+
flex-wrap: wrap;
41+
gap: 0.75rem;
42+
}
43+
44+
.primaryCta,
45+
.secondaryCta {
46+
border-radius: 999px;
47+
padding: 0.75rem 1.6rem;
48+
font-weight: 600;
49+
text-decoration: none;
50+
}
51+
52+
.primaryCta {
53+
background: #0d1726;
54+
color: #ffffff;
55+
}
56+
57+
.secondaryCta {
58+
border: 1px solid #0d1726;
59+
color: #0d1726;
60+
}
61+
62+
.grid {
63+
display: grid;
64+
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
65+
gap: 1.5rem;
66+
margin: 3.5rem auto 0;
67+
max-width: 1000px;
68+
padding: 0 1.5rem;
69+
}
70+
71+
.card {
72+
background: #ffffff;
73+
border: 1px solid #e1e5ea;
74+
border-radius: 1.25rem;
75+
padding: 1.75rem;
76+
box-shadow: 0 10px 30px rgba(13, 23, 38, 0.08);
77+
}
78+
79+
.card h2 {
80+
margin-top: 0;
81+
}
82+
83+
@media (max-width: 700px) {
84+
.hero {
85+
padding: 3rem 0 2.5rem;
86+
}
2387
}

‎docusaurus/src/pages/index.tsx‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import React from 'react';
2+
import Layout from '@theme/Layout';
3+
import Link from '@docusaurus/Link';
4+
5+
import styles from './index.module.css';
6+
7+
export default function Home(): React.JSX.Element {
8+
return (
9+
<Layout title="Home" description="Codacy Docs homepage">
10+
<main className={styles.homepage}>
11+
<section className={styles.hero}>
12+
<div className={styles.heroInner}>
13+
<p className={styles.kicker}>Codacy Docs</p>
14+
<h1 className={styles.title}>Documentation that ships fast</h1>
15+
<p className={styles.subtitle}>
16+
Practical guides, API references, and release notes for Codacy.
17+
</p>
18+
<div className={styles.ctaRow}>
19+
<Link className={styles.primaryCta} to="/docs/">
20+
Explore docs
21+
</Link>
22+
<Link className={styles.secondaryCta} to="/docs/release-notes/">
23+
Release notes
24+
</Link>
25+
</div>
26+
</div>
27+
</section>
28+
29+
<section className={styles.grid}>
30+
<article className={styles.card}>
31+
<h2>Get started</h2>
32+
<p>Install, configure, and ship with confidence.</p>
33+
<Link to="/docs/getting-started/">Start here</Link>
34+
</article>
35+
<article className={styles.card}>
36+
<h2>API guides</h2>
37+
<p>Automate workflows with Codacy APIs.</p>
38+
<Link to="/docs/codacy-api/">Browse API docs</Link>
39+
</article>
40+
<article className={styles.card}>
41+
<h2>Integrations</h2>
42+
<p>Connect Codacy with your CI and SCM tools.</p>
43+
<Link to="/docs/repositories-configure/">See integrations</Link>
44+
</article>
45+
</section>
46+
</main>
47+
</Layout>
48+
);
49+
}

‎docusaurus/src/pages/markdown-page.md‎

Lines changed: 0 additions & 7 deletions
This file was deleted.

0 commit comments

Comments
 (0)