Merge branch 'main' into cssmod-box-alignment

.github/workflows/pr-test-new-ci.yml

@@ -103,7 +103,7 @@ jobs:
           # package.json.
           echo Y|yarn rari update
           ARGS=$(echo $GIT_DIFF_CONTENT | sed -E -e "s#(^| )files#\1-f $PWD/files#g")
-          yarn rari build --no-basic --json-issues $ARGS
+          yarn rari build --no-basic --json-issues --data-issues $ARGS
           yarn yari-render-html
 
           echo "Disk usage size of the build"

.vscode/dictionaries/ignore-list.txt

@@ -112,9 +112,11 @@ dubby
 Duden
 dXNlcm5hbWU6cGFzc3dvcmQ
 EACC
+efregre
 eirmod
 elitr
 ERHGDFy
+ertgrth
 esset
 essum
 Ethere
@@ -173,6 +175,7 @@ isnt
 isoff
 javascripts
 jdoe
+Jgfbgfdgt
 jngl
 jnglstore
 js13kgames
@@ -253,6 +256,7 @@ rebum
 regelialia
 rheeeeet
 ricebean
+rtgtfghhyj
 s3pPLMBiTxaQ9kYGzzhZRbK
 sadipscing
 sagnarelli
@@ -306,6 +310,7 @@ webglsamples
 webvr
 weta
 Whereami
+Whereshire
 wisen
 wisi
 Wookie

.vscode/dictionaries/proper-names.txt

@@ -76,6 +76,7 @@ Béziers
 caitmuenster
 Camino
 Camtasia
+Canva
 Carakan
 Cardano
 carinaanand
@@ -567,6 +568,7 @@ Theora
 Thierry
 Tidwell
 Tink
+tinypng
 Titilayo
 Tokopedia
 Tomayac

.vscode/dictionaries/terms-abbreviations.txt

@@ -714,6 +714,7 @@ sundried
 sunsetting
 supercookie
 superdomain
+superpowered
 superscaling
 supersets
 SVCB

files/en-us/_redirects.txt

@@ -12791,6 +12791,7 @@
 /en-US/docs/Web/JavaScript/Guide/Inheritance_Revisited	/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
 /en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain	/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
 /en-US/docs/Web/JavaScript/Guide/JavaScript_Overview	/en-US/docs/Web/JavaScript/Guide/Introduction
+/en-US/docs/Web/JavaScript/Guide/Numbers_and_dates	/en-US/docs/Web/JavaScript/Guide/Numbers_and_strings
 /en-US/docs/Web/JavaScript/Guide/Obsolete_Pages	/en-US/docs/Web/JavaScript/Guide
 /en-US/docs/Web/JavaScript/Guide/Obsolete_Pages/Block_Statement	/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling
 /en-US/docs/Web/JavaScript/Guide/Obsolete_Pages/Calling_Functions	/en-US/docs/Web/JavaScript/Guide/Functions
@@ -12876,6 +12877,7 @@
 /en-US/docs/Web/JavaScript/Guide/Regular_expressions/Unicode_property_escapes	/en-US/docs/Web/JavaScript/Reference/Regular_expressions/Unicode_character_class_escape
 /en-US/docs/Web/JavaScript/Guide/Sameness	/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness
 /en-US/docs/Web/JavaScript/Guide/Statements	/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling
+/en-US/docs/Web/JavaScript/Guide/Text_formatting	/en-US/docs/Web/JavaScript/Guide/Numbers_and_strings
 /en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol	/en-US/docs/Web/JavaScript/Reference/Iteration_protocols
 /en-US/docs/Web/JavaScript/Guide/The_legacy_Iterator_protocol	/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
 /en-US/docs/Web/JavaScript/Guide/Using_native_JSON	/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON

files/en-us/_wikihistory.json

@@ -102176,7 +102176,7 @@
       "douglasnaphas"
     ]
   },
