@nera-static/plugin-navigation 2.0.1 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -4,15 +4,16 @@ A plugin for the [Nera](https://github.com/seebaermichi/nera) static site genera
|
|
|
4
4
|
|
|
5
5
|
## ✨ Features
|
|
6
6
|
|
|
7
|
-
- Define one or more navigations via YAML config
|
|
8
|
-
- Access navigation data in your templates (`app.nav`)
|
|
9
|
-
- Support for multi-level navigations (e.g. main, footer)
|
|
10
|
-
- Includes
|
|
7
|
+
- **Flexible Navigation Structure**: Define one or more navigations via YAML config
|
|
8
|
+
- **Template Integration**: Access navigation data in your templates (`app.nav`)
|
|
9
|
+
- **Multi-Level Support**: Support for multi-level navigations (e.g. main, footer)
|
|
10
|
+
- **Built-in Templates**: Includes ready-to-use Pug templates and mixins:
|
|
11
11
|
- Pipe-separated links
|
|
12
12
|
- Link lists
|
|
13
13
|
- Mixin-powered flexible layout
|
|
14
|
-
- Automatic active/path highlighting support
|
|
15
|
-
- Zero
|
|
14
|
+
- **Active State Management**: Automatic active/path highlighting support
|
|
15
|
+
- **Zero Runtime**: Static navigation structure, no client-side processing
|
|
16
|
+
- **Nera v4.1.0 Compatible**: Optimized for the latest Nera architecture
|
|
16
17
|
|
|
17
18
|
## 🚀 Installation
|
|
18
19
|
|
|
@@ -118,10 +119,57 @@ npm install
|
|
|
118
119
|
npm run test
|
|
119
120
|
```
|
|
120
121
|
|
|
122
|
+
## 🎨 CSS Classes (BEM Methodology)
|
|
123
|
+
|
|
124
|
+
The generated HTML uses BEM (Block Element Modifier) CSS classes for consistent styling:
|
|
125
|
+
|
|
126
|
+
```css
|
|
127
|
+
/* Navigation Block */
|
|
128
|
+
.nav {
|
|
129
|
+
/* Main navigation container */
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
/* Navigation Elements */
|
|
133
|
+
.nav__list {
|
|
134
|
+
/* Navigation list container */
|
|
135
|
+
}
|
|
136
|
+
.nav__item {
|
|
137
|
+
/* Individual navigation item */
|
|
138
|
+
}
|
|
139
|
+
.nav__item--inline {
|
|
140
|
+
/* Inline item modifier */
|
|
141
|
+
}
|
|
142
|
+
.nav__link {
|
|
143
|
+
/* Navigation link */
|
|
144
|
+
}
|
|
145
|
+
.nav__separator {
|
|
146
|
+
/* Pipe separator element */
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
/* Navigation Modifiers */
|
|
150
|
+
.nav__link--active {
|
|
151
|
+
/* Currently active link */
|
|
152
|
+
}
|
|
153
|
+
.nav__link--active-path {
|
|
154
|
+
/* Parent path link */
|
|
155
|
+
}
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
## 📋 Version History
|
|
159
|
+
|
|
160
|
+
All changes are documented in [CHANGELOG.md](./CHANGELOG.md).
|
|
161
|
+
|
|
121
162
|
## 🧑💻 Author
|
|
122
163
|
|
|
123
|
-
Michael Becker
|
|
124
|
-
[
|
|
164
|
+
Michael Becker
|
|
165
|
+
[https://github.com/seebaermichi](https://github.com/seebaermichi)
|
|
166
|
+
|
|
167
|
+
## 🔗 Links
|
|
168
|
+
|
|
169
|
+
- [Plugin Repository](https://github.com/seebaermichi/nera-plugin-navigation)
|
|
170
|
+
- [NPM Package](https://www.npmjs.com/package/@nera-static/plugin-navigation)
|
|
171
|
+
- [Nera Static Site Generator](https://github.com/seebaermichi/nera)
|
|
172
|
+
- [Plugin Documentation](https://github.com/seebaermichi/nera-plugins#plugins)
|
|
125
173
|
|
|
126
174
|
## 📦 License
|
|
127
175
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nera-static/plugin-navigation",
|
|
3
|
-
"version": "2.0
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "A plugin for Nera static site generator to generate navigations with optional templates and mixins.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -35,14 +35,14 @@
|
|
|
35
35
|
},
|
|
36
36
|
"homepage": "https://github.com/seebaermichi/nera-plugin-navigation#readme",
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@nera-static/plugin-utils": "^1.0
|
|
38
|
+
"@nera-static/plugin-utils": "^1.1.0"
|
|
39
39
|
},
|
|
40
40
|
"engines": {
|
|
41
41
|
"node": ">=18"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"cheerio": "^1.1.0",
|
|
45
|
-
"eslint": "^9.
|
|
45
|
+
"eslint": "^9.17.0",
|
|
46
46
|
"husky": "^9.1.7",
|
|
47
47
|
"pug": "^3.0.3",
|
|
48
48
|
"vitest": "^3.2.4"
|
package/views/helper/mixins.pug
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
mixin link(item, activeClass, activePathClass)
|
|
2
|
-
a(href=item.href, class=`${activeClass}${activePathClass}
|
|
2
|
+
a.nav__link(href=item.href, class=`${activeClass} ${activePathClass}`.trim()) #{ item.name }
|
package/views/helper/setup.pug
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
each item, index in elements || app.nav.elements
|
|
2
2
|
- const isActive = item.href === meta.fullPath
|
|
3
|
-
- const activeClass = isActive ?
|
|
3
|
+
- const activeClass = isActive ? 'nav__link--active' : ''
|
|
4
4
|
- const isNotHome = meta.dirname !== '/'
|
|
5
5
|
- const isParent = isNotHome && item.href.indexOf(meta.dirname) === 0
|
|
6
|
-
- const activePathClass = !isActive && isParent ?
|
|
6
|
+
- const activePathClass = !isActive && isParent ? 'nav__link--active-path' : ''
|