From 0606c6f4e130a88d34b16b57d86287435dc79fbf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Aki=20=F0=9F=8C=B9?= Date: Sat, 14 Mar 2026 14:39:22 +0000 Subject: [PATCH 1/3] Not every Ecma standard prepends their claueses with `sec`, this should catch the rest --- css/print.css | 13 +++++++++---- .../generated-reference/assets-inline.html | 13 +++++++++---- 2 files changed, 18 insertions(+), 8 deletions(-) diff --git a/css/print.css b/css/print.css index f67a6e23..616436fe 100644 --- a/css/print.css +++ b/css/print.css @@ -660,19 +660,24 @@ p.ECMAaddress { margin: 0; } -#sec-terms-and-definitions dfn { +[id$=terms-and-definitions] dfn { font-style: normal; } -#sec-terms-and-definitions h1 .secnum { +[id$=terms-and-definitions] emu-clause h1 { + font-size: 10pt; + -prince-bookmark-level: none; +} + +[id$=terms-and-definitions] h1 .secnum { display: block; } -#sec-terms-and-definitions > h1 > .secnum { +[id$=terms-and-definitions] > h1 > .secnum { display: inline; } -#sec-terms-and-definitions h1 + p { +[id$=terms-and-definitions] h1 + p { margin-top: 0; } diff --git a/test/baselines/generated-reference/assets-inline.html b/test/baselines/generated-reference/assets-inline.html index f12126b6..0e8fbe89 100644 --- a/test/baselines/generated-reference/assets-inline.html +++ b/test/baselines/generated-reference/assets-inline.html @@ -3917,19 +3917,24 @@ margin: 0; } -#sec-terms-and-definitions dfn { +[id$=terms-and-definitions] dfn { font-style: normal; } -#sec-terms-and-definitions h1 .secnum { +[id$=terms-and-definitions] emu-clause h1 { + font-size: 10pt; + -prince-bookmark-level: none; +} + +[id$=terms-and-definitions] h1 .secnum { display: block; } -#sec-terms-and-definitions > h1 > .secnum { +[id$=terms-and-definitions] > h1 > .secnum { display: inline; } -#sec-terms-and-definitions h1 + p { +[id$=terms-and-definitions] h1 + p { margin-top: 0; } From b20b66616180f35acbd6a3781d6a0035d7b75fb8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Aki=20=F0=9F=8C=B9?= Date: Mon, 11 May 2026 19:43:43 +0100 Subject: [PATCH 2/3] Format terms & defs regardless of media --- css/elements.css | 14 +++++++- css/print.css | 18 ++-------- js/print.js | 2 +- spec/index.html | 86 ++++++++++++++++++++++++++++++++++++++++++++++-- 4 files changed, 101 insertions(+), 19 deletions(-) diff --git a/css/elements.css b/css/elements.css index cda2b290..039fc98c 100644 --- a/css/elements.css +++ b/css/elements.css @@ -256,12 +256,12 @@ html { background-color: var(--background-color); + font-size: 18px; } body { display: flex; word-wrap: break-word; - font-size: 18px; line-height: 1.5; font-family: 'IBM Plex Serif', @@ -920,6 +920,18 @@ emu-annex emu-annex emu-annex emu-annex emu-annex emu-annex { margin-top: 0; } +[id*="terms-and-definitions"] emu-clause h1 { + font-size: 1rem; +} + +[id*="terms-and-definitions"] emu-clause h1 + p { + margin-top: 0; +} + +[id*="terms-and-definitions"] emu-clause .secnum { + display: block; +} + /* Figures and tables */ figure { display: block; diff --git a/css/print.css b/css/print.css index 616436fe..c7095a00 100644 --- a/css/print.css +++ b/css/print.css @@ -188,11 +188,11 @@ html, body { background-color: initial; + font-size: 10pt; } body { font-family: 'Arial Plus', Arial, Helvetica, sans-serif, "DejaVu Math TeX Gyre", Symbola, monospace; - font-size: 10pt; color: #000; line-height: 1.15; } @@ -660,27 +660,15 @@ p.ECMAaddress { margin: 0; } -[id$=terms-and-definitions] dfn { +[id*=terms-and-definitions] dfn { font-style: normal; } -[id$=terms-and-definitions] emu-clause h1 { +[id*=terms-and-definitions] emu-clause h1 { font-size: 10pt; -prince-bookmark-level: none; } -[id$=terms-and-definitions] h1 .secnum { - display: block; -} - -[id$=terms-and-definitions] > h1 > .secnum { - display: inline; -} - -[id$=terms-and-definitions] h1 + p { - margin-top: 0; -} - p.adoption-info { float: bottom; } diff --git a/js/print.js b/js/print.js index 45ca7376..697fea9f 100644 --- a/js/print.js +++ b/js/print.js @@ -30,7 +30,7 @@ PDF.subject = shortname.innerHTML + (version ? ', ' + version.innerHTML : ''); /** * Terms and definitions section should not have every term listed in the table of contents. * */ -const terms = document.querySelector('#toc a[href="#sec-terms-and-definitions"]'); +const terms = document.querySelector('#toc a[href*="terms-and-definitions"]'); if (terms) { (terms.parentElement.querySelector('ol.toc') || document.createElement('i')).remove(); diff --git a/spec/index.html b/spec/index.html index 5402b7bb..be8382cf 100644 --- a/spec/index.html +++ b/spec/index.html @@ -164,7 +164,9 @@

