w3c / aria

Accessible Rich Internet Applications (WAI-ARIA)
https://w3c.github.io/aria/
Other
638 stars 123 forks source link

remove spec specific css or inline it #2226

Open jnurthen opened 3 months ago

jnurthen commented 3 months ago

Rules used in aria

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }
.role-parent ul,
.role-base ul,
.role-children ul,
.role-related ul,
.role-scope ul,
.role-mustcontain ul,
.role-required-properties ul,
.role-properties ul,
.role-inherited ul,
.role-disallowed ul,
.role-namefrom ul,
.state-value ul, .state-related ul,
.state-applicability ul,
.state-descendants ul,
.property-value ul,
.property-related ul,
.property-applicability ul,
.property-descendants ul,
.quickref-required ul,
.quickref-supported ul {
    margin:0;
    padding:0;
    list-style-type:none;
}
table{
    border:solid 2px #999;
    border-width:1px 0 0 1px;
    margin:0.1em 0 1em;
    padding:0;
    border-spacing:0;
    border-collapse:collapse;
}
th, td{
    border:solid 2px #999;
    border-width:0 1px 1px 0;
    padding:0.15em 0.3em 0.1em;
    vertical-align:top;
    text-align:left;
}
th{
    background-color:#eee;
}
caption{
    text-align:left;
    color:#555;
    font-style:normal;
    margin:1em 0 0.1em;
    padding:0 0 0 0.3em;
}
table.role-features th, table.role-features td, table.state-features th, table.state-features td, table.property-features th, table.property-features td, table.value-descriptions th, table.value-descriptions td {
    min-width:20em;
}
table.role-features tbody th, table.state-features tbody th, table.property-features tbody th, table.value-descriptions tbody th {
    text-align: left !important;
}
th+th, td+td{
    width:auto;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
    /* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
    /* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
    font-family: "Monaco", "Courier New", "Courier", monospace;
    font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
    font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
    border: solid 1px #999;
    background-color: #fcfcfc;
    margin:1em 0;
    padding:0.5em 0.8em;
    font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
    line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
    color:#006400;
    text-decoration:none;
    font-style:italic;
}
a.termref:visited {
    color:inherit;
}
.note {
    color:#444;
    border:solid 1px #ccc;
    margin:1em 0;
    padding:1em 2em;
}
.image {
    text-align: center;
}
.img-caption {
    font-weight: bold;
}
dl.compact dt {
    font-weight:normal;
}
.rfc2119 {
    font-weight: bold;
    text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}
jnurthen commented 3 months ago

Rules used in core-aam (core.css)

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }
table{
    border:solid 2px #999;
    border-width:1px 0 0 1px;
    margin:0.1em 0 1em;
    padding:0;
    border-spacing:0;
    border-collapse:collapse;
}
th, td{
    border:solid 2px #999;
    border-width:0 1px 1px 0;
    padding:0.15em 0.3em 0.1em;
    vertical-align:top;
    text-align:left;
}
th{
    background-color:#eee;
}
caption{
    text-align:left;
    color:#555;
    font-style:normal;
    margin:1em 0 0.1em;
    padding:0 0 0 0.3em;
}
th+th, td+td{
    width:auto;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
    /* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
    /* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
    font-family: "Monaco", "Courier New", "Courier", monospace;
    font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
    font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
    border: solid 1px #999;
    background-color: #fcfcfc;
    margin:1em 0;
    padding:0.5em 0.8em;
    font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
    line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
    color:#006400;
    text-decoration:none;
    font-style:italic;
}
a.termref:visited {
    color:inherit;
}
.note {
    color:#444;
    border:solid 1px #ccc;
    margin:1em 0;
    padding:1em 2em;
}
.rfc2119 {
    font-weight: bold;
    text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}

mapping-tables.css

caption {
    text-align:left;
    font-size: 120%;
    font-weight:bold;
    margin-bottom: 0.25em;
}
table {
    width:100%;
    border-collapse: collapse;
    border: 1px solid #630;
}
th, td {
    text-align: left;
    vertical-align: top;
    padding: 0.3em;
    border-collapse: collapse;
    border: 1px solid #630;
}
th code, td code {font-size: 123%;}
details, summary {display: block;}
details {border-bottom: 1px solid #ccc; padding: 0.5em;}
summary {padding: 0.25em;background: #fff url(../img/rightArrow.png) no-repeat 0.5em center; padding: 0.25em 0.25em 0.25em 2em;}
summary::-webkit-details-marker {display: none;}
.open summary, details[open] summary {background-color: #f5f5f5; background-image: url(../img/downArrow.png);}
summary .el-context {display: inline;}
summary:hover, summary:focus, details[open] summary:hover, details[open] summary:focus {background-color: #eee;}

core-aam.css


ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }

table{
    border:solid 2px #999;
    border-width:1px 0 0 1px;
    margin:0.1em 0 1em;
    padding:0;
    border-spacing:0;
    border-collapse:collapse;
}
th, td{
    border:solid 2px #999;
    border-width:0 1px 1px 0;
    padding:0.15em 0.3em 0.1em;
    /*min-width:20em;*/
    vertical-align:top;
    text-align:left;
}
th+th, td+td{
    width:auto;
}
th{
    background-color:#eee;
}
caption{
    text-align:left;
    color:#555;
    font-style:normal;
    margin:1em 0 0.1em;
    padding:0 0 0 0.3em;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
    /* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
    /* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
    font-family: "Monaco", "Courier New", "Courier", monospace;
    font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
    font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
    border: solid 1px #999;
    background-color: #fcfcfc;
    margin:1em 0;
    padding:0.5em 0.8em;
    font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
}
.role-reference, .state-reference, .property-reference, .widget-reference, .design-pattern-reference {}
.termref, a.termref:link {
    color:#006400;
    text-decoration:none;
    font-style:italic;
}
a.termref:visited {
    color:inherit;
}
.note {
    color:#444;
    border:solid 1px #ccc;
    margin:1em 0;
    padding:1em 2em;
}
.rfc2119 {
    font-weight: bold;
    text-transform: uppercase;
}
.section {}
jnurthen commented 3 months ago

Rules used in accname


ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }

table{
    border:solid 2px #999;
    border-width:1px 0 0 1px;
    margin:0.1em 0 1em;
    padding:0;
    border-spacing:0;
    border-collapse:collapse;
}
th, td{
    border:solid 2px #999;
    border-width:0 1px 1px 0;
    padding:0.15em 0.3em 0.1em;
    vertical-align:top;
    text-align:left;
}
th{
    background-color:#eee;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
    /* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
    /* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
    font-family: "Monaco", "Courier New", "Courier", monospace;
    font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
    font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
    border: solid 1px #999;
    background-color: #fcfcfc;
    margin:1em 0;
    padding:0.5em 0.8em;
    font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
    line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
    color:#006400;
    text-decoration:none;
    font-style:italic;
}
a.termref:visited {
    color:inherit;
}
.note {
    color:#444;
    border:solid 1px #ccc;
    margin:1em 0;
    padding:1em 2em;
}
.rfc2119 {
    font-weight: bold;
    text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}