The reference guide's footer scrolls the page sideways at desktop width

Abierto Apto para principiantes
  • ¿Algo no está bien?
#1,938 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
76/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
css, html
Área
documentation, frontend

Línea de trabajo

Lee wicket.css alrededor de la línea 209 (la media query de 768 px en adelante que aplica margin-left: var(--toc-w) a #header, #content, #footnotes, #footer) y alrededor de la línea 388, donde #footer recibe max-width: none. Compila wicket-user-guide con -Pguide y luego, en Chromium a 1280 px, confirma que document.documentElement.scrollWidth supera el ancho de la ventana en --toc-w antes de cambiar nada. Añade una regla width: auto para body.toc2 > #footer dentro de esa misma media query y vuelve a compilar. Terminado cuando scrollWidth sea igual al ancho de la ventana a 1280 px y el fondo de tela del footer siga abarcando desde la tabla de contenidos hasta el borde derecho; el mismo cambio pasa luego a wicket-11.x.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

From 768 px up, the reference guide scrolls sideways by the width of the table of contents. At 1280 px the page is 1584 px wide, 304 px wider than the window, and the whole extra width belongs to the footer.

Cause

The Asciidoctor default stylesheet gives #header, #content, #footnotes, #footer a width: 100%. wicket.css then shifts the four of them right with margin-left: var(--toc-w) (line 209) to make room for the table of contents. #header, #content and #footnotes keep a max-width and get margin-right: auto, so they still fit. #footer has max-width: none (line 388), so it stays as wide as the window, starts --toc-w further right, and sticks out past the right edge.

Seen in Chromium on a build of wicket-user-guide with -Pguide. It is on master since #1845, and on wicket-11.x since #1937, which brought the same stylesheet over unchanged.

Not covered by #1903

#1903 fixes the 18 px sideways scroll at phone width (#1891). That is a different overflow. #1903 does not touch #footer, and below 768 px the footer has no margin, so it does not overflow there.

Fix

Let the footer take only the width the table of contents leaves, for example width: auto on body.toc2 > #footer in the same media query. It can then still run to the right edge on the cloth background. The fix goes on master first and is cherry-picked to wicket-11.x.

Done when

  • At 1280 px, document.documentElement.scrollWidth equals the window width.
  • The footer's cloth background still runs from the edge of the table of contents to the right edge of the window.
Lenguaje dominante
Java
Estrellas
800
Forks
423
Merge medio
1 d 1 h
PR fusionados (30 d)
170

Preparar el entorno

Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

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 apache/wicket

Todos los issues de apache/wicket

Issues similares

Más issues de Java

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.