Stubbed out more guide pages

guide/src/SUMMARY.md

@@ -13,6 +13,7 @@
   - [Multi-Widget Layout](./widgets/multi-layout.md)
     - [Grid](./widgets/layout/grid.md)
     - [Layers](./widgets/layout/layers.md)
+    - [List](./widgets/layout/list.md)
     - [Stack](./widgets/layout/stack.md)
     - [Wrap](./widgets/layout/wrap.md)
   - [Single-widget Layout](./widgets/single-layout.md)
@@ -22,18 +23,13 @@
     - [Expand](./widgets/layout/expand.md)
     - [Resize](./widgets/layout/resize.md)
   - [Controls](./widgets/controls.md)
-    - [Button]()
-    - [Canvas]()
-    - [Checkbox]()
-    - [Color Pickers]()
-    - [Disclose]()
-    - [Input]()
-    - [Label]()
-    - [ProgressBar]()
-    - [Radio]()
-    - [Scroll]()
-    - [Select]()
-    - [Slider]()
+    - [Button](./widgets/controls/button.md)
+      - [Checkbox](./widgets/controls/checkbox.md)
+      - [Radio](./widgets/controls/radio.md)
+      - [Select](./widgets/controls/select.md)
+    - [Canvas](./widgets/controls/canvas.md)
+    - [Color Pickers](./widgets/controls/color-pickers.md)
+    - [Delimiter](./widgets/controls/delimiter.md)
     - [Space](./widgets/controls/space.md)
     - [Switcher]()
     - [Image]()

guide/src/widgets/controls/button.md

@@ -0,0 +1,12 @@
+# Button
+
+The [`Button`][button] widget is an interactive widget that offers an `on_click`
+callback when it is pressed. It has multiple visual styles, allowing it to be
+used as a basis of many button-like widgets. The built-in widgets that utilize a
+`Button` to create a specialized button type are:
+
+- [Checkbox](./checkbox.md)
+- [Radio](./radio.md)
+- [Select](./select.md)
+
+[button]: <{{ docs }}/widgets/button/struct.Button.html>

guide/src/widgets/controls/canvas.md

@@ -0,0 +1,13 @@
+# Canvas
+
+The [`Canvas`][canvas] widget invokes a function each time it needs to paint.
+This function has access to a graphics context exposing most of
+[Kludine][kludgine]'s 2D graphics API.
+
+A [`Tick`][tick] can be attached to the `Canvas` to have a callback invoked at a
+steady rate. This tick function can be used to update the state of the `Canvas`,
+and it can signal when the `Canvas` should be redrawn.
+
+[canvas]: <{{ docs }}/widgets/struct.Canvas.html>
+[tick]: <{{ docs }}/struct.Tick.html>
+[kludgine]: <https://github.com/khonsulabs/kludgine>

guide/src/widgets/controls/checkbox.md

@@ -0,0 +1,14 @@
+# Checkbox
+
+The [`Checkbox`][checkbox] widget is a [`Button`](./button.md) that toggles a
+[`CheckboxState`][checkboxstate] when clicked.
+
+[`CheckboxState`][checkboxstate] contains three variants:
+
+- Indeterminant: A horizontal line will be drawn in the box to show a state of
+  neither checked or unchecked.
+- Checked: A checkbark will be drawn in the box.
+- Unchecked: No indicator will be drawn in the box.
+
+[checkbox]: <{{ docs }}/widgets/checkbox/struct.Checkbox.html>
+[checkboxstate]: <{{ docs }}/widgets/checkbox/struct.CheckboxState.html>

guide/src/widgets/controls/color-pickers.md

@@ -0,0 +1,18 @@
+# Color Pickers
+
+A variety of building blocks are available to offer interfaces selecting colors
+in both RGB and HSL color spaces.
+
+- [`RgbPicker`][rgb]: Shows 3 `ComponentPicker`s for red, green, and blue.
+- [`RgbaPicker`][rgba]: Shows 4 `ComponentPicker`s for red, green, blue, and alpha.
+- [`HslPicker`][hsl]: Shows 3 `ComponentPicker`s for hue, saturation, and lightness.
+- [`HslaPicker`][hsla]: Shows 4 `ComponentPicker`s for hue, saturation, lightness, and alpha.
+- [`ComponentPicker<T>`][component]: Shows a gradient in a bar and allows
+      selecting a single [`ColorComponent`][colorcomponent].
+
+[rgb]: <{{ docs }}/widgets/color/struct.RgbPicker.html>
+[rgba]: <{{ docs }}/widgets/color/struct.RgbaPicker.html>
+[hsl]: <{{ docs }}/widgets/color/struct.HslPicker.html>
+[hsla]: <{{ docs }}/widgets/color/struct.HslaPicker.html>
+[component]: <{{ docs }}/widgets/color/struct.ComponentPicker.html>
+[colorcomponent]: <{{ docs }}/widgets/color/trait.ColorComponent.html>

guide/src/widgets/controls/delimiter.md

@@ -0,0 +1,6 @@
+# Delimiter
+
+The [`Delimiter`][delimiter] widget is used to draw a horizontal or vertical
+delimiter. This widget is similar to HTML's `<hr>` tag.
+
+[delimiter]: <{{ docs }}/widgets/struct.Delimiter.html>

guide/src/widgets/controls/radio.md

@@ -0,0 +1,8 @@
+# Radio
+
+The [`Radio`][radio] widget is a [`Button`](./button.md) that shows a circular
+indicator when a [`Dynamic<T>`][dynamic] contains the radio's associated value.
+When clicked, the `Dynamic<T>` is updated to the radio's associated value.
+
+[radio]: <{{ docs }}/widgets/radio/struct.Radio.html>
+[dynamic]: <{{docs}}/value/struct.Dynamic.html>

guide/src/widgets/controls/select.md

@@ -0,0 +1,9 @@
+# Select
+
+The [`Select`][select] widget is a [`Button`](./button.md) that becomes
+highlighted when a [`Dynamic<T>`][dynamic] contains the select's associated
+value. When clicked, the `Dynamic<T>` is updated to the select's associated
+value.
+
+[select]: <{{ docs }}/widgets/select/struct.Select.html>
+[dynamic]: <{{docs}}/value/struct.Dynamic.html>

guide/src/widgets/layout/list.md

@@ -0,0 +1,13 @@
+# List
+
+The [`List`][list] widget lays a set of [`WidgetList`][children] as a list of
+items with an optional indicator. It creates lists in a similar fashion to
+HTML's `<ol>` and `<ul>` tags.
+
+A [`ListStyle`][liststyle] controls the indicator and whether a [trailing
+delimiter][trailingdelimiter] is shown next to the indicator.
+
+[list]: <{{ docs }}/widgets/list/struct.List.html>
+[children]: <{{ docs }}/widget/struct.WidgetList.html>
+[liststyle]: <{{ docs }}/widgets/list/enum.ListStyle.html>
+[trailingdelimiter]: <{{ docs }}/widgets/list/struct.TrailingDelimiter.html>