Example

Clauses

-

Clauses are referenced using their id and are numbered automatically based on document position. Ecmarkdown syntax can be used in descendent text nodes as well. Text nodes are parsed as Ecmarkdown Fragments.

+

Clauses are referenced using their id and are numbered automatically based on document position. Ecmarkdown syntax can be used in descendent text nodes as well. Text nodes are parsed as Ecmarkdown Fragments. Clauses always begin with an `<h1>` element.

+ +

emu-intro

@@ -254,6 +256,42 @@

This clause is normative optional.

+ + +

Terms and definitions

+

Ecmarkup produces special formatting behaviour for an `<emu-clause>` with an ID ending in `terms-and-definitions`. No action is required on an editor's part to properly format that clause as long as it uses similar markup to any other clause, i.e. an `<h1>` element followed by one or more `<p>` or `<emu-clause>` elements.

+

Using a `<dfn>` element in the clause title is optional, and will allow ecmarkup to link back to the term anywhere it is used in the rest of the document. See definitions.

+ +

Example

+ 

+      <emu-clause id="sec-terms-and-definitions">
+        <h1>Terms and definitions</h1>
+        <emu-clause id="term-technical-definition">
+          <h1>technical definition</h1>
+          <p>descriptive text aligning with Ecma house style, providing text that could be swapped in for the term without impacting readability</p>
+        </emu-clause>
+        <emu-clause id="term-ecma">
+          <h1><dfn>Ecma International</dfn></h1>
+          <p>international standards organization responsible for technology-related standards since 1959</p>
+        </emu-clause>
+      </emu-clause>
+ +

Result

+ + @@ -270,7 +308,7 @@

Attributes

Definitions

-

Terms can be defined using the `<dfn>` element. Any uses of that term will be automatically linked to the clause containing the definition, or, if the `<dfn>` element has an `id`, to the `<dfn>` itself. This can be suppressed with the `emu-not-ref` element.

+

Terms can be defined inline using the `<dfn>` element. Any uses of that term will be automatically linked to the clause containing the definition, or, if the `<dfn>` element has an `id`, to the `<dfn>` itself. This can be suppressed with the `emu-not-ref` element.

When the term starts with a lowercase English letter, usages of the term with the first letter capitalized will also link.

Attributes

@@ -1103,3 +1141,47 @@

Code Listings

Create a code listing using `<pre><code>`. The `code` element takes a class of `javascript`, `html`, or any other language provided by highlightjs. Ecmarkup will trim any leading blank lines and also normalize the indentation based on the indentation of the first line.

 + + +

Required structure for Ecma documents

+ +

Ecmarkup supports producing a document aligned with Ecma house style. If the ecmarkup document is intended to be formally released by Ecma International, there are some structural requirements it shall follow.

+

Each `<emu-intro>`, `<emu-clause>`, and `<emu-annex>` element shall have a unique ID, optionally beginning with the prefix `sec-`.

+ + +

Technical Reports

+ + +

This section is a work in progress.

+ + +

Ecma technical reports begin with an unnumbered introduction (using a single `<emu-intro>` element), then the following numbered clauses:

+ +
    +
  1. Scope
    2. +
  2. References
    3. +
  3. Terms and definitions
    4. +
+ +

(Refer to the Ecma house style guide for more detailed information.)

+ + + +

Standards

+ + +

This section is a work in progress.

+ + +

