Skip to content

Fix a11y: improve sitemap link color contrast to meet WCAG AA * Fix a11y: improve sitemap link color contrast to meet WCAG AA * Address review comments: trying to some combination of colors, that would fit better. Not just having the headlines and links the same color. (#363) #364

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Abdelaziz18003 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Fix a11y: improve sitemap link color contrast to meet WCAG AA * Fix a11y: improve sitemap link color contrast to meet WCAG AA * Address review comments: trying to some combination of colors, that would fit better. Not just having the headlines and links the same color. (#363) #364

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
85e120a
docs(render-function): Described using in `<template>` (#3342)
ZacharyBear Feb 10, 2026
17e0bc6
Fix a11y: improve sitemap link color contrast to meet WCAG AA (#3327)
huangkevin-apr Feb 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion .vitepress/theme/components/SiteMap.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@ const items = nav

#sitemap .vt-link {
font-size: 0.9em;
color: var(--vt-c-text-2);
/* increased contrast for better legibility (WCAG 1.4.3) */
color: var(--vt-c-text-1);
opacity: 0.75;
}
</style>
27 changes: 27 additions & 0 deletions src/guide/extras/render-function.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -215,6 +215,33 @@ function render() {
}
```

### Using Vnodes in `<template>`

```vue
<script setup>
import { h } from 'vue'

const vnode = h('button', ['Hello'])
</script>

<template>
<!-- Via <component /> -->
<component :is="vnode">Hi</component>

<!-- Or directly as element -->
<vnode />
<vnode>Hi</vnode>
</template>
```

A vnode object has been declared in `setup()`, you can use it like a normal component for rendering.

:::warning
A vnode represents an already created render output, not a component definition. Using a vnode in `<template>` does not create a new component instance, and the vnode will be rendered as-is.

This pattern should be used with care and is not a replacement for normal components.
:::

## JSX / TSX {#jsx-tsx}

[JSX](https://facebook.github.io/jsx/) هو امتداد شبيه بـ XML لـ JavaScript يسمح لنا بكتابة شيفرة مثل هذه:
Expand Down