Page MenuHomePhorge

Incorrectly cropped box-shadow CSS around a.button:focus
Open, Needs TriagePublic


Steps to reproduce and actual outcome:

  1. Firefox 116.0
  2. Don't be a member of the "Blessed Committers" project in
  3. Go to
  4. Click on the Manage button
  5. Close the popup with Esc
  6. Move the mouse pointer away from the button

Screenshot from 2023-08-03 14-15-52.png (108×303 px, 4 KB)


  1. Go to
  2. Click on the Configure Form v button

Screenshot from 2023-08-03 14-20-48.png (125×343 px, 5 KB)

Expected outcome:
If that "glowing" effect is really needed, it should be shown on all four sides of a button, instead of three sides only.
Or just remove that effect completely?

Additional information:

Defined in webroot/rsrc/css/phui/button/phui-button.css via

a.button:focus {
  outline: 0;
  box-shadow: 0 0 2pt 2pt rgba(82, 168, 236, 0.7);

On this problem gets fixed by removing margin-top: 0 from

.phui-box-white-config .phui-header-action-links .button {
  margin-top: 0;
  margin-bottom: 0;

On it's more complicated.

Event Timeline

aklapper renamed this task from Incorrectly cropped "glow effect" CSS around some UI buttons to Incorrectly cropped box-shadow CSS around a.button:focus.Mar 1 2024, 13:39
aklapper updated the task description. (Show Details)