fix some typos

packages/examples/simple-blog/@library/content.css

@@ -26,7 +26,7 @@ li {
   margin-bottom: 1em;
 }
 
-/* syntax highligted code */
+/* syntax highlighted code */
 pre {
   --glow-padding: 2em;
   font-size: 105%;

packages/examples/simple-blog/blog/class-naming-strategies.md

@@ -1,5 +1,5 @@
 ---
-title: CSS class naming strategies for scaleable dashboard design
+title: CSS class naming strategies for scalable dashboard design
 og: img/dashboard-3.png
 thumb: img/dashboard-thumb.png
 date: 2024-08-13

packages/examples/simple-blog/blog/scaleable-design-system.md

@@ -1,5 +1,5 @@
 ---
-title: Crafting a scaleable CSS design system
+title: Crafting a scalable CSS design system
 thumb: img/ui-thumb.png
 og: img/ui-1.png
 date: 2025-01-18

packages/glow/README.md

@@ -1,6 +1,6 @@
 
 # Glow
-Glow is a small, but powerful syntax highligher for web:
+Glow is a small, but powerful syntax highlighter for web:
 
 <a href="https://nuejs.org/blog/introducing-glow/">
   <img src="https://nuejs.org/img/glow-og-big.png"></a>

packages/glow/css/syntax.css

@@ -72,7 +72,7 @@ pre {
     }
   }
 
