Merge pull request sass#8 from oddbird/upgrade-11ty

Upgrade to 11ty v2-beta.

.eleventy.cjs → eleventy.config.cjs

@@ -5,28 +5,23 @@ const yaml = require('js-yaml');
 const markdown = require('markdown-it');
 const markdownDefList = require('markdown-it-deflist');
 const typogrify = require('typogr');
+const { EleventyRenderPlugin } = require('@11ty/eleventy');
 
 /** @param {import('@11ty/eleventy').UserConfig} eleventyConfig */
 module.exports = (eleventyConfig) => {
   eleventyConfig.addPassthroughCopy('source/assets/dist');
   eleventyConfig.addPassthroughCopy('source/assets/img');
   eleventyConfig.addPassthroughCopy('source/favicon.ico');
 
-  eleventyConfig.addWatchTarget('source/assets/dist');
-  eleventyConfig.addWatchTarget('source/assets/img');
-
   eleventyConfig.setLiquidOptions({
     jsTruthy: true,
   });
   eleventyConfig.setUseGitIgnore(false);
 
   const mdown = markdown({
     html: true,
-    breaks: false,
     typographer: true,
-  })
-    .disable('code')
-    .use(markdownDefList);
+  }).use(markdownDefList);
 
   eleventyConfig.setLibrary('md', mdown);
   eleventyConfig.addDataExtension('yaml', yaml.load);
@@ -61,6 +56,8 @@ module.exports = (eleventyConfig) => {
     page.url.startsWith('/documentation/js-api/'),
   );
 
+  eleventyConfig.addPlugin(EleventyRenderPlugin);
+
   // settings
   return {
     dir: {

package.json

@@ -25,8 +25,8 @@
     "build-dev:scripts": "rollup -c",
     "build-prod:scripts": "BABEL_ENV=production rollup -c",
     "watch:scripts": "npm run build-dev:scripts -- -w",
-    "build:11ty": "eleventy --config=.eleventy.cjs",
-    "watch:11ty": "eleventy --config=.eleventy.cjs --serve",
+    "build:11ty": "eleventy",
+    "watch:11ty": "eleventy --serve --incremental",
     "tsc": "tsc",
     "prettier": "prettier --write .",
     "prettier:ci": "prettier --check .",
@@ -39,7 +39,7 @@
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "devDependencies": {
-    "@11ty/eleventy": "^1.0.2",
+    "@11ty/eleventy": "^2.0.0-0",
     "@babel/core": "^7.20.12",
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-typescript": "^7.18.6",

source/_includes/footer.liquid

@@ -6,16 +6,12 @@
   <div class="sl-l-container sl-l-section">
     <div class="sl-l-grid sl-l-grid--full sl-l-large-grid--fit sl-l-large-grid--center sl-l-large-grid--gutters">
       <div class="sl-l-grid__column">
-        <p>
+        {% renderTemplate 'liquid,md' %}
           Sass &copy; 2006&ndash;{{ 'now' | date: '%Y' }} the Sass team, and numerous contributors.
-          It is available for use and modification under the <a href="https://github.com/sass/dart-sass/blob/master/LICENSE">MIT&nbsp;License</a>.
-        </p>
+          It is available for use and modification under the [MIT&nbsp;License](https://github.com/sass/dart-sass/blob/master/LICENSE).
+        {% endrenderTemplate %}
 
-        <nav class="sl-c-list-horizontal-wrapper">
-          {% markdown -%}
-            {% include 'footer_links.md' %}
-          {%- endmarkdown %}
-        </nav>
+        {% renderFile 'source/_includes/footer_nav.md' %}
       </div>
       <div class="sl-l-grid__column sl-l-large-grid__column--auto-size sl-l-large-grid--justify-right">
         <a

source/_includes/footer_links.md → source/_includes/footer_nav.md

@@ -1,4 +1,8 @@
+<nav class="sl-c-list-horizontal-wrapper">
+
 - [Sass on GitHub](https://github.com/sass)
 - [Website Source Code](https://github.com/sass/sass-site)
 - [Style Guide](/styleguide)
 - [Community Guidelines](/community-guidelines)
+
+</nav>

source/_includes/header.liquid

@@ -6,32 +6,21 @@
   <div class="sl-c-alert sl-c-alert--info" style="background: #000; padding: 3rem 0; text-align: left;">
     <div class="sl-l-container">
       <h2 style="margin-top: 0;">Black Lives Matter</h2>
-      <p>
+      {% renderTemplate 'md' %}
         Sass stands with the protesters against police violence. We encourage our users to
-        <strong>get in the streets and join them if you can</strong>.
-      </p>
+        **get in the streets and join them if you can**.
+      {% endrenderTemplate %}
     </div>
   </div>
 
   <div class="sl-c-pop-stripe"></div>
   <div class="sl-l-container">
     <div class="sl-l-grid sl-l-grid--full sl-l-large-grid--fit sl-l-large-grid--center sl-l-large-grid--gutters">
       <p class="sl-l-grid__column sl-r-banner__brand">
-        <a href="/"><img
-            height="48"
-            alt="Sass"
-            src="/assets/img/logos/logo.svg"></a>
+        <a href="/"><img height="48" alt="Sass" src="/assets/img/logos/logo.svg"></a>
       </p>
-      <nav
-        class="sl-r-banner__navigation sl-l-grid__column sl-l-large-grid sl-l-large-grid__column--auto-size sl-c-list-horizontal-wrapper"
-        itemtype="http://schema.org/SiteNavigationElement"
-        itemscope="itemscope"
-        role="navigation"
-        aria-label="Site navigation">
-        {% markdown -%}
-          {% include 'header_links.md' %}
-        {%- endmarkdown %}
-      </nav>
+
+      {% renderFile 'source/_includes/header_nav.md' %}
     </div>
   </div>
 </header>

source/_includes/header_nav.md

@@ -0,0 +1,19 @@
+<nav
+  class="sl-r-banner__navigation
+    sl-l-grid__column
+    sl-l-large-grid
+    sl-l-large-grid__column--auto-size
+    sl-c-list-horizontal-wrapper"
+  itemtype="http://schema.org/SiteNavigationElement"
+  itemscope="itemscope"
+  role="navigation"
+  aria-label="Site navigation">
+
+- [Install](/install)
+- [Learn Sass](/guide)
+- [Blog](/blog)
+- [Documentation](/documentation)
+- [Get Involved](/community)
+- <div id="docsearch"></div>
+
+</nav>