Ecma standards conforming to Ecma house style begin with an unnumbered introduction clause (using a single `<emu-intro>` element), followed by the following numbered clauses:

+ +
    +
  1. Scope
    2. +
  2. Normative references
    3. +
  3. Informative references
    4. +
  4. Terms and definitions
    5. +
+ +

(Refer to the Ecma house style guide for more detailed information.)

+ + From 21efecdad7aa013b10521fadc52ff83314e1f51a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Aki=20=F0=9F=8C=B9?= Date: Mon, 11 May 2026 19:54:32 +0100 Subject: [PATCH 3/3] Always like that. --- css/elements.css | 6 ++-- css/print.css | 5 ++- js/print.js | 2 +- .../generated-reference/assets-inline.html | 33 +++++++++---------- 4 files changed, 22 insertions(+), 24 deletions(-) diff --git a/css/elements.css b/css/elements.css index 039fc98c..191911c2 100644 --- a/css/elements.css +++ b/css/elements.css @@ -920,15 +920,15 @@ emu-annex emu-annex emu-annex emu-annex emu-annex emu-annex { margin-top: 0; } -[id*="terms-and-definitions"] emu-clause h1 { +[id*='terms-and-definitions'] emu-clause h1 { font-size: 1rem; } -[id*="terms-and-definitions"] emu-clause h1 + p { +[id*='terms-and-definitions'] emu-clause h1 + p { margin-top: 0; } -[id*="terms-and-definitions"] emu-clause .secnum { +[id*='terms-and-definitions'] emu-clause .secnum { display: block; } diff --git a/css/print.css b/css/print.css index c7095a00..57cf3b4e 100644 --- a/css/print.css +++ b/css/print.css @@ -660,12 +660,11 @@ p.ECMAaddress { margin: 0; } -[id*=terms-and-definitions] dfn { +[id*='terms-and-definitions'] dfn { font-style: normal; } -[id*=terms-and-definitions] emu-clause h1 { - font-size: 10pt; +[id*='terms-and-definitions'] emu-clause h1 { -prince-bookmark-level: none; } diff --git a/js/print.js b/js/print.js index 697fea9f..c6e62aa7 100644 --- a/js/print.js +++ b/js/print.js @@ -30,7 +30,7 @@ PDF.subject = shortname.innerHTML + (version ? ', ' + version.innerHTML : ''); /** * Terms and definitions section should not have every term listed in the table of contents. * */ -const terms = document.querySelector('#toc a[href*="terms-and-definitions"]'); +const terms = document.querySelector('#toc a[href*="#terms-and-definitions"]'); if (terms) { (terms.parentElement.querySelector('ol.toc') || document.createElement('i')).remove(); diff --git a/test/baselines/generated-reference/assets-inline.html b/test/baselines/generated-reference/assets-inline.html index 0e8fbe89..506c96d4 100644 --- a/test/baselines/generated-reference/assets-inline.html +++ b/test/baselines/generated-reference/assets-inline.html @@ -1872,12 +1872,12 @@ html { background-color: var(--background-color); + font-size: 18px; } body { display: flex; word-wrap: break-word; - font-size: 18px; line-height: 1.5; font-family: 'IBM Plex Serif', @@ -2536,6 +2536,18 @@ margin-top: 0; } +[id*='terms-and-definitions'] emu-clause h1 { + font-size: 1rem; +} + +[id*='terms-and-definitions'] emu-clause h1 + p { + margin-top: 0; +} + +[id*='terms-and-definitions'] emu-clause .secnum { + display: block; +} + /* Figures and tables */ figure { display: block; @@ -3445,11 +3457,11 @@ html, body { background-color: initial; + font-size: 10pt; } body { font-family: 'Arial Plus', Arial, Helvetica, sans-serif, "DejaVu Math TeX Gyre", Symbola, monospace; - font-size: 10pt; color: #000; line-height: 1.15; } @@ -3917,27 +3929,14 @@ margin: 0; } -[id$=terms-and-definitions] dfn { +[id*='terms-and-definitions'] dfn { font-style: normal; } -[id$=terms-and-definitions] emu-clause h1 { - font-size: 10pt; +[id*='terms-and-definitions'] emu-clause h1 { -prince-bookmark-level: none; } -[id$=terms-and-definitions] h1 .secnum { - display: block; -} - -[id$=terms-and-definitions] > h1 > .secnum { - display: inline; -} - -[id$=terms-and-definitions] h1 + p { - margin-top: 0; -} - p.adoption-info { float: bottom; }