fix relative links

This commit is contained in:
lindsaym-fa
2024-06-20 11:10:22 -04:00
parent 7e5fa4e620
commit 16cdfbb11b
17 changed files with 24 additions and 24 deletions

View File

@@ -16,5 +16,5 @@ layout: component
```
:::info
Additional demonstrations can be found in the [breadcrumb examples](/components/breadcrumb).
Additional demonstrations can be found in the [breadcrumb examples](/docs/components/breadcrumb).
:::

View File

@@ -135,7 +135,7 @@ Dropdowns can be placed inside button groups as long as the trigger is an `<wa-b
### Split Buttons
Create a split button using a button and a dropdown. Use a [visually hidden](/components/visually-hidden) label to ensure the dropdown is accessible to users with assistive devices.
Create a split button using a button and a dropdown. Use a [visually hidden](/docs/components/visually-hidden) label to ensure the dropdown is accessible to users with assistive devices.
```html {.example}
<wa-button-group label="Example Button Group">

View File

@@ -40,5 +40,5 @@ layout: component
```
:::info
Additional demonstrations can be found in the [carousel examples](/components/carousel).
Additional demonstrations can be found in the [carousel examples](/docs/components/carousel).
:::

View File

@@ -25,7 +25,7 @@ Copy Buttons display feedback in a tooltip. You can customize the labels using t
### Custom Icons
Use the `copy-icon`, `success-icon`, and `error-icon` slots to customize the icons that get displayed for each state. You can use [`<wa-icon>`](/components/icon) or your own images.
Use the `copy-icon`, `success-icon`, and `error-icon` slots to customize the icons that get displayed for each state. You can use [`<wa-icon>`](/docs/components/icon) or your own images.
```html {.example}
<wa-copy-button value="Copied from a custom button">

View File

@@ -127,7 +127,7 @@ By design, a dialog's height will never exceed that of the viewport. As such, di
### Header Actions
The header shows a functional close button by default. You can use the `header-actions` slot to add additional [icon buttons](/components/icon-button) if needed.
The header shows a functional close button by default. You can use the `header-actions` slot to add additional [icon buttons](/docs/components/icon-button) if needed.
```html {.example}
<wa-dialog label="Dialog" with-header with-footer class="dialog-header-actions">

View File

@@ -54,7 +54,7 @@ Add the `vertical` attribute to draw the divider in a vertical orientation. The
### Menu Dividers
Use dividers in [menus](/components/menu) to visually group menu items.
Use dividers in [menus](/docs/components/menu) to visually group menu items.
```html {.example}
<wa-menu style="max-width: 200px;">

View File

@@ -187,7 +187,7 @@ By design, a drawer's height will never exceed 100% of its container. As such, d
### Header Actions
The header shows a functional close button by default. You can use the `header-actions` slot to add additional [icon buttons](/components/icon-button) if needed.
The header shows a functional close button by default. You can use the `header-actions` slot to add additional [icon buttons](/docs/components/icon-button) if needed.
```html {.example}
<wa-drawer label="Drawer" with-header with-footer class="drawer-header-actions">

View File

@@ -6,7 +6,7 @@ layout: component
Dropdowns consist of a trigger and a panel. By default, activating the trigger will expose the panel and interacting outside of the panel will close it.
Dropdowns are designed to work well with [menus](/components/menu) to provide a list of options the user can select from. However, dropdowns can also be used in lower-level applications (e.g. [color picker](/components/color-picker)). The API gives you complete control over showing, hiding, and positioning the panel.
Dropdowns are designed to work well with [menus](/docs/components/menu) to provide a list of options the user can select from. However, dropdowns can also be used in lower-level applications (e.g. [color picker](/docs/components/color-picker)). The API gives you complete control over showing, hiding, and positioning the panel.
```html {.example}
<wa-dropdown>
@@ -35,7 +35,7 @@ Dropdowns are designed to work well with [menus](/components/menu) to provide a
### Getting the Selected Item
When dropdowns are used with [menus](/components/menu), you can listen for the [`wa-select`](/components/menu#events) event to determine which menu item was selected. The menu item element will be exposed in `event.detail.item`. You can set `value` props to make it easier to identify commands.
When dropdowns are used with [menus](/docs/components/menu), you can listen for the [`wa-select`](/docs/components/menu#events) event to determine which menu item was selected. The menu item element will be exposed in `event.detail.item`. You can set `value` props to make it easier to identify commands.
```html {.example}
<div class="dropdown-selection">
@@ -142,7 +142,7 @@ The offset of the panel along the trigger can be customized using the `skidding`
### Submenus
To create a submenu, nest an `<wa-menu slot="submenu">` element in a [menu item](/components/menu-item).
To create a submenu, nest an `<wa-menu slot="submenu">` element in a [menu item](/docs/components/menu-item).
```html {.example}
<wa-dropdown>

View File

@@ -4,7 +4,7 @@ description: Icons buttons are simple, icon-only buttons that can be used for ac
layout: component
---
For a full list of icons that come bundled with Web Awesome, refer to the [icon component](/components/icon).
For a full list of icons that come bundled with Web Awesome, refer to the [icon component](/docs/components/icon).
```html {.example}
<wa-icon-button name="gear" label="Settings"></wa-icon-button>

View File

