Corrige local do menu superior esquerdo by robertatakenaka · Pull Request #1074 · scieloorg/packtools

robertatakenaka · 2026-01-29T20:06:04Z

Título: Padronização da estrutura e identificação de `articleSection`

Descrição

Este PR realiza uma refatoração profunda na forma como as seções do artigo são identificadas e estruturadas no HTML gerado. O foco principal foi eliminar a dispersão da lógica de criação da classe .articleSection e seus atributos associados (data-anchor e IDs de âncora).

🎯 O Problema

Anteriormente, cada arquivo XSL (abstract, history, references, etc.) implementava sua própria lógica para:

Gerar o nome da seção.
Criar o ID da âncora via translate().
Aplicar as classes de estilo.
Isso causava inconsistências em nomes de classes (ex: algumas seções usavam espaços, outras hifens) e dificultava a manutenção do menu de navegação lateral.

🛠 A Solução: Template `article-section-header`

Foi criado um template centralizado em generic.xsl que atua como a "fonte da verdade" para qualquer seção do artigo:

<xsl:template name="article-section-header">
    <xsl:param name="title"/>
    <xsl:variable name="title_lowercase" select="translate($title,'ABCDEFGHIJKLMNOPQRSTUVWXYZ ', 'abcdefghijklmnopqrstuvwxyz-')"/>
    <xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>
    <xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>
    ...
</xsl:template>

Mudanças Implementadas:

Consistência de Seletores: Todas as seções agora recebem automaticamente a classe base .articleSection e uma classe específica normalizada (ex: .articleSection--publication-dates).
Normalização de IDs: Implementada a conversão sistemática de caracteres maiúsculos para minúsculos e substituição de espaços por hifens para garantir URLs de âncora válidas e previsíveis.
Remoção de Redundância: Eliminados blocos repetitivos de código em:
article-meta-abstract.xsl
article-text-ref.xsl
article-text-section-data-availability.xsl
generic-history.xsl
generic-pub-date.xsl
Ajuste de Hierarquia: Em arquivos como article.xsl, a estrutura de grid foi ajustada para que o elemento <article> contenha as articleSection de forma limpa, sem conflitos com as classes de grid do Bootstrap.

Benefícios

Navegação: O menu lateral (JS) agora encontra as âncoras de forma muito mais confiável através do atributo data-anchor padronizado.
CSS: Facilita a estilização de seções específicas via CSS utilizando o sufixo --nome-da-secao.
SEO/Acessibilidade: IDs de âncora mais limpos e sem caracteres especiais.

…lity

…ates

Copilot

Pull request overview

This PR refactors how article section headers are generated and updates layout/CSS for the article view to adjust the location/layout of the left (upper) menu and related UI elements.

Changes:

Introduces a reusable article-section-header XSL template and replaces several hardcoded <div class="articleSection" ...> + <h2> blocks with calls to this template.
Updates the article layout grid in article.xsl (wrapping the navigation and article content in a Bootstrap row/columns) and adds a small CSS rule to stabilize scrollbars in modal dialogs.
Adjusts article.css to slightly change article-level styling (e.g., .article footer spacing, .article .xref theme colors, removal of some background declarations).

Reviewed changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
`packtools/catalogs/htmlgenerator/v3.0/static/css/article.css`	Minified CSS updated to tweak article layout and colors (e.g., `.article footer`, `.article .xref`) to align with the new structure/menu positioning.
`packtools/catalogs/htmlgenerator/v3.0/generic.xsl`	Adds `article-section-header` named template intended to centralize the generation of article section wrappers and headers.
`packtools/catalogs/htmlgenerator/v3.0/generic-pub-date.xsl`	Refactors publication dates section to compute a translated title and delegate header rendering to `article-section-header`.
`packtools/catalogs/htmlgenerator/v3.0/generic-history.xsl`	Similar refactor for the history section: computes a translated title and calls `article-section-header`.
`packtools/catalogs/htmlgenerator/v3.0/article.xsl`	Restructures the article navigation and content into a responsive Bootstrap row/columns and injects inline CSS to control `.modal-dialog-scrollable .modal-body` scrolling behavior. Removes grid classes from `<article id="articleText">`.
`packtools/catalogs/htmlgenerator/v3.0/article-text-section-data-availability.xsl`	Uses `article-section-header` to render the “Data availability” section header instead of hand-built markup.
`packtools/catalogs/htmlgenerator/v3.0/article-text-ref.xsl`	Uses `article-section-header` to render the references section header for `ref-list`.
`packtools/catalogs/htmlgenerator/v3.0/article-meta-abstract.xsl`	Refactors the abstract title/anchor generation to call `article-section-header` in multiple abstract-related templates, replacing inlined `class="articleSection"`/`data-anchor` + `<h2>` generation.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-01-29T20:12:53Z

