mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-10-12 10:17:31 +09:00
Issue #1970 - Part 1: Remove unused moz-focus-outer code for buttons.
This commit is contained in:
parent
e3aa3c2963
commit
8de47d99c4
6 changed files with 8 additions and 149 deletions
|
|
@ -37,16 +37,5 @@
|
|||
<button class="mfi7"><div>mfi7</div></button>
|
||||
<button class="mfi8"><div>mfi8</div></button>
|
||||
<br>
|
||||
|
||||
<button class="mfo1">mfo1</button>
|
||||
<button class="mfo2">mfo2</button>
|
||||
<button class="mfo3">mfo3</button>
|
||||
<button class="mfo4">mfo4</button>
|
||||
<br>
|
||||
<button class="mfo5">mfo5</button>
|
||||
<button class="mfo6">mfo6</button>
|
||||
<button class="mfo7">mfo7</button>
|
||||
<button class="mfo8">mfo8</button>
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
<!-- Any copyright is dedicated to the Public Domain.
|
||||
- http://creativecommons.org/publicdomain/zero/1.0/ -->
|
||||
<html>
|
||||
<!-- The ::-moz-focus-inner & ::-moz-focus-outer button pseudo-elements only
|
||||
support CSS "margin" values that contain absolute lengths. Any percent or
|
||||
<!-- The ::-moz-focus-inner button pseudo-element only supports
|
||||
CSS "margin" values that contain absolute lengths. Any percent or
|
||||
"auto" margin values will simply make the margin collapse to zero.
|
||||
This test verifies that this is indeed what happens (not anything worse).
|
||||
-->
|
||||
|
|
@ -22,18 +22,6 @@
|
|||
button.mfi6::-moz-focus-inner { margin: 10px auto; }
|
||||
button.mfi7::-moz-focus-inner { margin: 10px; }
|
||||
button.mfi8::-moz-focus-inner { margin: 2em; }
|
||||
|
||||
/* Testing percent and auto margin values on "-moz-focus-outer":
|
||||
(just for completeness -- really, 'margin' has no effect on
|
||||
the behavior of -moz-focus-outer) */
|
||||
button.mfo1::-moz-focus-outer { margin: 50%; }
|
||||
button.mfo2::-moz-focus-outer { margin: 50% 10px; }
|
||||
button.mfo3::-moz-focus-outer { margin: 10px 50%; }
|
||||
button.mfo4::-moz-focus-outer { margin: auto; }
|
||||
button.mfo5::-moz-focus-outer { margin: auto 10px; }
|
||||
button.mfo6::-moz-focus-outer { margin: 10px auto; }
|
||||
button.mfo7::-moz-focus-outer { margin: 10px; }
|
||||
button.mfo8::-moz-focus-outer { margin: 2em; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -47,16 +35,5 @@
|
|||
<button class="mfi7">mfi7</button>
|
||||
<button class="mfi8">mfi8</button>
|
||||
<br>
|
||||
|
||||
<button class="mfo1">mfo1</button>
|
||||
<button class="mfo2">mfo2</button>
|
||||
<button class="mfo3">mfo3</button>
|
||||
<button class="mfo4">mfo4</button>
|
||||
<br>
|
||||
<button class="mfo5">mfo5</button>
|
||||
<button class="mfo6">mfo6</button>
|
||||
<button class="mfo7">mfo7</button>
|
||||
<button class="mfo8">mfo8</button>
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -24,24 +24,6 @@
|
|||
version of padding values that we actually expect to take effect: */
|
||||
button.mfi4 > div { padding: 10px; }
|
||||
button.mfi5 > div { padding: 2em; }
|
||||
|
||||
/* As above, set padding to 0 for all cases: */
|
||||
button.mfo1::-moz-focus-outer,
|
||||
button.mfo2::-moz-focus-outer,
|
||||
button.mfo3::-moz-focus-outer,
|
||||
button.mfo4::-moz-focus-outer,
|
||||
button.mfo5::-moz-focus-outer { padding: 0; }
|
||||
|
||||
/* To make reference for -moz-focus-outer padding that we expect to
|
||||
take effect, we'll put the padding on a wrapper-div (and bump the
|
||||
button's outline to that div). */
|
||||
div.mfo4-wrapper { padding: 10px; }
|
||||
div.mfo5-wrapper { padding: 20px; /* = 2em * 10px/em */ }
|
||||
|
||||
button.mfo4,
|
||||
button.mfo5 { outline: none; }
|
||||
div.mfo4-wrapper,
|
||||
div.mfo5-wrapper { display: inline-block; outline: 1px solid black; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -52,17 +34,5 @@
|
|||
<button class="mfi4"><div>mfi4</div></button>
|
||||
<button class="mfi5"><div>mfi5</div></button>
|
||||
<br>
|
||||
|
||||
<button class="mfo1">mfo1</button>
|
||||
<button class="mfo2">mfo2</button>
|
||||
<button class="mfo3">mfo3</button>
|
||||
<br>
|
||||
<div class="mfo4-wrapper">
|
||||
<button class="mfo4">mfo4</button>
|
||||
</div>
|
||||
<div class="mfo5-wrapper">
|
||||
<button class="mfo5">mfo5</button>
|
||||
</div>
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
<!-- Any copyright is dedicated to the Public Domain.
|
||||
- http://creativecommons.org/publicdomain/zero/1.0/ -->
|
||||
<html>
|
||||
<!-- The ::-moz-focus-inner & ::-moz-focus-outer button pseudo-elements only
|
||||
support CSS "padding" values that contain absolute lengths. Any percent
|
||||
<!-- The ::-moz-focus-inner button pseudo-element only supports
|
||||
CSS "padding" values that contain absolute lengths. Any percent
|
||||
padding values will simply make the padding collapse to zero.
|
||||
This test verifies that this is indeed what happens (not anything worse).
|
||||
-->
|
||||
|
|
@ -22,13 +22,6 @@
|
|||
button.mfi3::-moz-focus-inner { padding: 10px 50%; }
|
||||
button.mfi4::-moz-focus-inner { padding: 10px; }
|
||||
button.mfi5::-moz-focus-inner { padding: 2em; }
|
||||
|
||||
/* Testing percent and auto padding values on "-moz-focus-outer": */
|
||||
button.mfo1::-moz-focus-outer { padding: 50%; }
|
||||
button.mfo2::-moz-focus-outer { padding: 50% 10px; }
|
||||
button.mfo3::-moz-focus-outer { padding: 10px 50%; }
|
||||
button.mfo4::-moz-focus-outer { padding: 10px; }
|
||||
button.mfo5::-moz-focus-outer { padding: 2em; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -39,13 +32,5 @@
|
|||
<button class="mfi4">mfi4</button>
|
||||
<button class="mfi5">mfi5</button>
|
||||
<br>
|
||||
|
||||
<button class="mfo1">mfo1</button>
|
||||
<button class="mfo2">mfo2</button>
|
||||
<button class="mfo3">mfo3</button>
|
||||
<br>
|
||||
<button class="mfo4">mfo4</button>
|
||||
<button class="mfo5">mfo5</button>
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue