Skip to content

Commit 63fa98d

Browse files
authored
Docs Style Improvements (#404)
* Improve documentation navigation styling and active page marking
1 parent 03f5f47 commit 63fa98d

6 files changed

Lines changed: 152 additions & 4 deletions

File tree

docs/assets/custom.css

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,91 @@
33
--md-primary-fg-color: #406B36;
44
--md-primary-fg-color--light: #B9CF7E;
55
--md-primary-fg-color--dark: #2A4A25;
6+
}
7+
8+
/* ─────────────── Navigation Hierarchy & Active States ─────────────── */
9+
10+
/* Base navigation styling - unified font sizes */
11+
.md-nav__link {
12+
font-size: 0.8rem;
13+
}
14+
15+
/* Level 1: Top-level items (e.g., "Introduction", "Methodology") */
16+
.md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link {
17+
font-size: 0.8rem;
18+
font-weight: 500;
19+
padding-left: 0.6rem;
20+
}
21+
22+
/* Level 1: Section headers (expandable items) */
23+
.md-nav--primary > .md-nav__list > .md-nav__item--nested > .md-nav__link {
24+
font-size: 0.8rem;
25+
font-weight: 600;
26+
padding-left: 0.6rem;
27+
color: var(--md-default-fg-color);
28+
}
29+
30+
/* Level 2: Items under sections (e.g., "Secret Scanning" under "Methodology") */
31+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item > .md-nav__link {
32+
font-size: 0.8rem;
33+
font-weight: 400;
34+
padding-left: 1.5rem;
35+
color: var(--md-default-fg-color--light);
36+
}
37+
38+
/* Level 2: Nested sections */
39+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--nested > .md-nav__link {
40+
font-size: 0.8rem;
41+
font-weight: 500;
42+
padding-left: 1.5rem;
43+
}
44+
45+
/* Level 3: Items under nested sections (e.g., "Yaml" under "GitLab > Cicd") */
46+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item > .md-nav__link {
47+
font-size: 0.8rem;
48+
font-weight: 400;
49+
padding-left: 2.5rem;
50+
}
51+
52+
/* Active/current page highlighting */
53+
.md-nav__item--active > .md-nav__link,
54+
.md-nav__item--current > .md-nav__link,
55+
.md-nav__link--current {
56+
color: var(--md-primary-fg-color) !important;
57+
font-weight: 600 !important;
58+
border-left: 3px solid var(--md-primary-fg-color) !important;
59+
background-color: rgba(64, 107, 54, 0.08) !important;
60+
padding-left: calc(1.25rem - 3px) !important;
61+
}
62+
63+
/* Active links at second level */
64+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--active > .md-nav__link,
65+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--current > .md-nav__link {
66+
padding-left: calc(1.5rem - 3px) !important;
67+
}
68+
69+
/* Active links at third level */
70+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--active > .md-nav__link,
71+
.md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--nested > .md-nav > .md-nav__list > .md-nav__item--current > .md-nav__link {
72+
padding-left: calc(2.5rem - 3px) !important;
73+
}
74+
75+
/* Hover states for better interactivity */
76+
.md-nav__link:hover {
77+
background-color: rgba(64, 107, 54, 0.05);
78+
color: var(--md-primary-fg-color);
79+
}
80+
81+
/* Dark mode adjustments */
82+
[data-md-color-scheme="slate"] .md-nav__item--active > .md-nav__link,
83+
[data-md-color-scheme="slate"] .md-nav__item--current > .md-nav__link,
84+
[data-md-color-scheme="slate"] .md-nav__link--current {
85+
background-color: rgba(185, 207, 126, 0.12) !important;
86+
color: var(--md-primary-fg-color--light) !important;
87+
border-left-color: var(--md-primary-fg-color--light) !important;
88+
}
89+
90+
[data-md-color-scheme="slate"] .md-nav__link:hover {
91+
background-color: rgba(185, 207, 126, 0.08);
92+
color: var(--md-primary-fg-color--light);
693
}

docs/methodology/renovate.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ This guide explains how to use Pipeleak to discover and exploit common misconfig
1515
There are two key points to understand:
1616

1717
1. **Code Execution by Renovated Repositories**
18-
1918
> Every project renovated by the same bot must be considered equally trusted and exposed to the same attack level. If one project is compromised, all others processed by that bot can be affected. Code execution by the renovated repository in the bot context is assumed in Renovate's threat model.
2019
2120
2. **GitLab Invite Auto-Acceptance**

docs/overrides/main.html

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,4 +20,56 @@
2020
<meta name="twitter:title" content="{{ title }}" />
2121
<meta name="twitter:description" content="{{ config.site_description }}" />
2222
<meta name="twitter:image" content="https://raw.githubusercontent.com/CompassSecurity/pipeleak/refs/heads/main/docs/social.png" />
23+
{% endblock %}
24+
25+
{% block scripts %}
26+
{{ super() }}
27+
<script>
28+
// Mark current nav item as active after page load
29+
document.addEventListener('DOMContentLoaded', function() {
30+
var currentPath = window.location.pathname;
31+
32+
// Normalize paths - remove trailing slash unless it's root
33+
var normalizePath = function(path) {
34+
if (path === '/') return path;
35+
return path.replace(/\/$/, '');
36+
};
37+
38+
// Resolve relative path to absolute based on current page location
39+
var resolveRelativePath = function(href) {
40+
if (href.startsWith('/') || href.startsWith('http')) {
41+
return href;
42+
}
43+
44+
// Create a temporary anchor element to resolve the relative path
45+
var a = document.createElement('a');
46+
a.href = href;
47+
return a.pathname;
48+
};
49+
50+
var normalizedCurrent = normalizePath(currentPath);
51+
52+
// Find all nav links in the primary sidebar
53+
var navLinks = document.querySelectorAll('.md-sidebar--primary .md-nav__link');
54+
55+
navLinks.forEach(function(link) {
56+
var href = link.getAttribute('href');
57+
if (!href || href.startsWith('#')) return;
58+
59+
// Resolve relative paths to absolute
60+
var resolvedHref = resolveRelativePath(href);
61+
var normalizedHref = normalizePath(resolvedHref);
62+
63+
// Check if this link matches the current page
64+
if (normalizedCurrent === normalizedHref) {
65+
link.classList.add('md-nav__link--current');
66+
67+
var parentItem = link.closest('.md-nav__item');
68+
if (parentItem) {
69+
parentItem.classList.add('md-nav__item--current');
70+
}
71+
}
72+
});
73+
});
74+
</script>
2375
{% endblock %}

src/pipeleak/cmd/docs/docs.go

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ func NewDocsCmd(root *cobra.Command) *cobra.Command {
1212
cmd := &cobra.Command{
1313
Use: "docs",
1414
Short: "Generate CLI documentation",
15-
Long: "Generate Markdown documentation for all commands in this CLI application and mkdocs.yml. Must be run in an environment where 'mkdocs' is installed.",
15+
Long: "Generates documentation for all commands. Must be run in an environment where 'mkdocs' is installed.",
1616
Example: `
1717
# Generate docs and serve them at http://localhost:8000
1818
pipeleak docs --serve
@@ -26,7 +26,7 @@ pipeleak docs --serve
2626
},
2727
}
2828

29-
cmd.Flags().BoolVarP(&serve, "serve", "s", false, "Run 'mkdocs build' in the output folder after generating docs")
29+
cmd.Flags().BoolVarP(&serve, "serve", "s", false, "Serve documentation after building")
3030
cmd.Flags().BoolVarP(&githubPages, "github-pages", "g", false, "Build for GitHub Pages")
3131

3232
return cmd

src/pipeleak/pkg/docs/generator.go

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -123,6 +123,10 @@ func buildNav(cmd *cobra.Command, level int, parentPath string) *NavEntry {
123123
if !c.IsAvailableCommand() || c.IsAdditionalHelpTopicCommand() {
124124
continue
125125
}
126+
// Skip autocompletion and docs commands from nav menu
127+
if c.Name() == "completion" || c.Name() == "docs" {
128+
continue
129+
}
126130
entry.Children = append(entry.Children, buildNav(c, level+1, folder))
127131
}
128132
} else {
@@ -233,7 +237,6 @@ func writeMkdocsYaml(rootCmd *cobra.Command, outputDir string, githubPages bool)
233237
"features": []string{
234238
"content.code.copy",
235239
"content.tabs.link",
236-
"navigation.instant",
237240
"navigation.tracking",
238241
"navigation.sections",
239242
"navigation.expand",

src/pipeleak/pkg/docs/generator_test.go

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,11 +31,16 @@ func TestDisplayName(t *testing.T) {
3131
}
3232

3333
// buildNav should create index.md for commands with children and .md file for leaves.
34+
// It should also filter out 'completion' and 'docs' commands.
3435
func TestBuildNav(t *testing.T) {
3536
root := &cobra.Command{Use: "pipeleak"}
3637
parent := &cobra.Command{Use: "alpha"}
3738
leaf := &cobra.Command{Use: "scan", Run: func(cmd *cobra.Command, args []string) {}}
39+
completion := &cobra.Command{Use: "completion", Run: func(cmd *cobra.Command, args []string) {}}
40+
docs := &cobra.Command{Use: "docs", Run: func(cmd *cobra.Command, args []string) {}}
3841
parent.AddCommand(leaf)
42+
parent.AddCommand(completion)
43+
parent.AddCommand(docs)
3944
root.AddCommand(parent)
4045

4146
entry := buildNav(root, 0, "")
@@ -44,8 +49,10 @@ func TestBuildNav(t *testing.T) {
4449
child := entry.Children[0]
4550
assert.Equal(t, "Alpha", child.Label)
4651
assert.Equal(t, filepath.ToSlash("pipeleak/alpha/index.md"), child.FilePath)
52+
// Should only have 1 child (scan), completion and docs should be filtered
4753
assert.Len(t, child.Children, 1)
4854
grand := child.Children[0]
55+
assert.Equal(t, "Scan", grand.Label)
4956
assert.Equal(t, filepath.ToSlash("pipeleak/alpha/scan.md"), grand.FilePath)
5057
}
5158

0 commit comments

Comments
 (0)