Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

[6.x]: Checkmark in an enabled lightswitch looks slightly up and to the left of center (minor, cosmetic)

Abierto
  • ¿Algo no está bien?
#20,102 4 comentarios 0 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 1 día

@brianjhanson ya está trabajando en esto.

Desde el 26/10/2026.

Evaluación

Este issue todavía no se ha evaluado.

Descripción

bug repo:cms
What happened?

Description

Very minor cosmetic issue. The checkmark inside the thumb of an enabled lightswitch is centered by its bounding box. A check carries its visual weight in the long upper-right stroke, so it looks about half a pixel too far up and to the left.

Spotting this "flaw" is borderline OCD on my part, but, as the saying goes, "once you see it..."

Steps to reproduce

  1. Open any screen with a lightswitch, e.g. an entry edit page.
  2. Turn a lightswitch on.
  3. Look closely at the checkmark in the thumb. It is easiest to see zoomed in, on the small and default sizes.

Expected behavior

The checkmark looks centered in the thumb.

Actual behavior

The mark sits at the geometric center of the thumb, but looks slightly high and to the left.

Before / after screenshots:

Image Image

Suggested nudge

--_checkmark-offset in the checked :after rule of craft-switch-button centers the mark's bounding box:

(var(--c-switch-thumb-height) - var(--_checkmark-size)) / 2 - 1px

Adding a small optical correction to that value fixes it by eye:

(var(--c-switch-thumb-height) - var(--_checkmark-size)) / 2 - 1px + 0.04em

Both inset-block-start and inset-inline-start read the same property, so the mark moves right and down together, and RTL follows inset-inline-start with no extra rule.

0.04em is about 0.55px at 14px text. I used em because a share of the mark's size gave small switches a sub-pixel shift that was invisible. The optical error comes from the shape of the check, so it is about the same on both switch sizes.

Version: craftcms/cms 6.x-dev @ 16a41b5e99, Chrome. Checked on the small and default switch sizes. Not checked in RTL or in Firefox/Safari.

Craft CMS version

6.x-dev @ 16a41b5e99

PHP version

No response

Operating system and version

No response

Database type and version

No response

Image driver and version

No response

Installed plugins and versions
Lenguaje dominante
PHP
Estrellas
3.6k
Forks
710
Merge medio
11 h 15 min
PR fusionados (30 d)
277

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de craftcms/cms

Todos los issues de craftcms/cms

Issues similares

Más issues de PHP

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.