Skip to content

Commit 7269346

Browse files
bradfrostbmuenzenmeyer
bradfrost
authored and
bmuenzenmeyer
committed
Merge branch 'master' of github.com:bradfrost/pl-website-eleventy
1 parent 3ac6fd9 commit 7269346

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+319
-198
lines changed

‎packages/docs/.eleventy.js

Lines changed: 78 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const rssPlugin = require('@11ty/eleventy-plugin-rss');
22
const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
3+
const eleventyNavigationPlugin = require('@11ty/eleventy-navigation');
34
const fs = require('fs');
45

56
// Import filters
@@ -15,80 +16,81 @@ const parseTransform = require('./src/transforms/parse-transform.js');
1516
const site = require('./src/_data/site.json');
1617

1718
module.exports = function(config) {
18-
// Filters
19-
config.addFilter('dateFilter', dateFilter);
20-
config.addFilter('markdownFilter', markdownFilter);
21-
config.addFilter('w3DateFilter', w3DateFilter);
22-
23-
// Layout aliases
24-
config.addLayoutAlias('home', 'layouts/home.njk');
25-
26-
// Transforms
27-
config.addTransform('htmlmin', htmlMinTransform);
28-
config.addTransform('parse', parseTransform);
29-
30-
// Passthrough copy
31-
config.addPassthroughCopy('src/images');
32-
config.addPassthroughCopy('src/js');
33-
config.addPassthroughCopy('src/admin/config.yml');
34-
config.addPassthroughCopy('src/admin/previews.js');
35-
config.addPassthroughCopy('node_modules/nunjucks/browser/nunjucks-slim.js');
36-
37-
const now = new Date();
38-
39-
// Custom collections
40-
const livePosts = post => post.date <= now && !post.data.draft;
41-
config.addCollection('posts', collection => {
42-
return [
43-
...collection.getFilteredByGlob('./src/posts/*.md').filter(livePosts)
44-
].reverse();
45-
});
46-
47-
config.addCollection('demos', collection => {
48-
return [...collection.getFilteredByGlob('./src/demos/*.md')].reverse();
49-
});
50-
51-
config.addCollection('postFeed', collection => {
52-
return [...collection.getFilteredByGlob('./src/posts/*.md').filter(livePosts)]
53-
.reverse()
54-
.slice(0, site.maxPostsPerPage);
55-
});
56-
57-
config.addCollection('docs', collection => {
58-
return [...collection.getFilteredByGlob('./src/docs/*.md')].reverse();
59-
});
60-
61-
config.addCollection('docsOrdered', collection => {
62-
const docs = collection.getFilteredByGlob('src/docs/*.md').sort((a, b) => {
63-
return Number(a.data.order) - Number(b.data.order);
64-
});
65-
return docs;
66-
});
67-
68-
// Plugins
69-
config.addPlugin(rssPlugin);
70-
config.addPlugin(syntaxHighlight);
71-
72-
// 404
73-
config.setBrowserSyncConfig({
74-
callbacks: {
75-
ready: function(err, browserSync) {
76-
const content_404 = fs.readFileSync('dist/404.html');
77-
78-
browserSync.addMiddleware('*', (req, res) => {
79-
// Provides the 404 content without redirect.
80-
res.write(content_404);
81-
res.end();
82-
});
83-
}
84-
}
85-
});
86-
87-
return {
88-
dir: {
89-
input: 'src',
90-
output: 'dist'
91-
},
92-
passthroughFileCopy: true
93-
};
19+
// Filters
20+
config.addFilter('dateFilter', dateFilter);
21+
config.addFilter('markdownFilter', markdownFilter);
22+
config.addFilter('w3DateFilter', w3DateFilter);
23+
24+
// Layout aliases
25+
config.addLayoutAlias('home', 'layouts/home.njk');
26+
27+
// Transforms
28+
config.addTransform('htmlmin', htmlMinTransform);
29+
config.addTransform('parse', parseTransform);
30+
31+
// Passthrough copy
32+
config.addPassthroughCopy('src/images');
33+
config.addPassthroughCopy('src/js');
34+
config.addPassthroughCopy('src/admin/config.yml');
35+
config.addPassthroughCopy('src/admin/previews.js');
36+
config.addPassthroughCopy('node_modules/nunjucks/browser/nunjucks-slim.js');
37+
38+
const now = new Date();
39+
40+
// Custom collections
41+
const livePosts = post => post.date <= now && !post.data.draft;
42+
config.addCollection('posts', collection => {
43+
return [
44+
...collection.getFilteredByGlob('./src/posts/*.md').filter(livePosts)
45+
].reverse();
46+
});
47+
48+
config.addCollection('demos', collection => {
49+
return [...collection.getFilteredByGlob('./src/demos/*.md')].reverse();
50+
});
51+
52+
config.addCollection('postFeed', collection => {
53+
return [...collection.getFilteredByGlob('./src/posts/*.md').filter(livePosts)]
54+
.reverse()
55+
.slice(0, site.maxPostsPerPage);
56+
});
57+
58+
config.addCollection('docs', collection => {
59+
return [...collection.getFilteredByGlob('./src/docs/*.md')].reverse();
60+
});
61+
62+
config.addCollection('docsOrdered', collection => {
63+
const docs = collection.getFilteredByGlob('src/docs/*.md').sort((a, b) => {
64+
return Number(a.data.order) - Number(b.data.order);
65+
});
66+
return docs;
67+
});
68+
69+
// Plugins
70+
config.addPlugin(rssPlugin);
71+
config.addPlugin(syntaxHighlight);
72+
config.addPlugin(eleventyNavigationPlugin);
73+
74+
// 404
75+
config.setBrowserSyncConfig({
76+
callbacks: {
77+
ready: function(err, browserSync) {
78+
const content_404 = fs.readFileSync('dist/404.html');
79+
80+
browserSync.addMiddleware('*', (req, res) => {
81+
// Provides the 404 content without redirect.
82+
res.write(content_404);
83+
res.end();
84+
});
85+
}
86+
}
87+
});
88+
89+
return {
90+
dir: {
91+
input: 'src',
92+
output: 'dist'
93+
},
94+
passthroughFileCopy: true
95+
};
9496
};

