jazzband / django-debug-toolbar

A configurable set of panels that display various debug information about the current request/response.
https://django-debug-toolbar.readthedocs.io/
BSD 3-Clause "New" or "Revised" License
7.97k stars 1.03k forks source link

Checkboxes not all right-aligned #1919

Closed trey closed 1 month ago

trey commented 1 month ago

I just upgraded to version 4.4.1 and noticed (in Firefox, Safari, and Vivaldi) that not all the checkboxes are right-aligned.

Django Debug toolbar screenshot showing some staggered checkboxes on the right side of the panel
matthiask commented 1 month ago

I cannot reproduce this. The right alignment of checkboxes is handled by this: image

Do you see anything strange in the inspector, maybe a global style overriding the toolbar CSS?

trey commented 1 month ago

Yep, that was the issue. Something with https://picocss.com seems to be messing with it.

trey commented 1 month ago

If anybody runs into a similar problem, this makes things look reasonable:

#djDebug {
  input[type='checkbox'] {
    height: 0.75rem;
    width: 0.75rem;
    border-radius: 0.125rem;
  }

  svg.djdt-hidden {
    width: 0.8rem;
    height: 0.8rem;
  }
}