+        <xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>
+        <xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>
+        <a name="{$anchor-id}"></a>
+        <h2 class="h5"><xsl:value-of select="$title"/></h2>


The article-section-header template uses <xsl:attribute> to set class and data-anchor, but it is being called from contexts where there is no open start tag for a literal or xsl:element (e.g., article-meta-abstract.xsl:create-anchor-and-title-for-abstracts-without-title, generic-pub-date.xsl and generic-history.xsl inside a <div>’s content). In XSLT 1.0 this is not allowed and will raise a runtime error (“xsl:attribute is not allowed in this position”), and even where it doesn’t error the attributes will not be attached to the intended <div>, so sections will lose their articleSection/data-anchor pairing that the left menu logic depends on. This template should instead construct the full wrapper element itself (including class/data-anchor and the <h2>/anchor), or be refactored so that it is only ever called while the target element’s start tag is still open, avoiding xsl:attribute in result-tree-only contexts.

Suggested change

<xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>

<xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>

<a name="{$anchor-id}"></a>

<h2 class="h5"><xsl:value-of select="$title"/></h2>

<div class="articleSection articleSection--{$title_lowercase}" data-anchor="{$title}">

<a name="{$anchor-id}"/>

<h2 class="h5"><xsl:value-of select="$title"/></h2>

</div>

Copilot · 2026-01-29T20:12:53Z

+        <xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>
+        <xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>


The data-anchor attribute here is populated directly from the $title value and later consumed by the client-side navigation script, which builds the left menu by concatenating data-anchor into HTML strings and inserting them via innerHTML. Because $title can originate from article content or translation files, an attacker who controls those values could inject HTML (e.g., <img onerror=...>) that will be executed as DOM XSS when the menu is built. To mitigate this, ensure that data-anchor is constrained/encoded to a safe character set before emitting it, or update the JavaScript menu builder to treat the value as plain text (e.g., via textContent/innerText or equivalent API) instead of inserting it as raw HTML.

Suggested change

<xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>

<xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>

<xsl:variable name="data_anchor_safe" select="translate($title, '<>"'&', '-----_')"/>

<xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>

<xsl:attribute name="data-anchor"><xsl:value-of select="$data_anchor_safe"/></xsl:attribute>

robertatakenaka added 11 commits January 29, 2026 15:53

feat(htmlgenerator): add article-section-header reusable template

e2864b8

refactor(htmlgenerator): update article layout grid and responsivity

0ac3d74

refactor(htmlgenerator): use section-header template in references

ca939d2

refactor(htmlgenerator): use section-header template in data availabi…

cd518ed

…lity

refactor(htmlgenerator): use section-header template in history section

974ca09

refactor(htmlgenerator): use section-header template in publication d…

f5c09ab

…ates

refactor(htmlgenerator): use section-header template in abstracts

00def2f

Atualiza css obtido do opac_5

a917e65

feat(ui): add scrollbar-gutter stable to modal-dialog-scrollable

1cb5034

fix(ref): remove redundant div wrapper in article-text-ref

2358033

refactor(abstract): use article-section-header template for consistency

daa6b3b

Copilot AI review requested due to automatic review settings January 29, 2026 20:06

Copilot started reviewing on behalf of robertatakenaka January 29, 2026 20:06 View session

robertatakenaka merged commit 01cbc8a into scieloorg:master Jan 29, 2026
6 checks passed

Copilot AI reviewed Jan 29, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Corrige local do menu superior esquerdo#1074

Corrige local do menu superior esquerdo#1074
robertatakenaka merged 11 commits intoscieloorg:masterfrom
robertatakenaka:corrige_local_do_menu_superior_esquerdo

robertatakenaka commented Jan 29, 2026 •

edited

Loading

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Jan 29, 2026

Uh oh!

Copilot AI Jan 29, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		<xsl:attribute name="class">articleSection articleSection--<xsl:value-of select="$title_lowercase"/></xsl:attribute>
		<xsl:attribute name="data-anchor"><xsl:value-of select="$title"/></xsl:attribute>

Conversation

robertatakenaka commented Jan 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Título: Padronização da estrutura e identificação de articleSection

Descrição

🎯 O Problema

🛠 A Solução: Template article-section-header

Mudanças Implementadas:

Benefícios

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

robertatakenaka commented Jan 29, 2026 •

edited

Loading

Título: Padronização da estrutura e identificação de `articleSection`

🛠 A Solução: Template `article-section-header`