Add external link indicators to documentation pages

Author: jbunke

assets/ui/external.png

@@ -53,4 +53,4 @@ This script utilizes the following API functions:
 
 **SEE ALSO**
 
-* [Automation script examples](https://github.com/stipple-effect/script-examples/tree/main/scripts/automation)
+* [Automation script examples![](./assets/ui/external.png)](https://github.com/stipple-effect/script-examples/tree/main/scripts/automation)

automation-scripts.md

@@ -30,7 +30,7 @@ In the interest of performance, it is best to declare any child scripts used in
 
 ### [`script::run(A)`](../api/script.md#run) and `script::run(A) -> R`
 
-`script` objects represent child scripts. They are executed with the `run()` function. Depending on whether the child script returns a value or not, `run()` should either be called as an [expression](https://en.wikipedia.org/wiki/Expression_(computer_science)) or as a [statement](https://en.wikipedia.org/wiki/Statement_(computer_science)).
+`script` objects represent child scripts. They are executed with the `run()` function. Depending on whether the child script returns a value or not, `run()` should either be called as an [expression![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Expression_(computer_science)) or as a [statement![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Statement_(computer_science)).
 
 ---
 

child-scripts.md

@@ -6,7 +6,7 @@
 
 **Note:**
 
-They may be written to produce [side effects](https://en.wikipedia.org/wiki/Side_effect_(computer_science)), though this will adversely impact performance.
+They may be written to produce [side effects![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Side_effect_(computer_science)), though this will adversely impact performance.
 
 ## Contract
 
@@ -55,10 +55,10 @@ This script takes the input color `c` and returns a shade of grey with the same
 
 This script does not utilize any functions from the scripting API.
 
-However, it makes use of the `rgba(int r, int g, int b, int alpha) -> color` function from the *DeltaScript* base language [standard library](https://github.com/jbunke/deltascript). <!-- TODO - GitHub link to SL and to specific function -->
+However, it makes use of the `rgba(int r, int g, int b, int alpha) -> color` function from the *DeltaScript* base language [standard library![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/functions-sl.md#rgba).
 
 ---
 
 **SEE ALSO**
 
-* [Color script examples](https://github.com/stipple-effect/script-examples/tree/main/scripts/color)
+* [Color script examples![](./assets/ui/external.png)](https://github.com/stipple-effect/script-examples/tree/main/scripts/color)

color-scripts.md

@@ -5,12 +5,12 @@
 This article is meant to (1) provide an overview of the digital color theory concepts that one should understand in order to best use *Stipple Effect*, and (2) explain and illustrate some of *Stipple Effect*'s color-related jargon and conventions.
 
 ## Color models
-[*Wikipedia article*](https://en.wikipedia.org/wiki/Color_model)
+[*Wikipedia article*![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Color_model)
 
 A **color model** is a mathematical model used to represent colors as a combination of numbers. Each of these numbers is associated with a particular attribute or quantity.
 
 ### RGB(A)
-[*Wikipedia article*](https://en.wikipedia.org/wiki/RGBA_color_model)
+[*Wikipedia article*![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/RGBA_color_model)
 
 The **RGB** color model is an additive color model with the components **red** (R), **green** (G), and **blue** (B). These components are referred to as color channels.
 
@@ -24,9 +24,9 @@ The **RGBA** color model is an extension of RGB that adds a fourth channel: **al
 
 **Hex codes**
 
-[*Wikipedia article*](https://en.wikipedia.org/wiki/Web_colors#Hex_triplet)
+[*Wikipedia article*![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Web_colors#Hex_triplet)
 
-**Hex codes** are six- or eight-digit alphanumeric codes following a leading `#` that represent digital colors in the RGB color model. Since the maximum value an RGB color channel can have is 255, a base-16 numbering system is the numbering system with the lowest [radix](https://en.wikipedia.org/wiki/Radix) that can represent all possible RGB channel values in two digits.
+**Hex codes** are six- or eight-digit alphanumeric codes following a leading `#` that represent digital colors in the RGB color model. Since the maximum value an RGB color channel can have is 255, a base-16 numbering system is the numbering system with the lowest [radix![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Radix) that can represent all possible RGB channel values in two digits.
 
 Hexadecimal (base-16) numbering uses the digits 0 to F, where A follows 9. Thus, the digit A = 10, B = 11, and so on. Alphabetical digits can be represented in uppercase or lowercase.
 
@@ -50,15 +50,15 @@ From the above example:
 * **Blue:** a1<sub>16</sub> = 161
 
 **Read more:**
-* [Hexadecimal (base-16) numbers](https://en.wikipedia.org/wiki/Hexadecimal)
+* [Hexadecimal (base-16) numbers![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Hexadecimal)
 
 ### HSV
 
 ![](./assets/theory/hsv-cone.png "HSV color model represented as a cone with a cross section")
 
-The HSV model as implemented in *Stipple Effect* is best visualized as a cone. It is also often described as a cylinder. [**Hue**](https://en.wikipedia.org/wiki/Hue) is the angular property. [**Saturation**](https://en.wikipedia.org/wiki/Colorfulness) the radial dimension. That is to say that the saturation of a particular color in the model can be described as the ratio of its distance from the center of the cone to the radius of the cone at that particular height level. [**Value**](https://en.wikipedia.org/wiki/Lightness), alternatively **lightness** or **brightness**, is the height level of the color in the cone.
+The HSV model as implemented in *Stipple Effect* is best visualized as a cone. It is also often described as a cylinder. [**Hue**![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Hue) is the angular property. [**Saturation**![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Colorfulness) the radial dimension. That is to say that the saturation of a particular color in the model can be described as the ratio of its distance from the center of the cone to the radius of the cone at that particular height level. [**Value**![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Lightness), alternatively **lightness** or **brightness**, is the height level of the color in the cone.
 
-Value is somewhat ambiguously defined in HS(V/L/B) color models. *Stipple Effect* defines value as the normalized single highest RGB color channel value. Thus, pure white ([`#ffffff`](https://en.wikipedia.org/wiki/White)) and pure blue ([`#0000ff`](https://en.wikipedia.org/wiki/Blue)) have the same value (1.0), despite white being a lighter color than blue.
+Value is somewhat ambiguously defined in HS(V/L/B) color models. *Stipple Effect* defines value as the normalized single highest RGB color channel value. Thus, pure white ([`#ffffff`![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/White)) and pure blue ([`#0000ff`![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Blue)) have the same value (1.0), despite white being a lighter color than blue.
 
 Any color can be mapped from the RGB model to the HSV model, and vice versa. *Stipple Effect* has various [color samplers](./interface.md#samplers) that can be swapped out to visualize colors using different models.
 

color.md

@@ -16,19 +16,8 @@
 ### Actions
 
 * [Sizing & frame control](./sizing.md)
-  * [Resize](./sizing.md/#resize)
-  * [Pad canvas](./sizing.md/#pad-canvas)
-  * [Split](./sizing.md/#split-a-sprite-sheet-into-frames)
-  * [Stitch](./sizing.md/#stitch-an-animation-into-a-sprite-sheet)
 * [State control](./state-control.md)
-  * [Undo/redo](./state-control.md#undo--redo)
-  * [History](./state-control.md/#history)
-  * [Time lapse](./state-control.md/#generate-a-time-lapse)
 * [Color actions](./color-actions.md)
-  * [Palettization](./color-actions.md/#palettization)
-  * [Extract to palette](./color-actions.md/#extract-canvas-colors-to-palette)
-  * [HSV adjustment](./color-actions.md/#hsv-adjustment)
-  * [Run color script](./color-actions.md/#run-a-color-script)
 * [Outlining](./outline.md)
 * [Pixel grid](./pixel-grid.md)
 

docs-sidebar.md

@@ -2,7 +2,7 @@
 
 [`< Overview`](./README.md)
 
-*Stipple Effect* uses the underlying [*Delta Time*](https://github.com/jbunke/delta-time) library to load and display fonts. Thus, the program's native system fonts, as well as user-defined fonts uploaded for use by the [text tool](./text-tool.md) at runtime, must comply with Delta Time's **font standard**.
+*Stipple Effect* uses the underlying [*Delta Time*![](./assets/ui/external.png)](https://github.com/jbunke/delta-time) library to load and display fonts. Thus, the program's native system fonts, as well as user-defined fonts uploaded for use by the [text tool](./text-tool.md) at runtime, must comply with Delta Time's **font standard**.
 
 ## Font files
 
@@ -15,17 +15,17 @@
 
 ### Parsed pixel colors
 
-* **Red** (`#ff0000`) - parsed as part of the [glyph](https://en.wikipedia.org/wiki/Glyph) associated with its bounding box
+* **Red** (`#ff0000`) - parsed as part of the [glyph![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Glyph) associated with its bounding box
 * **Green** (`#00ff00`) - parsed as left- or right pixel boundary of the glyph associated with its bounding box *at that particular pixel height*
 
 **Read more:**
-* [Color hex codes](https://en.wikipedia.org/wiki/Web_colors#Hex_triplet)
+* [Color hex codes![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Web_colors#Hex_triplet)
 
 ### Boundary enforcement
 
 Explicitly defining boundaries using the color green can a few applications, including:
 
-* defining [monospaced](https://en.wikipedia.org/wiki/Monospaced_font) fonts
+* defining [monospaced![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Monospaced_font) fonts
 
 ![Monospaced and proportional font comparison](./assets/theory/monospacing.png "Monospaced and proportional font comparison")
 
@@ -37,7 +37,7 @@ Explicitly defining boundaries using the color green can a few applications, inc
 
 Fonts support following **character sets**:
 
-* [ASCII](https://en.wikipedia.org/wiki/ASCII#Printable_character_table)
+* [ASCII![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/ASCII#Printable_character_table)
 
 ![Default ASCII set provided by Stipple Effect as a template](./assets/theory/ascii.png)
 

fonts.md

@@ -164,9 +164,9 @@ _**Normal Map**_
 
 Normal mapping is a technique most often used to simulate lighting. A "normal map" is a type of asset that is used in conjuction with a standard texture to represent the **surface normals** of the object represented by the texture. These surface normals can then be used to simulate lighting based on a light source.
 
-The normal map sampler in *Stipple Effect* can be [quantized](https://en.wikipedia.org/wiki/Color_quantization) for a limited set of directions or faces, which may be more pertinent to a pixel art context.
+The normal map sampler in *Stipple Effect* can be [quantized![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Color_quantization) for a limited set of directions or faces, which may be more pertinent to a pixel art context.
 
-Read more about normal maps [here](https://en.wikipedia.org/wiki/Normal_mapping).
+Read more about normal maps [here![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Normal_mapping).
 
 ### Palettes
 

interface.md

@@ -39,7 +39,7 @@ Toggle the pixel grid on or off. The pixel grid icon is located in the lower seg
 
 **Shortcut:** <kbd>Ctrl</kbd> + <kbd>B</kbd>
 
-If the [project](./project.md) has a [selection](./selection.md), the program attempts to set the dimensions of the pixel grid and checkerboard rectangles to the bounds of the smallest [axis-aligned bounding box](https://en.wikipedia.org/wiki/Minimum_bounding_box#Axis-aligned_minimum_bounding_box) that captures all the pixels in the selection. If the project does **not** have a selection, the program attempts to set the dimensions of the rectangles to the dimensions of the project canvas.
+If the [project](./project.md) has a [selection](./selection.md), the program attempts to set the dimensions of the pixel grid and checkerboard rectangles to the bounds of the smallest [axis-aligned bounding box![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Minimum_bounding_box#Axis-aligned_minimum_bounding_box) that captures all the pixels in the selection. If the project does **not** have a selection, the program attempts to set the dimensions of the rectangles to the dimensions of the project canvas.
 
 **Note:**
 

pixel-grid.md

@@ -8,13 +8,13 @@ The script is executed every time that the user edits the project. An edit to th
 
 **Note:**
 
-Preview script transformations merely affect the preview. **These transformations are not applied to the project itself.** However, the results of preview script transformations can be [converted into full-fledged projects](./preview-window.md#converting-preview-script-transformations-into-projects).
+Preview script transformations merely affect the preview. **These transformations are not applied to the project itself.** However, the results of preview script transformations can be [converted into full-fledged projects](./preview-window.md#converting-previews-into-projects).
 
 ## Contract
 
 *How preview scripts must be structured to be accepted by the program*
 
-Preview scripts can have a few possible [type signatures](https://en.wikipedia.org/wiki/Type_signature):
+Preview scripts can have a few possible [type signatures![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Type_signature):
 
 * They must take a single parameter<sup>1, 2</sup>. This can either be an `image` or an array of images `image[]`.
 * They must return either an `image` or an array of images `image[]`. The return type is not correlated with the parameter type.
@@ -152,13 +152,11 @@ This script utilizes the following API function:
 
 * [`$Graphics.uv_mapping(image texture, image map, image animation) -> image`](../api/graphics.md#uv_mapping)
 
-This script utilizes the following functions from the *DeltaScript* base language [standard library](https://github.com/jbunke/deltascript): <!-- TODO - GitHub link to SL -->
+This script utilizes the following functions from the *DeltaScript* [standard library![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/std-lib.md):
 
-<!-- TODO - links to specific functions in the SL -->
-
-* `read_image(string filepath) -> image`
-* `new_image_of(int width, int height) -> image`
-* `image::draw(image overlay, int x, int y)`
+* [`read_image(string filepath) -> image`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/functions-sl.md#read_image)
+* [`new_image_of(int width, int height) -> image`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/functions-sl.md#new_image_of)
+* [`image::draw(image overlay, int x, int y)`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/image-sl.md#draw)
 
 ## Example 2
 
@@ -210,19 +208,17 @@ If `orig` is wider than it is tall, the copies are stacked vertically. If not, t
 
 This script does not utilize any functions from the scripting API.
 
-However, it makes use of the following functions from the *DeltaScript* base language [standard library](https://github.com/jbunke/deltascript): <!-- TODO - GitHub link to SL -->
-
-<!-- TODO - links to specific functions in the SL -->
+However, it makes use of the following functions from the *DeltaScript* [standard library![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/std-lib.md):
 
-* `new_image_of(int width, int height) -> image`
-* `rgba(int r, int g, int b, int alpha) -> color`
-* `image::dot(color c, int x, int y)`
-* `image::draw(image overlay, int x, int y)`
-* `image::pixel(int x, int y) -> color`
+* [`new_image_of(int width, int height) -> image`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/functions-sl.md#new_image_of)
+* [`rgba(int r, int g, int b, int alpha) -> color`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/functions-sl.md#rgba)
+* [`image::dot(color c, int x, int y)`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/image-sl.md#dot)
+* [`image::draw(image overlay, int x, int y)`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/image-sl.md#draw)
+* [`image::pixel(int x, int y) -> color`![](./assets/ui/external.png)](https://github.com/jbunke/deltascript/blob/master/docs/image-sl.md#pixel)
 
 ---
 
 **SEE ALSO**
 
-* [Preview script examples](https://github.com/stipple-effect/script-examples/tree/main/scripts/preview)
+* [Preview script examples![](./assets/ui/external.png)](https://github.com/stipple-effect/script-examples/tree/main/scripts/preview)
 * [Preview window](./preview-window.md)

preview-scripts.md

@@ -6,7 +6,7 @@ title: Project | Stipple Effect documentation
 
 [`< Overview`](./README.md)
 
-A *Stipple Effect* session consists of one or multiple **projects**. Projects are sometimes referred to – especially in the [source code](https://github.com/stipple-effect/stipple-effect) – as **contexts**.
+A *Stipple Effect* session consists of one or multiple **projects**. Projects are sometimes referred to – especially in the [source code![](./assets/ui/external.png)](https://github.com/stipple-effect/stipple-effect) – as **contexts**.
 
 The projects that are currently loaded in the program are arranged in the [projects panel](./interface.md#projects).
 

project.md

@@ -18,7 +18,7 @@ Saving a project to any other file type than STIP is considered an **export**. S
 
 **Single PNG:**
 
-For exporting a static project as a [PNG image](https://en.wikipedia.org/wiki/PNG). PNG images preserve transparency.
+For exporting a static project as a [PNG image![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/PNG). PNG images preserve transparency.
 
 **Sprite sheet:**
 
@@ -30,11 +30,11 @@ Exports an animation as a series of separate image files. Files have a shared na
 
 **Animated GIF:**
 
-Exports an animation as an [animated GIF image](https://en.wikipedia.org/wiki/GIF#Animated_GIF).
+Exports an animation as an [animated GIF image![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/GIF#Animated_GIF).
 
 **MP4 Video:**
 
-Exports an animation as an [MP4 video](https://en.wikipedia.org/wiki/MP4_file_format). This is a [lossy compression](https://en.wikipedia.org/wiki/Lossy_compression) export.
+Exports an animation as an [MP4 video![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/MP4_file_format). This is a [lossy compression![](./assets/ui/external.png)](https://en.wikipedia.org/wiki/Lossy_compression) export.
 
 ### Export options