-  /* errorneous line number styling */
+  /* erroneous line number styling */
   span:has(u):before {
     background-color: var(--glow-error-color, red);
     border-radius: .2em;

packages/nuejs.org/@lib/form.htm

@@ -2,7 +2,7 @@
 <div @name="join-list" class="join-list">
 
   <h4 :if="sessionStorage.joined">
-    You have succesfully joined the mailing list. Thank you for your interest!
+    You have successfully joined the mailing list. Thank you for your interest!
   </h4>
 
   <form :else @submit.prevent="submit">

packages/nuejs.org/blog/introducing-nue-css/index.md

@@ -82,7 +82,7 @@ One of the key ideas of Nue is to ditch the large JavaScript ecosystem and go di
 
 
 ### Your design is based on a design system { #architecture }
-Most companies have drafted some form of design system in softwares like **Figma** or **Sketch**. This system acts as their "single source of truth":
+Most companies have drafted some form of design system in software like **Figma** or **Sketch**. This system acts as their "single source of truth":
 
 [image]
   small: /img/abstract-design-system.png

packages/nuejs.org/blog/introducing-nue-css/size-measurement.md

@@ -1,7 +1,7 @@
 ---
 date: 2024-03-22
 title: Introducing Nue CSS
-desc: A scaleable alternative to Tailwind, BEM, and CSS-in-JS
+desc: A scalable alternative to Tailwind, BEM, and CSS-in-JS
 thumb: glow-thumb.jpg
 unlisted: true
 ---

packages/nuejs.org/blog/introducing-nuemark/index.md

@@ -68,7 +68,7 @@ The semantic approach means that you can customize the look and feel of your com
   caption: Same component, different CSS module
   width: 500
 
-This sort of content-first approach brings the legendary [CSS Zen Garden](//www.csszengarden.com/) back to the game. When your components always have the same structure you can re-use your CSS across your pages, apps, websites, and projects.
+This sort of content-first approach brings the legendary [CSS Zen Garden](//www.csszengarden.com/) back to the game. When your components always have the same structure you can reuse your CSS across your pages, apps, websites, and projects.
 
 ## Driven by Web Components
 Some components are *isomorphic* meaning that the content is rendered on the server side for search engines and the behavior of the component is spiced up with client-side JavaScript.

packages/nuejs.org/blog/nue-1-beta/index.md

@@ -42,7 +42,7 @@ Nue has a powerful CSS theming system that supports [hot-reloading](/docs/hot-re
 
 - [Lightning CSS](//lightningcss.dev/) is now enabled by default allowing you to use CSS nesting, color-mix, and other modern features now without browser-compatibility concerns.
 
-- [Library folders](/docs/project-structure.html#libraries) to hold re-usable CSS which can be explicitly included on your pages with a new `include` property. You can include assets globally, at the application level, or page level. This helps you take maximum advantage of the [CSS cascade](//developer.mozilla.org/en-US/docs/Web/CSS/Cascade).
+- [Library folders](/docs/project-structure.html#libraries) to hold reusable CSS which can be explicitly included on your pages with a new `include` property. You can include assets globally, at the application level, or page level. This helps you take maximum advantage of the [CSS cascade](//developer.mozilla.org/en-US/docs/Web/CSS/Cascade).
 
 - [Exclude property](/docs/project-structure.html#exclude) allows you to strip unneeded assets from the request and lighten the payload.
 

packages/nuejs.org/blog/tailwind-vs-semantic-css/index.md

@@ -65,7 +65,7 @@ Some key takes:
 
 1. Tailwind CSS is seven times larger: 33K vs 4.6K. Overall you need eight times more HTML/CSS code with Tailwind to render the page (108K vs 12.6K). While the design is not identical, but it's easy to see the ballpark figure in there. Tailwind-generated sites are multiple times larger.
 
-2. Most of the semantic CSS is re-usable on other pages and only a fraction of the CSS is specific to the front page. It's easy to create new pages when the groundwork is already done.
+2. Most of the semantic CSS is reusable on other pages and only a fraction of the CSS is specific to the front page. It's easy to create new pages when the groundwork is already done.
 
 3. "Spotlight" is just a *theme* extending a base design. There is an extremely minimalistic [base-version](/@base/) of the website that can be used to create new themes, like our Spotlight theme.
 
@@ -140,7 +140,7 @@ Loose coupling makes you think **content first**. There is no need to write a co
 
 
 ### But naming things is unnecessary
-Naming things is a skill. You name things that repeat. Think of function names in JavaScript or component names in Figma. The same goes for CSS class names. Be good at naming, and you can move from repeating things to re-using things. That is: You can move from this:
+Naming things is a skill. You name things that repeat. Think of function names in JavaScript or component names in Figma. The same goes for CSS class names. Be good at naming, and you can move from repeating things to reusing things. That is: You can move from this:
 
 ```html
 <!-- utility-first css -->
@@ -170,7 +170,7 @@ Without turning into components.
 
 
 ### But co-location is important?
-Co-location is a catchy name for tight coupling. A term to promote the idea that styling should be tied to the presentation. Repeating things vs. re-using things. See above.
+Co-location is a catchy name for tight coupling. A term to promote the idea that styling should be tied to the presentation. Repeating things vs. reusing things. See above.
 
 
 ### But Tailwind is a great design system

packages/nuejs.org/docs/content-collections.md

@@ -93,10 +93,10 @@ When content entries include a `thumb` property, the layout adjusts to display a
   <li>
     <a href="/posts/scaleable-design-system.html">
       <figure>
-        <img src="/posts/img/ui-thumb.png" loading="lazy" alt="Scaleable design system">
+        <img src="/posts/img/ui-thumb.png" loading="lazy" alt="Scalable design system">
         <figcaption>
           <time datetime="2023-05-22T00:00:00.000Z">May 22, 2023</time>
-          <h2>Crafting a scaleable CSS design system</h2>
+          <h2>Crafting a scalable CSS design system</h2>
         </figcaption>
       </figure>
     </a>

packages/nuejs.org/docs/css-best-practices.md

@@ -150,17 +150,17 @@ Instead, you should write clean and semantic HTML:
 Clean HTML is significantly easier to read and work with. Use a class name only on the root element and let CSS selectors do the rest. It's surprising how little class names you need with clean, semantic markup. This website, for example, has only four class names on the global scope: "grid", "card", "stack" and "note". "Global namespace pollution" is essentially a myth and is trivial to avoid.
 
 
-## Create re-usable class names { #reuse }
+## Create reusable class names { #reuse }
 Always find ways to extract reusable pieces from your CSS code. For example, the above notification component could be written as:
 
-```html.good "Using a re-usable class name"
+```html.good "Using a reusable class name"
 <div class="notification •card•">
   <h3>ChitChat</h3>
   <p>You have a new message</p>
 </div>
 ```
 
-Here, the component was broken into two pieces: A highly re-usable "card" component and a notification-specific "notification" component:
+Here, the component was broken into two pieces: A highly reusable "card" component and a notification-specific "notification" component:
 
 
 ```css
@@ -181,7 +181,7 @@ Here, the component was broken into two pieces: A highly re-usable "card" compon
 }
 ```
 
-Now the "card" class can be applied to any element or component you desire, reducing code duplication an making a smaller and clearer codebase.
+Now the "card" class can be applied to any element or component you desire, reducing code duplication and making a smaller and clearer codebase.
 
 
 #### Links:

packages/nuejs.org/docs/css/doc-navi.css

@@ -57,7 +57,7 @@ aside:first-child nav {
 .toc {
   margin: 1.5em 0 2.5em;
 
-  /* overlfow ellipsis */
+  /* overflow ellipsis */
   a {
     max-width: 16em;
     display: block;

packages/nuejs.org/docs/faq.md

@@ -6,7 +6,7 @@ beside: false
 
 
 ### The industry has standardized around component-based architecture across React, Vue, and Svelte. Why go against this unified direction?
-Beacuse something went wrong in web development. Let me explain:
+Because something went wrong in web development. Let me explain:
 
 If you look at the first waves of innovation – DHTML bringing interactivity to static pages, jQuery making cross-browser development possible – these technologies represented genuine progress. Each step made the web more dynamic and developer-friendly.
 

packages/nuejs/src/browser/nue.js

@@ -13,7 +13,7 @@ const CORE_ATTR = ['class', 'style', 'id']
  * @typedef {{ name: string, tagName: string, tmpl: string, ... }} Component
  * @param { Component } component - a (compiled) component instance to be mounted
  * @param { Object } [data = {}] - optional data or data model for the component
- * @param { Array<Component> } [deps = {}] - optional array of nested/dependant components
+ * @param { Array<Component> } [deps = {}] - optional array of nested/dependent components
  * @param { Object } $parent - (for internal use only)
 */
 export default function createApp(component, data = {}, deps = [], $parent = {}) {

packages/nuekit/src/site.js

@@ -274,7 +274,7 @@ export async function createSite(args) {
   }
 
 
-  // get fromt matter data from all .md files on a directory
+  // get front matter data from all .md files on a directory
   self.getContentCollection = async function(dir) {
     const key = 'coll:' + dir
     if (cache[key]) return cache[key]

packages/nuemark/src/parse-document.js

@@ -19,7 +19,7 @@ export function parseDocument(lines) {
     meta.title = getTitle(blocks) || tag && getTitle(tag.blocks) || ''
   }
 
-  // descrption
+  // description
   if (!meta.description) {
     const block = blocks.find(el => el.is_content)
     meta.description = block?.content[0]

packages/nuemark/src/parse-inline.js

@@ -20,7 +20,7 @@ export const FORMATTING = {
   '•':   'b',
 }
 
-// chars to espace
+// chars to escape
 export const ESCAPED = { '<': '&lt;', '>': '&gt;' }
 
 // tested: regexp is faster than custom lookup function