@@ -4,7 +4,7 @@ description: Menus provide a list of options for the user to choose from.
layout: component
---
You can use [menu items](/components/menu-item), [menu labels](/components/menu-label), and [dividers](/components/divider) to compose a menu. Menus support keyboard interactions, including type-to-select an option.
You can use [menu items](/docs/components/menu-item), [menu labels](/docs/components/menu-label), and [dividers](/docs/components/divider) to compose a menu. Menus support keyboard interactions, including type-to-select an option.
```html {.example}
<wa-menu style="max-width: 200px;">
@@ -26,7 +26,7 @@ Menus are intended for system menus (dropdown menus, select menus, context menus
### In Dropdowns
Menus work really well when used inside [dropdowns](/components/dropdown).
Menus work really well when used inside [dropdowns](/docs/components/dropdown).
```html {.example}
<wa-dropdown>
@@ -41,7 +41,7 @@ Menus work really well when used inside [dropdowns](/components/dropdown).
### Submenus
To create a submenu, nest an `<wa-menu slot="submenu">` in any [menu item](/components/menu-item).
To create a submenu, nest an `<wa-menu slot="submenu">` in any [menu item](/docs/components/menu-item).
```html {.example}
<wa-menu style="max-width: 200px;">

View File

@@ -9,7 +9,7 @@ This component's name is inspired by [`<popup>`](https://github.com/MicrosoftEdg
Popup doesn't provide any styles — just positioning! The popup's preferred placement, distance, and skidding (offset) can be configured using attributes. An arrow that points to the anchor can be shown and customized to your liking. Additional positioning options are available and described in more detail below.
:::warning
Popup is a low-level utility built specifically for positioning elements. Do not mistake it for a [tooltip](/components/tooltip) or similar because _it does not facilitate an accessible experience!_ Almost every correct usage of `<wa-popup>` will involve building other components. It should rarely, if ever, occur directly in your HTML.
Popup is a low-level utility built specifically for positioning elements. Do not mistake it for a [tooltip](/docs/components/tooltip) or similar because _it does not facilitate an accessible experience!_ Almost every correct usage of `<wa-popup>` will involve building other components. It should rarely, if ever, occur directly in your HTML.
:::
```html {.example}

View File

@@ -4,7 +4,7 @@ description: Radios buttons allow the user to select a single option from a grou
layout: component
---
Radio buttons are designed to be used with [radio groups](/components/radio-group). When a radio button has focus, the arrow keys can be used to change the selected option just like standard radio controls.
Radio buttons are designed to be used with [radio groups](/docs/components/radio-group). When a radio button has focus, the arrow keys can be used to change the selected option just like standard radio controls.
```html {.example}
<wa-radio-group label="Select an option" name="a" value="1">

View File

@@ -28,7 +28,7 @@ Add descriptive help text to a radio group with the `help-text` attribute. For h
### Radio Buttons
[Radio buttons](/components/radio-button) offer an alternate way to display radio controls. In this case, an internal [button group](/components/button-group) is used to group the buttons into a single, cohesive control.
[Radio buttons](/docs/components/radio-button) offer an alternate way to display radio controls. In this case, an internal [button group](/docs/components/button-group) is used to group the buttons into a single, cohesive control.
```html {.example}
<wa-radio-group label="Select an option" help-text="Select an option that makes you proud." name="a" value="1">
@@ -52,7 +52,7 @@ Radios and radio buttons can be disabled by adding the `disabled` attribute to t
### Sizing Options
The size of [Radios](/components/radio) and [Radio Buttons](/components/radio-buttons) will be determined by the Radio Group's `size` attribute.
The size of [Radios](/docs/components/radio) and [Radio Buttons](/docs/components/radio-buttons) will be determined by the Radio Group's `size` attribute.
```html preview
<wa-radio-group label="Select an option" size="medium" value="medium" class="radio-group-size">
@@ -71,7 +71,7 @@ The size of [Radios](/components/radio) and [Radio Buttons](/components/radio-bu
```
:::info
[Radios](/components/radio) and [Radio Buttons](/components/radio-button) also have a `size` attribute. This can be useful in certain compositions, but it will be ignored when used inside of a Radio Group.
[Radios](/docs/components/radio) and [Radio Buttons](/docs/components/radio-button) also have a `size` attribute. This can be useful in certain compositions, but it will be ignored when used inside of a Radio Group.
:::
### Validation

View File

@@ -4,7 +4,7 @@ description: Radios allow the user to select a single option from a group.
layout: component
---
Radios are designed to be used with [radio groups](/components/radio-group).
Radios are designed to be used with [radio groups](/docs/components/radio-group).
```html {.example}
<wa-radio-group label="Select an option" name="a" value="1">
@@ -46,7 +46,7 @@ Use the `disabled` attribute to disable a radio.
## Sizes
Add the `size` attribute to the [Radio Group](/components/radio-group) to change the radios' size.
Add the `size` attribute to the [Radio Group](/docs/components/radio-group) to change the radios' size.
```html {.example}
<wa-radio-group size="small" value="1">

View File

@@ -4,7 +4,7 @@ description: Tab groups organize content into a container that shows one section
layout: component
---
Tab groups make use of [tabs](/components/tab) and [tab panels](/components/tab-panel). Each tab must be slotted into the `nav` slot and its `panel` must refer to a tab panel of the same name.
Tab groups make use of [tabs](/docs/components/tab) and [tab panels](/docs/components/tab-panel). Each tab must be slotted into the `nav` slot and its `panel` must refer to a tab panel of the same name.
```html {.example}
<wa-tab-group>

View File

@@ -19,5 +19,5 @@ layout: component
```
:::info
Additional demonstrations can be found in the [tab group examples](/components/tab-group).
Additional demonstrations can be found in the [tab group examples](/docs/components/tab-group).
:::

View File

@@ -5,5 +5,5 @@ layout: component
---
:::info
Additional demonstrations can be found in the [tab group examples](/components/tab-group).
Additional demonstrations can be found in the [tab group examples](/docs/components/tab-group).
:::