From d18db9adfa50837a0e40f5cda3ee849e4e783673 Mon Sep 17 00:00:00 2001 From: konnorrogers Date: Mon, 12 Jun 2023 14:20:11 -0400 Subject: [PATCH] prettier --- docs/_utilities/replacer.cjs | 9 ++++----- docs/eleventy.config.cjs | 12 ++++++------ docs/pages/frameworks/angular.md | 2 +- docs/pages/frameworks/react.md | 2 +- docs/pages/frameworks/vue-2.md | 2 +- docs/pages/frameworks/vue.md | 2 +- docs/pages/getting-started/installation.md | 17 +++++++++++++---- docs/pages/getting-started/localization.md | 2 +- docs/pages/getting-started/themes.md | 7 +++++-- docs/pages/index.md | 2 +- 10 files changed, 34 insertions(+), 23 deletions(-) diff --git a/docs/_utilities/replacer.cjs b/docs/_utilities/replacer.cjs index b9dc588e..ddc4d4a3 100644 --- a/docs/_utilities/replacer.cjs +++ b/docs/_utilities/replacer.cjs @@ -8,13 +8,12 @@ * @typedef {Array} Replacements */ - /** * @param {Document} content * @param {Replacements} replacements */ module.exports = function (content, replacements) { - replacements.forEach((replacement) => { - content.body.innerHTML = content.body.innerHTML.replaceAll(replacement.pattern, replacement.replacement) - }) -} + replacements.forEach(replacement => { + content.body.innerHTML = content.body.innerHTML.replaceAll(replacement.pattern, replacement.replacement); + }); +}; diff --git a/docs/eleventy.config.cjs b/docs/eleventy.config.cjs index f165bd6c..228bee49 100644 --- a/docs/eleventy.config.cjs +++ b/docs/eleventy.config.cjs @@ -19,8 +19,8 @@ const typography = require('./_utilities/typography.cjs'); const replacer = require('./_utilities/replacer.cjs'); const assetsDir = 'assets'; -const cdndir = 'cdn' -const npmdir = 'dist' +const cdndir = 'cdn'; +const npmdir = 'dist'; const allComponents = getAllComponents(); let hasBuiltSearchIndex = false; @@ -135,10 +135,10 @@ module.exports = function (eleventyConfig) { copyCodeButtons(doc); // must be after codePreviews + highlightCodeBlocks typography(doc, '#content'); replacer(doc, [ - {pattern: "%VERSION%", replacement: customElementsManifest.package.version}, - {pattern: "%CDNDIR%", replacement: cdndir}, - {pattern: "%NPMDIR%", replacement: npmdir} - ]) + { pattern: '%VERSION%', replacement: customElementsManifest.package.version }, + { pattern: '%CDNDIR%', replacement: cdndir }, + { pattern: '%NPMDIR%', replacement: npmdir } + ]); // Serialize the Document object to an HTML string and prepend the doctype content = `\n${doc.documentElement.outerHTML}`; diff --git a/docs/pages/frameworks/angular.md b/docs/pages/frameworks/angular.md index 8b651132..9b0914f0 100644 --- a/docs/pages/frameworks/angular.md +++ b/docs/pages/frameworks/angular.md @@ -85,4 +85,4 @@ Now you can start using Shoelace components in your app! :::tip Are you using Shoelace with Angular? [Help us improve this page!](https://github.com/shoelace-style/shoelace/blob/next/docs/frameworks/angular.md) -::: \ No newline at end of file +::: diff --git a/docs/pages/frameworks/react.md b/docs/pages/frameworks/react.md index 080a77c0..5084bd15 100644 --- a/docs/pages/frameworks/react.md +++ b/docs/pages/frameworks/react.md @@ -151,4 +151,4 @@ For more details, refer to Jest's [`transformIgnorePatterns` customization](http :::tip Are you using Shoelace with React? [Help us improve this page!](https://github.com/shoelace-style/shoelace/blob/next/docs/frameworks/react.md) -::: \ No newline at end of file +::: diff --git a/docs/pages/frameworks/vue-2.md b/docs/pages/frameworks/vue-2.md index 992f6d6e..cb4f61ba 100644 --- a/docs/pages/frameworks/vue-2.md +++ b/docs/pages/frameworks/vue-2.md @@ -104,4 +104,4 @@ Now you can use the `v-sl-model` directive to keep your data in sync! :::tip Are you using Shoelace with Vue? [Help us improve this page!](https://github.com/shoelace-style/shoelace/blob/next/docs/frameworks/vue-2.md) -::: \ No newline at end of file +::: diff --git a/docs/pages/frameworks/vue.md b/docs/pages/frameworks/vue.md index 08dae60e..5a63d32d 100644 --- a/docs/pages/frameworks/vue.md +++ b/docs/pages/frameworks/vue.md @@ -124,4 +124,4 @@ Here is an example: Close -``` \ No newline at end of file +``` diff --git a/docs/pages/getting-started/installation.md b/docs/pages/getting-started/installation.md index 056cec41..11f4e806 100644 --- a/docs/pages/getting-started/installation.md +++ b/docs/pages/getting-started/installation.md @@ -33,8 +33,14 @@ While convenient, autoloading may lead to a [Flash of Undefined Custom Elements] The traditional CDN loader registers all Shoelace elements up front. Note that, if you're only using a handful of components, it will be much more efficient to stick with the autoloader. However, you can also [cherry pick](#cherry-picking) components if you want to load specific ones up front. ```html - - + + ``` @@ -45,7 +51,10 @@ The traditional CDN loader registers all Shoelace elements up front. Note that, The code above will load the light theme. If you want to use the [dark theme](/getting-started/themes#dark-theme) instead, update the stylesheet as shown below and add `` to your page. ```html - + ``` ### Light & Dark Theme @@ -194,4 +203,4 @@ TLDR: - `@shoelace-style/shoelace/%NPMDIR%` is for NPM This change was introduced in `v2.5.0` to address issues around installations from NPM -loading multiple versions of libraries such as the Lit web component library which Shoelace uses internally. \ No newline at end of file +loading multiple versions of libraries such as the Lit web component library which Shoelace uses internally. diff --git a/docs/pages/getting-started/localization.md b/docs/pages/getting-started/localization.md index 2470558d..4555adde 100644 --- a/docs/pages/getting-started/localization.md +++ b/docs/pages/getting-started/localization.md @@ -135,4 +135,4 @@ Once your translation has been compiled to JavaScript, import it and activate it :::tip If your translation isn't working, make sure you're using the same localize module when importing `registerTranslation`. If you're using a different module, your translation won't be recognized. -::: \ No newline at end of file +::: diff --git a/docs/pages/getting-started/themes.md b/docs/pages/getting-started/themes.md index e139d6a7..7e725b7e 100644 --- a/docs/pages/getting-started/themes.md +++ b/docs/pages/getting-started/themes.md @@ -127,7 +127,10 @@ The dark theme works by taking the light theme's [color tokens](/tokens/color) a To install the dark theme, add the following to the `` section of your page. ```html - + ``` To activate the theme, apply the `sl-theme-dark` class to the `` element. @@ -146,4 +149,4 @@ Shoelace doesn't try to auto-detect the user's light/dark mode preference. This - Allow the user to override the setting in your app - Remember the user's preference and restore it on subsequent logins -Shoelace avoids using the `prefers-color-scheme` media query because not all apps support dark mode, and it would break things for the ones that don't. \ No newline at end of file +Shoelace avoids using the `prefers-color-scheme` media query because not all apps support dark mode, and it would break things for the ones that don't. diff --git a/docs/pages/index.md b/docs/pages/index.md index 1e09273a..f9b62d92 100644 --- a/docs/pages/index.md +++ b/docs/pages/index.md @@ -137,4 +137,4 @@ Special thanks to the following projects and individuals that help make Shoelace - Positioning of dropdowns, tooltips, et al is handled by [Floating UI](https://floating-ui.com/) - Animations are courtesy of [animate.css](https://animate.style/) - Search is powered by [Lunr](https://lunrjs.com/) -- The Shoelace logo was designed with a single shoelace by [Adam K Olson](https://twitter.com/adamkolson) \ No newline at end of file +- The Shoelace logo was designed with a single shoelace by [Adam K Olson](https://twitter.com/adamkolson)