Fix typos (#3292)

.github/CONTRIBUTING.md

@@ -6,7 +6,7 @@ daisyUI welcomes contributions from anyone willing to help 🤝
 
 - Before opening a new issue, first [search for existing issues](https://github.com/saadeghi/daisyui/issues?q=) to avoid duplications.
 - Provide detailed reports to make things easier for maintainers.
-- If there's a weird bug, please provide a reproduction repository on Github (or a [CodePen page](https://daisyui.com/codepen/) or [Tailwind Play](https://daisyui.com/tailwindplay/) page)
+- If there's a weird bug, please provide a reproduction repository on GitHub (or a [CodePen page](https://daisyui.com/codepen/) or [Tailwind Play](https://daisyui.com/tailwindplay/) page)
 
 ## Fixing existing issues
 
@@ -71,7 +71,7 @@ daisyUI welcomes contributions from anyone willing to help 🤝
 
 ## Adding a new component
 
-Before adding a new component, please make sure it's [start a discussion about it on Github](https://github.com/saadeghi/daisyui/discussions) so we can talk about how the structure and style should be.  
+Before adding a new component, please make sure it's [start a discussion about it on GitHub](https://github.com/saadeghi/daisyui/discussions) so we can talk about how the structure and style should be.  
 There is a `List of components` at the end of [/README.md](https://github.com/saadeghi/daisyui/blob/master/README.md) that I think would be a good to complete.
 
 ### File structure

CHANGELOG.md

@@ -562,7 +562,7 @@ All notable changes to this project will be documented in this file. See [commit
 - daisyUI official store – Get professional templates made by daisyUI
 - daisyUI resources – A handpicked collection of community videos, articles and courses about daisyUI
 - Add roadmap page
-- Add docs for utiltiy classes
+- Add docs for utility classes
 - Update theme generator
 - Show browser support for components that are using new CSS rules
 
@@ -595,7 +595,7 @@ All notable changes to this project will be documented in this file. See [commit
 
 ### Bug Fixes
 
-- [#2116](https://github.com/saadeghi/daisyui/issues/2116) progess bar firefox bug ([#2376](https://github.com/saadeghi/daisyui/issues/2376)) ([53889de](https://github.com/saadeghi/daisyui/commit/53889de67cb61ff223acb037f4aa7736e4fbf430))
+- [#2116](https://github.com/saadeghi/daisyui/issues/2116) progress bar firefox bug ([#2376](https://github.com/saadeghi/daisyui/issues/2376)) ([53889de](https://github.com/saadeghi/daisyui/commit/53889de67cb61ff223acb037f4aa7736e4fbf430))
 
 ## [3.8.1](https://github.com/saadeghi/daisyui/compare/v3.8.0...v3.8.1) (2023-09-27)
 

src/docs/src/components/Footer.svelte

@@ -82,7 +82,7 @@ const newtabicon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="2
           rel="noopener, noreferrer"
           href="https://github.com/saadeghi/daisyui"
           class="link link-hover group">
-          Github
+          GitHub
           {@html newtabicon}
         </a>
 

src/docs/src/lib/data/roadmap.js

@@ -131,7 +131,7 @@ export const roadmap = [
         done: true,
       },
       {
-        title: "table redesing",
+        title: "table redesign",
         done: true,
       },
       {
@@ -268,7 +268,7 @@ export const roadmap = [
         done: true,
       },
       {
-        title: "Document utiltiy classes",
+        title: "Document utility classes",
         done: true,
       },
       {

src/docs/src/lib/data/store.js

@@ -52,11 +52,11 @@ export const productCustomAttributes = [
         ],
       ],
     },
-    preveiw: {
+    preview: {
       button: "Preview",
       url: "https://www.figma.com/community/file/1417577350704829934",
     },
-    preveiw_modal: {
+    preview_modal: {
       button: "All Features",
       img: "https://img.daisyui.com/images/store/official-daisyui-figma-library-price.webp",
     },
@@ -99,7 +99,7 @@ export const productCustomAttributes = [
     },
     screenshot: "https://img.daisyui.com/images/store/screenshots/nexus.webp",
     tech: ["html", "react", "nextjs"],
-    preveiw: {
+    preview: {
       button: "Live demo",
       url: "https://nexus.daisyui.com/",
     },

src/docs/src/lib/data/testimonials.js

@@ -33,7 +33,7 @@ export const tweets = [
   {
     id: "1556968894862180354",
     content:
-      "We use daisyUI + Tailwind with our projects. It has been extremly helpful building websites fast and give us a red design line through several different projects.",
+      "We use daisyUI + Tailwind with our projects. It has been extremely helpful building websites fast and give us a red design line through several different projects.",
     name: "TiiaAurora",
     username: "TiiaAurora",
     bio: "Tech journalist",

src/docs/src/routes/(docs)/blog/(posts)/daisyui-vs-tailwindui/+page.md

@@ -74,7 +74,7 @@ Both daisyUI and Tailwind UI use Tailwind CSS under the hood. Tailwind UI uses t
 
 Some components in Tailwind UI are interactive and they need JavaScript to work.
 
-daisyUI however, is a dev-dependency. It doesn't need any JavaScript to work. It's a pure CSS component library and it works just well even if JavaScript is disabled on the borwser. daisyUI provides some interactive components which are possible with CSS only.
+daisyUI however, is a dev-dependency. It doesn't need any JavaScript to work. It's a pure CSS component library and it works just well even if JavaScript is disabled on the browsers. daisyUI provides some interactive components which are possible with CSS only.
 
 daisyUI doesn't include interactive elements that need JS (for example a date picker). However, you can use any JS library with daisyUI. Headless libraries like [Headless UI](https://headlessui.com/) or [Radix primitives](https://www.radix-ui.com/primitives) are recommended. You can also use any other JS plug-in that you like and you can add daisyUI classes or color values to them so they would fit your website design.
 

src/docs/src/routes/(docs)/blog/(posts)/how-to-update-daisyui-4/+page.md

@@ -55,7 +55,7 @@ Here's the primary color of light theme in daisyUI 3 and 4:
 </div>
 </div>
 
-So for using daisyUI color CSS variables directly inside your porject, change the color funtions from `hsl()` to `oklch()` like this:
+So for using daisyUI color CSS variables directly inside your project, change the color functions from `hsl()` to `oklch()` like this:
 
 <div class="grid sm:grid-cols-2 gap-x-4">
 <div class="text-center text-xs text-base-content/50 font-bold">Before</div>

src/docs/src/routes/(docs)/components/footer/+page.svx

@@ -518,7 +518,7 @@ data="{[
     <button class="link link-hover">Twitter</button>
     <button class="link link-hover">Instagram</button>
     <button class="link link-hover">Facebook</button>
-    <button class="link link-hover">Github</button>
+    <button class="link link-hover">GitHub</button>
   </nav> 
   <nav>
     <h6 class="footer-title">Explore</h6> 
@@ -564,7 +564,7 @@ data="{[
     <a class="$$link $$link-hover">Twitter</a>
     <a class="$$link $$link-hover">Instagram</a>
     <a class="$$link $$link-hover">Facebook</a>
-    <a class="$$link $$link-hover">Github</a>
+    <a class="$$link $$link-hover">GitHub</a>
   </nav>
   <nav>
     <h6 class="$$footer-title">Explore</h6>

src/docs/src/routes/(docs)/components/menu/+page.svx

@@ -1156,8 +1156,8 @@ data="{[
     <button>Products</button>
     <ul>
       <li><button>UI Kit</button></li>
-      <li><button>Wordpress themes</button></li>
-      <li><button>Wordpress plugins</button></li>
+      <li><button>WordPress themes</button></li>
+      <li><button>WordPress plugins</button></li>
       <li>
         <button>Open source</button>
         <ul>
@@ -1204,8 +1204,8 @@ data="{[
     <a>Products</a>
     <ul>
       <li><a>UI Kit</a></li>
-      <li><a>Wordpress themes</a></li>
-      <li><a>Wordpress plugins</a></li>
+      <li><a>WordPress themes</a></li>
+      <li><a>WordPress plugins</a></li>
       <li>
         <a>Open source</a>
         <ul>

src/docs/src/routes/(docs)/store/+page.svelte

@@ -331,16 +331,16 @@ function prev(productId, media) {
                 </svg>
               </a>
               <div class="flex gap-x-4">
-                {#if product.preveiw}
-                  <a class="link text-xs" href="{product.preveiw.url}" target="_blank" rel="noopener noreferrer">
-                    {product.preveiw.button}
+                {#if product.preview}
+                  <a class="link text-xs" href="{product.preview.url}" target="_blank" rel="noopener noreferrer">
+                    {product.preview.button}
                   </a>
                 {/if}
-                {#if product.preveiw_modal}
-                  <button class="link text-xs" onclick="{() => preveiw_modal.showModal()}">{product.preveiw_modal.button}</button>
-                  <dialog id="preveiw_modal" class="modal">
+                {#if product.preview_modal}
+                  <button class="link text-xs" onclick="{() => preview_modal.showModal()}">{product.preview_modal.button}</button>
+                  <dialog id="preview_modal" class="modal">
                     <div class="modal-box p-0 shadow-none bg-transparent max-w-fit max-h-fit my-32">
-                      <img src="{product.preveiw_modal.img}" alt="{product.attributes.name}" class="max-h-screen w-auto" />
+                      <img src="{product.preview_modal.img}" alt="{product.attributes.name}" class="max-h-screen w-auto" />
                     </div>
                     <form method="dialog" class="modal-backdrop">
                       <button>close</button>

src/lib/responsiveRegex.js

@@ -9,12 +9,12 @@ module.exports = [
     pattern: /.*/,
   },
   {
-    // responsive utilites for daisyUI responsive modifiers
+    // responsive utilities for daisyUI responsive modifiers
     pattern: /.(sm|md|lg|xl)/,
     variants: ["sm", "md", "lg", "xl"],
   },
   {
-    // responsive utilites for daisyUI components
+    // responsive utilities for daisyUI components
     pattern:
       /(drawer-open|modal-(middle|top|bottom)|card-(side|compact|normal)|(stats|divider)-(horizontal|vertical)|dropdown-(end|top|bottom|left|right))/,
     variants: ["sm", "md", "lg", "xl"],

src/tests/colors.test.js

@@ -1,9 +1,9 @@
 import { expect, test } from "bun:test"
 import * as colorFunctions from "../theming/functions"
-import { forgroundPairs } from "./data"
+import { foregroundPairs } from "./data"
 
 // foreach array
-for (const pair of forgroundPairs) {
+for (const pair of foregroundPairs) {
   test(`foreground color for \t${pair.input} \tis oklch(${pair.result})`, () => {
     expect(colorFunctions.generateForegroundColorFrom(pair.input, pair.percent)).toBe(pair.result)
   })

src/tests/data.js

@@ -36,7 +36,7 @@ export const cssVars = [
   "--tab-radius",
 ]
 
-export const forgroundPairs = [
+export const foregroundPairs = [
   { input: "#fff", percent: 0.8, result: "20% 0 0" },
   { input: "#000", percent: 0.8, result: "80% 0 0" },
   { input: "#fff", percent: 1, result: "0% 0 0" },