Skip to content

WAI-ARIAを使用している要素 by mlca11y

Write a review Install Get Stylus

Details

Authormlca11y

LicenseNo License

Categoryglobal

Created

Updated

Size2.3 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

WAI-ARIAを使用している要素を強調して表示します。

Notes

使い方

  1. ページのスタイルを無効にします
  2. 本ユーザースタイルを有効化します
  3. 本ユーザースタイルによる強調表示内容を目視で確認します

制限事項

  • ページやコンテンツによっては表示が崩れる場合があります
  • 強調表示される要素・属性がすべて問題となるわけではありません
  • 複数のルールに該当する要素では表示される内容が制限されます
    • たとえばscope属性とlang属性がth要素に指定されている場合はscope属性のみが強調表示されます

Source code

/* ==UserStyle==
@name           WAI-ARIAを使用している要素
@namespace      mlca11y
@version        1.0.0
@description    WAI-ARIAを使用している要素を強調して表示します。
@author         mlca11y
==/UserStyle== */
@-moz-document url-prefix("http:"), url-prefix("https:"), url-prefix("file:") {
    :root {
        --outline-font: "Consolas", monospace;
        --outline-color-normal: hsl(60, 75%, 33%);
        --outline-color-01: hsl(0, 75%, 33%);
        --outline-color-02: hsl(120, 75%, 33%);
        --outline-color-03: hsl(180, 75%, 33%);
        --outline-color-04: hsl(240, 75%, 33%);
        --outline-color-05: hsl(300, 75%, 33%);
        --outline-width-error: 7px;
        --outline-width-warning: 5px;
        --outline-width-info: 3px;
        --outline-width-normal: 1px;
        --outline-style-usecss: dashed;
        --outline-style-aria: dotted;
        --outline-style-normal: solid;
    }
    /* WAI-ARIAを使用している要素 */
    /* ARIA attributes */
    [aria-activedescendant],
    [aria-atomic],
    [aria-autocomplete],
    [aria-busy],
    [aria-checked],
    [aria-colcount],
    [aria-colindex],
    [aria-colspan],
    [aria-controls],
    [aria-current],
    [aria-describedby],
    [aria-details],
    [aria-disabled],
    [aria-dropeffect],
    [aria-errormessage],
    [aria-expanded],
    [aria-flowto],
    [aria-grabbed],
    [aria-haspopup],
    [aria-hidden],
    [aria-invalid],
    [aria-keyshortcuts],
    [aria-label],
    [aria-labelledby],
    [aria-level],
    [aria-live],
    [aria-modal],
    [aria-multiline],
    [aria-multiselectable],
    [aria-orientation],
    [aria-owns],
    [aria-placeholder],
    [aria-posinset],
    [aria-pressed],
    [aria-readonly],
    [aria-relevant],
    [aria-required],
    [aria-roledescription],
    [aria-rowcount],
    [aria-rowindex],
    [aria-rowspan],
    [aria-selected],
    [aria-setsize],
    [aria-sort],
    [aria-valuemax],
    [aria-valuemin],
    [aria-valuenow],
    [aria-valuetext],
    [role] {
        outline-color: var(--outline-color-normal);
        outline-width: var(--outline-width-error) !important;
        outline-style: var(--outline-style-aria) !important;
        outline-offset: -2px !important;
    }
}

Reviews

No reviews yet.