Add the hidden-means-hidden round to the release
This commit is contained in:
@@ -318,6 +318,20 @@ button,
|
|||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* `hidden` means hidden.
|
||||||
|
|
||||||
|
The attribute only carries `display: none` from the browser's own stylesheet, which
|
||||||
|
is the weakest rule there is: any class that sets a display — and every button here
|
||||||
|
sets `inline-flex` — beats it. That is not a hypothetical. Seven overlays in this
|
||||||
|
file already carry their own `[hidden] { display: none }` because each one was found
|
||||||
|
the hard way, and the eighth was a button that shipped as a 21x44 empty box under the
|
||||||
|
bank check on every table that didn't need it.
|
||||||
|
|
||||||
|
One rule, for everything, so there is no ninth. */
|
||||||
|
[hidden] {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* ---------- Poker table ---------- */
|
/* ---------- Poker table ---------- */
|
||||||
|
|
||||||
#pokerTableWrap {
|
#pokerTableWrap {
|
||||||
@@ -2338,6 +2352,9 @@ body.hasActionBar #holdemSidebar {
|
|||||||
.waitingAdd .holdemBtn {
|
.waitingAdd .holdemBtn {
|
||||||
flex: none;
|
flex: none;
|
||||||
min-height: 44px;
|
min-height: 44px;
|
||||||
|
/* "Add" is three letters, which came out 43px wide — one pixel under the rule, and
|
||||||
|
the audit called it. A thumb doesn't know the word is short. */
|
||||||
|
min-width: 56px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.waitingList {
|
.waitingList {
|
||||||
|
|||||||
@@ -719,6 +719,26 @@ const LayoutAudit = {
|
|||||||
return { name: "the felt shows one dealer button", offenders };
|
return { name: "the felt shows one dealer button", offenders };
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// Anything that says it is hidden and is drawn anyway.
|
||||||
|
//
|
||||||
|
// `hidden` gets its `display: none` from the browser's own stylesheet, the weakest
|
||||||
|
// rule in the cascade, so any class that sets a display beats it — and in this tool
|
||||||
|
// every button class does. The result is an element the code believes is gone,
|
||||||
|
// sitting on the screen: found as a 21x44 empty box under the bank check, and this
|
||||||
|
// file's own touch check had been calling it "could not be probed" rather than
|
||||||
|
// saying the plainer thing, which is that it should not be there at all.
|
||||||
|
hiddenButPainted() {
|
||||||
|
const offenders = [...document.querySelectorAll("[hidden]")]
|
||||||
|
.filter(el => {
|
||||||
|
const rect = el.getBoundingClientRect();
|
||||||
|
if (rect.width === 0 || rect.height === 0) return false;
|
||||||
|
const style = getComputedStyle(el);
|
||||||
|
return style.display !== "none" && style.visibility !== "hidden";
|
||||||
|
})
|
||||||
|
.map(el => `${this.describe(el)} :: hidden, but drawn ${Math.round(el.getBoundingClientRect().width)}x${Math.round(el.getBoundingClientRect().height)}`);
|
||||||
|
return { name: "hidden means hidden", offenders };
|
||||||
|
},
|
||||||
|
|
||||||
// ---- Runner ----
|
// ---- Runner ----
|
||||||
|
|
||||||
// Every check this file knows how to make, every time.
|
// Every check this file knows how to make, every time.
|
||||||
@@ -747,6 +767,7 @@ const LayoutAudit = {
|
|||||||
this.fieldFontSize(),
|
this.fieldFontSize(),
|
||||||
this.seatOwnership(),
|
this.seatOwnership(),
|
||||||
this.oneDealerButton(),
|
this.oneDealerButton(),
|
||||||
|
this.hiddenButPainted(),
|
||||||
this.contrast(options.contrast),
|
this.contrast(options.contrast),
|
||||||
this.touchTargets(options.minimumTarget, options.touchTargets),
|
this.touchTargets(options.minimumTarget, options.touchTargets),
|
||||||
];
|
];
|
||||||
|
|||||||
Reference in New Issue
Block a user