Twitter: outline images with and without alt text

Gives slight visual clue on elements that lasck or do not lack accessible descriptions.

当前为 2021-06-21 提交的版本，查看最新版本。

换行

/* ==UserStyle==
@name           Twitter: outline images with and without alt text
@namespace      myfonj
@version        1.0.0
@description    Gives slight visual clue on elements that lasck or do not lack accessible descriptions.
@author         myfonj
==/UserStyle== */

@-moz-document domain("twitter.com") {
    /* 
    § mark alt-less images
    twitter has nasty habit of using [aria-label] without value
    luckilly, from CSS POW it is same as using [aria-label=""]
    */
    [aria-label=""]:not([role]),
    [aria-label="Image"],
    [aria-label="Embedded video"],
    img:not([alt]),
    img[alt="Image"],
    img[alt=""],
    img[alt="Embedded video"] { outline: 0.3em inset rgba(255,0,0,0.3) !important; outline-offset: -.5em}

    
    [aria-label][data-testid*="photo"i]:not([aria-label=""]):not([aria-label="Image"]):not([aria-label="Embedded video"]),
    [aria-label][data-testid*="preview"i]:not([aria-label=""]):not([aria-label="Image"]):not([aria-label="Embedded video"]) [aria-label],
    img[alt]:not([alt=""]):not([alt="Image"]):not([alt="Embedded video"])
    { outline: 0.3em inset rgba(0,255,0,0.3) !important; outline-offset: -.5em}
    
    

    
    /*
    *all* avatars have void aria-labels
    */
    [style="padding-bottom: 100%;"] + div > div[aria-label=""] {
        outline: none !important;
    }

}

欢迎访问Greasy Fork镜像