‎packages/docs/.prettierrc

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
2-
"printWidth": 90,
3-
"useTabs": true,
4-
"tabWidth": 4,
5-
"singleQuote": true,
6-
"bracketSpacing": false
2+
"printWidth": 90,
3+
"useTabs": true,
4+
"tabWidth": 2,
5+
"singleQuote": true,
6+
"bracketSpacing": false
77
}

‎packages/docs/package-lock.json

Lines changed: 17 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/docs/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
"stalfos": "github:hankchizljaw/stalfos#c8971d22726326cfc04089b2da4d51eeb1ebb0eb"
1818
},
1919
"devDependencies": {
20+
"@11ty/eleventy-navigation": "^0.1.5",
2021
"@erquhart/rollup-plugin-node-builtins": "^2.1.5",
2122
"bl": "^3.0.0",
2223
"chokidar-cli": "^2.0.0",

‎packages/docs/php-docs/pattern-managing-assets.md

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,18 @@
11
---
22
title: Managing Pattern Assets
33
tags:
4-
- docs
4+
- docs
55
---
66

7-
8-
97
Assets for patterns - including JavaScript, CSS, and images - should be stored and edited in the `./source/` directory. Pattern Lab will move these assets to the `./public/` directory for you when you generate your site or when you watch the `./source/` directory for changes. **You can name and organize your assets however you like.** If you would like to use `./source/stylesheets/` to store your styles instead of `./source/css/` you can do that. There is nothing to configure. The structure will be maintained when they're moved to the `./public/` directory.
108

119
## Ignoring and Not Moving Assets Based on File Extension
1210

1311
By default, Pattern Lab will not move assets with the following file extensions:
1412

15-
* `.less`
16-
* `.scss`
17-
* `.DS_Store`
13+
- `.less`
14+
- `.scss`
15+
- `.DS_Store`
1816

1917
To ignore more file extensions edit the `ie` configuration option in `./config/config.yml`. For example, to ignore `*.png` files your `ie` configuration option would look like:
2018

@@ -28,7 +26,7 @@ To ignore more file extensions edit the `ie` configuration option in `./config/c
2826

2927
By default, the PHP version of Pattern Lab will ignore **all** assets in directories that exactly match:
3028

31-
* `scss`
29+
- `scss`
3230

3331
To ignore more directories just edit the `id` configuration option in `./config/config.yml`. For example, to ignore directories named `test/` your `id` configuration option would look like:
3432

@@ -41,6 +39,3 @@ To ignore more directories just edit the `id` configuration option in `./config/
4139
## Adding Assets to the Pattern Header &amp; Footer
4240

4341
Static assets like Javascript and CSS **are not** added automagically to your patterns. You need to add them manually to the [shared pattern header and footer](/docs/pattern-header-footer.html).
44-
45-
46-

‎packages/docs/php-docs/pattern-states.md

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,18 @@
11
---
22
title: Using Pattern States
33
tags:
4-
- docs
4+
- docs
55
---
66

7-
8-
97
Pattern states provide your team and client a simple visual of the current state of patterns in Pattern Lab. Pattern states can track progress of a pattern from development, through client review, to completion or they can be used to give certain patterns specific classes. It's important to note that the state of a pattern can be influenced by its pattern partials.
108

119
## The Default Pattern States
1210

1311
Pattern Lab comes with the following default pattern states:
1412

15-
* **inprogress**: pattern is in development or being worked upon. a red dot.
16-
* **inreview**: pattern is ready for a client to look at and comment upon. a yellow dot.
17-
* **complete**: pattern is ready to be moved to production. a green dot.
13+
- **inprogress**: pattern is in development or being worked upon. a red dot.
14+
- **inreview**: pattern is ready for a client to look at and comment upon. a yellow dot.
15+
- **complete**: pattern is ready to be moved to production. a green dot.
1816

1917
Any pattern that includes a pattern partial that has a lower pattern state will inherit that state. For example, a pattern with the state of `inreview` that includes a pattern partial with the state of `inprogress` will have its state overridden and set to `inprogress`. It will not change to `inreview` until the pattern partial has a state of `inreview` or `complete`.
2018

@@ -45,6 +43,3 @@ You can use the following as your CSS template for new pattern states:
4543
```
4644

4745
Then add `@newpatternstate` to your patterns to have the new look show up. If you want to add it to the cascade of the default patterns you can modify `./config/config.yml`. Simply add your new pattern state to the `patternStates` list.
48-
49-
50-

‎packages/docs/src/_includes/components/tree-subnav.njk

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1+
{% set navPages = collections.docs | eleventyNavigation %}
12
<ul class="c-tree-nav__subnav">
2-
{% for doc in collections.docsOrdered %}
3-
{% if doc.data.category == subnavCategory %}
4-
<li class="c-tree-nav__subnav-item">
5-
<a href="{{doc.url}}" class="c-tree-nav__subnav-link">
6-
{{ doc.data.title }}
7-
</a><!--end c-tree-nav__subnav-link-->
8-
</li><!--end c-tree-nav__subnav-item-->
9-
{% endif %}
10-
{% endfor %}
11-
</ul><!--end c-tree-nav__subnav-->
3+
{% for entry in navPages %}
4+
{% if entry.key == subnavCategory %}
5+
<li class="c-tree-nav__subnav-item">
6+
<a href="{{entry.url}}" class="c-tree-nav__subnav-link">{{ entry.title }}<a>
7+
</li><!--end c-tree-nav__subnav-item -->
8+
{% endif %}
9+
{% endfor %}
10+
</ul><!--end c-tree-nav__subnav-->
11+

‎packages/docs/src/docs/a-post-with-code-samples.md

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ tags:
44
- demo-content
55
- code
66
- blog
7+
eleventyNavigation:
8+
key: DOCS DOCS DOCS
9+
order: 300
710
---
811

912
The best way to demo a code post is to display a real life post, so check out this one from [andy-bell.design](https://andy-bell.design/wrote/creating-a-full-bleed-css-utility/) about a full bleed CSS utility.
@@ -22,9 +25,9 @@ It’s small, but hella mighty:
2225

2326
```css
2427
.full-bleed {
25-
width: 100vw;
26-
margin-left: 50%;
27-
transform: translateX(-50%);
28+
width: 100vw;
29+
margin-left: 50%;
30+
transform: translateX(-50%);
2831
}
2932
```
3033

@@ -43,9 +46,9 @@ The `.full-bleed` utility gives those elements prominence and _importantly_ keep
4346

4447
```css
4548
.wrapper {
46-
max-width: 50rem;
47-
margin-left: auto;
48-
margin-right: auto;
49+
max-width: 50rem;
50+
margin-left: auto;
51+
margin-right: auto;
4952
}
5053
```
5154

‎packages/docs/src/docs/advanced-auto-regenerate.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ title: Watching for Changes and Auto Regenerating Patterns
33
tags:
44
- docs
55
category: advanced
6+
eleventyNavigation:
7+
key: Watching for Changes and Auto Regenerating Patterns
8+
parent: advanced
9+
order: 300
610
---
711

812
Pattern Lab has the ability to watch for changes to patterns and frontend assets. When these files change, it will automatically rebuild the entire Pattern Lab website. You simply make your changes, save the file, and Pattern Lab will take care of the rest.
@@ -38,5 +42,3 @@ By default, Pattern Lab monitors the following files:
3842
- all of the Javascript files under `source/js/`
3943

4044
The watch configuration is found within the Gruntfile or Gulpfile at the root of the project.
41-
42-

0 commit comments

Comments
 (0)