-  "Web/JavaScript/Guide/Numbers_and_dates": {
+  "Web/JavaScript/Guide/Numbers_and_strings": {
     "modified": "2020-11-14T07:27:01.088Z",
     "contributors": [
       "mfuji09",
@@ -102422,31 +102422,6 @@
       "jpmedley"
     ]
   },
-  "Web/JavaScript/Guide/Text_formatting": {
-    "modified": "2020-05-25T10:48:56.137Z",
-    "contributors": [
-      "fscholz",
-      "wbamberg",
-      "bma",
-      "alattalatta",
-      "vriojtg",
-      "sbfraser01",
-      "chrisdavidmills",
-      "JigneshMistry",
-      "stephaniehobson",
-      "SphinxKnight",
-      "amir77ameri",
-      "ThomasEugeneBishop",
-      "nmve",
-      "kdex",
-      "Jeremie",
-      "danielinux7",
-      "gportioli",
-      "xfq",
-      "mahzaib",
-      "kscarfone"
-    ]
-  },
   "Web/JavaScript/Guide/Typed_arrays": {
     "modified": "2020-10-15T21:04:01.905Z",
     "contributors": [

files/en-us/games/techniques/tilemaps/square_tilemaps_implementation_colon__scrolling_maps/index.md

@@ -19,7 +19,7 @@ Regardless of the type of camera, we would always need information regarding its
 
 - `x` and `y`: The current position of the camera. In this implementation, we are assuming that `(x,y)` points to the top left corner of visible portion of the map.
 - `width` and `height`: The size of the camera's viewport.
-- `maxX` and `maxY`: The limit for the camera's position — The lower limit will nearly always be (0,0), and in this case the upper limit is equal to the size of the world minus the size of the camera's viewport.
+- `maxX` and `maxY`: The limit for the camera's position — The lower limit will nearly always be `(0,0)`, and in this case the upper limit is equal to the size of the world minus the size of the camera's viewport.
 
 ## Rendering the map
 

files/en-us/games/tutorials/html5_gamedev_phaser_device_orientation/index.md

@@ -28,7 +28,7 @@ You can open the index file in your favorite browser to launch the game and try
 
 - `img`: All the images that we will use in the game.
 - `src`: The JavaScript files with all the source code of the game defined inside.
-- `audio:` The sound files used in the game.
+- `audio`: The sound files used in the game.
 
 ## Setting up the Canvas
 

files/en-us/glossary/aspect_ratio/index.md

@@ -6,7 +6,7 @@ page-type: glossary-definition
 
 {{GlossarySidebar}}
 
-An **aspect ratio** is the proportional relationship between an element or {{glossary("viewport")}}'s width and height, and is represented as a ratio or two numbers.
+An **aspect ratio** is the proportional relationship between an element or {{glossary("viewport")}}'s width and height. It is represented as a {{cssxref("ratio")}} of two numbers.
 
 Having an aspect ratio, whether it's an inherent aspect ratio like with images and videos or if it's extrinsically set, maintains the intended proportions of an element. You can also query an element or viewport's aspect, which is useful in developing flexible components and layouts.
 

files/en-us/glossary/character_reference/index.md

@@ -6,7 +6,7 @@ page-type: glossary-definition
 
 {{GlossarySidebar}}
 
-An {{glossary("HTML")}} **character reference** is a formatted pattern of characters that is used to represent another character in the rendered web page.
+An {{glossary("HTML")}} **character reference** is an {{glossary("escape character", "escape sequence")}} of {{glossary("character", "characters")}} that is used to represent another character in the rendered web page.
 
 Character references are used as replacements for characters that are reserved in HTML, such as the less-than (`<`) and greater-than (`>`) symbols used by the HTML parser to identify element {{Glossary('tag','tags')}}, or `"` or `'` within attributes, which may be enclosed by those characters.
 They can also be used for invisible characters that would otherwise be impossible to type, including non-breaking spaces, control characters like left-to-right and right-to-left marks, and for characters that are hard to type on a standard keyboard.
@@ -21,7 +21,7 @@ There are three types of character references:
 
 - **Decimal numeric character references**
 
-  - : These references start with `&#`, followed by one or more ASCII digits representing the base-ten integer that corresponds to the character's Unicode code point, and ending with `;`.
+  - : These references start with `&#`, followed by one or more ASCII digits representing the base-ten integer that corresponds to the character's {{glossary("Unicode")}} {{glossary("code point")}}, and ending with `;`.
     For example, the decimal character reference for `<` is `&#60;`, because the Unicode code point for the symbol is `U+0003C`, and `3C` hexadecimal is 60 in decimal.
 
 - **Hexadecimal numeric character reference**
@@ -50,3 +50,11 @@ A very small subset of useful named character references along with their unicod
 | °         | `&deg;`         | U+000B0            |
 
 The full list of HTML named character references [can found in the HTML specification here](https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references).
+
+## See also
+
+- Related glossary terms:
+  - {{glossary("Character")}}
+  - {{glossary("Escape character")}}
+  - {{glossary("Code point")}}
+  - {{glossary("Unicode")}}

files/en-us/glossary/escape_character/index.md

@@ -0,0 +1,23 @@
+---
+title: Escape character
+slug: Glossary/Escape_character
+page-type: glossary-definition
+---
+
+{{GlossarySidebar}}
+
+An **escape character** is a {{glossary("character")}} that causes one or more characters that follow it to be interpreted differently. This forms an **escape sequence**, which is often used to represent a character that has an alternative meaning when printed literally, such as the quote character in a string literal. Escape sequences can have other usages too, especially in [regular expressions](/en-US/docs/Web/JavaScript/Reference/Regular_expressions#escape_sequences).
+
+- In JavaScript [regexes](/en-US/docs/Web/JavaScript/Reference/Regular_expressions/Character_escape), [string literals](/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#string_literals), and [identifiers](/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#identifiers), we can use the backslash (`\`) to escape characters like `\'`, `\"`, `\u0026`, etc.
+- In CSS identifiers, we can use the backslash (`\`) to escape characters like `\\`, `\n`, `\26`, etc. See [escape characters](/en-US/docs/Web/CSS/ident#escaping_characters) for more information.
+- In HTML text content and attribute values, we can use {{glossary("character reference", "character references")}} like `<`, `<`, or `<`.
+- In {{glossary("URL", "URLs")}}, we can use the percent sign (`%`) to escape characters like `%20`, `%3C`, `%3E`, etc.
+
+## See also
+
+- Related glossary terms:
+  - {{glossary("Character")}}
+  - {{glossary("Character reference")}}
+  - {{glossary("Code point")}}
+- [Escape character](https://en.wikipedia.org/wiki/Escape_character) on Wikipedia
+- [Escape sequence](https://en.wikipedia.org/wiki/Escape_sequence) on Wikipedia

files/en-us/glossary/guaranteed_invalid_value/index.md

@@ -0,0 +1,17 @@
+---
+title: Guaranteed-invalid value
+slug: Glossary/guaranteed_invalid_value
+page-type: glossary-definition
+---
+
+{{GlossarySidebar}}
+
+In CSS the guaranteed-invalid value is {{CSSXref("initial")}}.
+
+When a [custom property](/en-US/docs/Web/CSS/--*)'s value is the guaranteed-invalid value, the {{CSSXref("var")}} function cannot use it for substitution. Attempting to do so makes the declaration _invalid at computed-value time_, unless a valid fallback is specified.
+
+## See also
+
+- CSS {{CSSXref("initial")}}
+- CSS {{CSSXref("var")}}
+- [CSS Custom Properties for Cascading Variables Module Level 1 Specification](https://www.w3.org/TR/css-variables-1/#guaranteed-invalid)

files/en-us/learn_web_development/core/scripting/math/index.md

@@ -456,7 +456,7 @@ In the next article, we'll explore text and how JavaScript allows us to manipula
 
 ## See also
 
-- [Numbers and dates](/en-US/docs/Web/JavaScript/Guide/Numbers_and_dates)
+- [Numbers and strings](/en-US/docs/Web/JavaScript/Guide/Numbers_and_strings)
 - [Expressions and operators](/en-US/docs/Web/JavaScript/Guide/Expressions_and_operators)
 
 {{PreviousMenuNext("Learn_web_development/Core/Scripting/Variables", "Learn_web_development/Core/Scripting/Strings", "Learn_web_development/Core/Scripting")}}

files/en-us/learn_web_development/core/structuring_content/index.md

@@ -71,7 +71,7 @@ These tutorials are not part of the learning pathway, but they are interesting n
   - : [Scrimba's](https://scrimba.com?via=mdn) _Learn HTML and CSS_ course teaches you HTML and CSS through building and deploying five awesome projects, with fun interactive lessons and challenges taught by knowledgeable teachers.
 - [The basics of semantic HTML](https://v2.scrimba.com/the-frontend-developer-career-path-c0j/~0xid?via=mdn), Scrimba <sup>_MDN Curriculum partner_</sup>
   - : This interactive lesson provides a useful description of HTML, with particular emphasis on why the _semantic_ aspect of it is important.
-- [Learn HTML](https://v2.scrimba.com/the-frontend-developer-career-path-c0j/~0xid?via=mdn), Codecademy
+- [Learn HTML](https://www.codecademy.com/learn/learn-html), Codecademy
   - : Another useful (and free resource) for learning HTML basics.
 
 {{NextMenu("Learn_web_development/Core/Structuring_content/Basic_HTML_syntax", "Learn_web_development/Core")}}

files/en-us/learn_web_development/getting_started/environment_setup/browsing_the_web/index.md

@@ -89,15 +89,15 @@ All web pages can each be found at a unique location (web address, also called a
 
 A _website_ is a collection of linked web pages (plus their associated resources) that share a unique [domain name](/en-US/docs/Learn_web_development/Howto/Web_mechanics/What_is_a_domain_name). Each web page of a given website provides explicit links—most of the time in the form of clickable portions of text—that allow the user to move from one page of the website to another.
 
-When you load your favourite website in a browser, it tends to first display the website's main web page, or _homepage_ (casually referred to as "home"):
+When you load your favorite website in a browser, it tends to first display the website's main web page, or _homepage_ (casually referred to as "home"):
 
 ![Example of a website domain name in the browser address bar](web-site.jpg)
 
 > [!CALLOUT]
 >
 > **Try it out**
 >
-> Try clicking some menu items or links to look at some different pages on your favourite website.
+> Try clicking some menu items or links to look at some different pages on your favorite website.
 
 > [!NOTE]
 > It is also possible to have a [_single-page app_](/en-US/docs/Glossary/SPA): a website that consists of a single web page that is dynamically updated with new content when needed.
@@ -146,11 +146,11 @@ When you access the web, quite a lot happens between your first interaction (for
 
 This description of how the web works is heavily simplified, but it is all you really need to know at this point. You will find a more detailed account of how web pages and requested and rendered by a web browser in our [Web standards](/en-US/docs/Learn_web_development/Getting_started/Web_standards) module, slightly later on.
 
-For now, try opening a web browser and loading up a couple of your favourite sites, thinking about the above steps as you do so.
+For now, try opening a web browser and loading up a couple of your favorite sites, thinking about the above steps as you do so.
 
 ## Searching for information
 
-As a web developer, you will spend a lot of time searching for information, from syntax you can't remember to solutions to specific problems. It is therefore a good idea to learn how to effecively search the web.
+As a web developer, you will spend a lot of time searching for information, from syntax you can't remember to solutions to specific problems. It is therefore a good idea to learn how to effectively search the web.
 
 If you are looking for general information about a specific web technology feature, you should type the name of the feature into the MDN search box. For example, try typing `box model`, `fetch()` or `video element` into the the search box and see what comes up. If you don't find the information you need, try expanding your search — try your search term in a search engine.
 

files/en-us/learn_web_development/getting_started/environment_setup/code_editors/index.md

@@ -35,7 +35,7 @@ Previously, we told you to install a code editor, as you'll need one to work thr
 
 Before starting to code, you may have had some experience working on text documents in a program like Microsoft Word. You might also be wondering whether you can work with code in these same programs. Unfortunately, the answer is "not really":
 
-- Programs like Micosoft Word are **Binary file** editors; their files contain a non-text format that can only be understood by those programs. Website source code, on the other hand, is stored as plain text.
+- Programs like Microsoft Word are **Binary file** editors; their files contain a non-text format that can only be understood by those programs. Website source code, on the other hand, is stored as plain text.
 - Word _can_ open and edit plain text files, but it doesn't handle them very well. It doesn't have a featureset designed for working with code — it is for writing documents such as letters and reports. You need a program that is designed to cleanly handle and output plain text, and work with code.
 
 You probably already have a plain text editor on your computer. By default, Windows includes [Notepad](https://en.wikipedia.org/wiki/Microsoft_Notepad) and macOS comes with [TextEdit](https://en.wikipedia.org/wiki/TextEdit). Linux distros vary; the Ubuntu 22.04 LTS release comes with [GNOME Text Editor](https://en.wikipedia.org/wiki/GNOME_Text_Editor) by default. Default OS plain text editors can be OK, but they also have a limited feature set.
@@ -87,8 +87,8 @@ Let's try an exercise in VS Code:
 
 VS Code provides other syntax features too. For example:
 
-- You'll see a thin vertical line travelling down from the `function` keyword to the closing curly brace (`}`) — these lines are used to mark different [indentation](https://en.wikipedia.org/wiki/Indentation_style) levels in code, making it easier to identify where blocks begin and end.
-- Also try moving the flashing text cursor over the opening or closing curly brace (`{` or `}`) — you'll see both of them highlighted. This also helps identify the start and end of blocks, and is useful when are trying to find where you are missing a character when you have a more complicated structure with lots of nested blocks. This highlighting also works with other delimeters such as parentheses (`(` and `)`) and square brackets (`[` and `]`).
+- You'll see a thin vertical line traveling down from the `function` keyword to the closing curly brace (`}`) — these lines are used to mark different [indentation](https://en.wikipedia.org/wiki/Indentation_style) levels in code, making it easier to identify where blocks begin and end.
+- Also try moving the flashing text cursor over the opening or closing curly brace (`{` or `}`) — you'll see both of them highlighted. This also helps identify the start and end of blocks, and is useful when are trying to find where you are missing a character when you have a more complicated structure with lots of nested blocks. This highlighting also works with other delimiters such as parentheses (`(` and `)`) and square brackets (`[` and `]`).
 
 ### Code completion/suggestion