From 1f0a4abc349636eb985ef0082324d3106f9c4260 Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 11:32:22 +1200 Subject: [PATCH 1/6] Make docs tables fill the content column The `table` rule never set a width, so auto layout shrank every table to its content width and left a gap on the right of the content column. On the Infrastructure page the matrix table rendered 713px wide inside an 800px column, so the row borders stopped 87px short of the right edge. Add `width: 100%` to the `table` rule. Also tidy the Infrastructure matrix table: - Drop two `
` wrappers from the Development and Staging headings. They were copy-pasted from the deployment-target licensing table, where they usefully cap long headings like "Machine Count Against License (PTM)". Here the headings are one short word, so the divs only padded the columns out. - Give the row-label column a heading. It was an empty ``, which is why the table read as four columns with three headings. - Normalise the separator row, which still carried the licensing table's mismatched dash runs. The licensing tables keep their width divs; those tables already fill the column and the divs are what keeps the Important Note prose readable. Verified by screenshotting all 384 tables across 169 pages before and after: 188 changed, 196 unchanged, 0 newly overflowing, 0 height changes. Co-Authored-By: Claude Opus 5 (1M context) --- public/docs/css/main.css | 3 +++ src/pages/docs/infrastructure/index.mdx | 10 +++++----- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/public/docs/css/main.css b/public/docs/css/main.css index 8c59b348a0..bb83382664 100644 --- a/public/docs/css/main.css +++ b/public/docs/css/main.css @@ -417,6 +417,9 @@ h6:hover .bookmark-link, table { border-collapse: collapse; + /* Without this, auto layout shrinks tables to their content width and leaves + a ragged gap on the right of the content column. */ + width: 100%; } table thead { diff --git a/src/pages/docs/infrastructure/index.mdx b/src/pages/docs/infrastructure/index.mdx index 7f7e03ec4d..9e059dbc7e 100644 --- a/src/pages/docs/infrastructure/index.mdx +++ b/src/pages/docs/infrastructure/index.mdx @@ -21,11 +21,11 @@ You assign deployment targets to an environment and you can set up a lifecycle t Target tags also make applying the same process to all environments easier. The table below shows a matrix of target tags and environments, with environments having different resource sets. Deployments proceed in an orderly fashion across the matrix. -| |
Development
|
Staging
| Production | -| ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------ | ------------------------------------------------------------------------ | -------------- | -| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | -| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | -| Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | +| Target tag | Development | Staging | Production | +| ------------ | ------------ | -------------------------------------- | --------------------------------------------------------------------- | +| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | +| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | +| Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | You can manage the machines and services you deploy your software to on the **Infrastructure** tab of the Octopus Web Portal: From 9a05312ef05d00465661c702654c8854e3f22447 Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 11:55:48 +1200 Subject: [PATCH 2/6] Fix markdownlint issues on the Infrastructure page The lint job only checks markdown files touched by the PR, so editing this page surfaced two pre-existing violations alongside my own: - MD060: align the matrix table's pipes exactly (mine were a space out). - MD045: give the dashboard image alt text. It was an empty `![]()`. - MD047: add the missing trailing newline. Co-Authored-By: Claude Opus 5 (1M context) --- src/pages/docs/infrastructure/index.mdx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/docs/infrastructure/index.mdx b/src/pages/docs/infrastructure/index.mdx index 9e059dbc7e..face440970 100644 --- a/src/pages/docs/infrastructure/index.mdx +++ b/src/pages/docs/infrastructure/index.mdx @@ -23,14 +23,14 @@ Target tags also make applying the same process to all environments easier. The | Target tag | Development | Staging | Production | | ------------ | ------------ | -------------------------------------- | --------------------------------------------------------------------- | -| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | -| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | +| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | +| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | | Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | You can manage the machines and services you deploy your software to on the **Infrastructure** tab of the Octopus Web Portal: :::figure -![](/docs/img/infrastructure/images/infrastructure-overview-dashboard.png) +![The Infrastructure overview dashboard in the Octopus Web Portal](/docs/img/infrastructure/images/infrastructure-overview-dashboard.png) ::: There are a few key infrastructure concepts in Octopus Deploy: @@ -48,4 +48,4 @@ There are a few key infrastructure concepts in Octopus Deploy: - [Deployment targets](/docs/infrastructure/deployment-targets) - [Workers](/docs/infrastructure/workers) - [Accounts](/docs/infrastructure/accounts) -- [Signing keys](/docs/infrastructure/signing-keys) \ No newline at end of file +- [Signing keys](/docs/infrastructure/signing-keys) From 33a19e3bdb90f0ea44ed5b6a65872ea16a4d997a Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 13:09:37 +1200 Subject: [PATCH 3/6] Revert the global table width change Setting `width: 100%` on `table` closed the gap on the right, but it changed 190 of 384 tables to fix the one that was reported, and it broke a pairing the existing design relies on: `table tr` has a `border-bottom`, which used to span the data and now spanned the whole content column. On a 2-column table that rendered 153px wide, that reads as a horizontal rule with two words floating over it rather than as a table. `th` also has no `text-align`, so it falls back to the browser default of centre, which is invisible at shrink-to-fit widths and obvious at full width. Shrink-to-fit plus a data-width row border is self-consistent. Forcing 100% without also revisiting the border and heading alignment is not. Restore the two `width:175px` divs along with it. Without them the Infrastructure matrix table measures 583px of an 800px column (a 217px gap) instead of 713px, which is worse than the 87px gap that prompted this. Kept from the reverted work, since these stand on their own: - The row-label column now has a heading. It was an empty ``, which is why the table read as four columns with three headings. - The dashboard image has alt text (MD045) and the file ends with a newline (MD047), both pre-existing lint failures on this page. - The separator row is aligned (MD060); it carried the licensing table's mismatched dash runs. Co-Authored-By: Claude Opus 5 (1M context) --- public/docs/css/main.css | 3 --- src/pages/docs/infrastructure/index.mdx | 10 +++++----- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/public/docs/css/main.css b/public/docs/css/main.css index bb83382664..8c59b348a0 100644 --- a/public/docs/css/main.css +++ b/public/docs/css/main.css @@ -417,9 +417,6 @@ h6:hover .bookmark-link, table { border-collapse: collapse; - /* Without this, auto layout shrinks tables to their content width and leaves - a ragged gap on the right of the content column. */ - width: 100%; } table thead { diff --git a/src/pages/docs/infrastructure/index.mdx b/src/pages/docs/infrastructure/index.mdx index face440970..6d337bd41b 100644 --- a/src/pages/docs/infrastructure/index.mdx +++ b/src/pages/docs/infrastructure/index.mdx @@ -21,11 +21,11 @@ You assign deployment targets to an environment and you can set up a lifecycle t Target tags also make applying the same process to all environments easier. The table below shows a matrix of target tags and environments, with environments having different resource sets. Deployments proceed in an orderly fashion across the matrix. -| Target tag | Development | Staging | Production | -| ------------ | ------------ | -------------------------------------- | --------------------------------------------------------------------- | -| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | -| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | -| Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | +| Target tag |
Development
|
Staging
| Production | +| ------------ | ------------------------------------------ | -------------------------------------- | --------------------------------------------------------------------- | +| Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | +| API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | +| Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | You can manage the machines and services you deploy your software to on the **Infrastructure** tab of the Octopus Web Portal: From 7bf6da396c86e2c99c40203ca0896385d823250c Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 13:21:18 +1200 Subject: [PATCH 4/6] Scope the full-width table fix to the Infrastructure matrix table Replaces the reverted global `table { width: 100% }` with an opt-in class, so only the table that was reported changes. Every other table on the site keeps its current shrink-to-fit behaviour, along with the row border that spans the data rather than the column. The remark directive plugin nests the class outside the `.table-wrap` the wrapTables plugin injects, giving `
`, so the descendant selector reaches the table. Verified against a dev-server render: the table now measures 800px of an 800px content column, columns [140, 232, 232, 196]. The remaining `.mdx` changes are what the lint job requires once this file is touched at all. It only checks markdown the PR modifies, and this page carried seven pre-existing violations: five MD060 (inconsistent table pipes), MD045 (the dashboard image had no alt text) and MD047 (no trailing newline). Co-Authored-By: Claude Opus 5 (1M context) --- public/docs/css/main.css | 4 ++++ src/pages/docs/infrastructure/index.mdx | 6 +++++- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/public/docs/css/main.css b/public/docs/css/main.css index 8c59b348a0..62b2753851 100644 --- a/public/docs/css/main.css +++ b/public/docs/css/main.css @@ -419,6 +419,10 @@ table { border-collapse: collapse; } +.table-full-width table { + width: 100%; +} + table thead { font-weight: 700; } diff --git a/src/pages/docs/infrastructure/index.mdx b/src/pages/docs/infrastructure/index.mdx index 6d337bd41b..1552de01de 100644 --- a/src/pages/docs/infrastructure/index.mdx +++ b/src/pages/docs/infrastructure/index.mdx @@ -21,12 +21,16 @@ You assign deployment targets to an environment and you can set up a lifecycle t Target tags also make applying the same process to all environments easier. The table below shows a matrix of target tags and environments, with environments having different resource sets. Deployments proceed in an orderly fashion across the matrix. -| Target tag |
Development
|
Staging
| Production | +:::div{.table-full-width} + +| |
Development
|
Staging
| Production | | ------------ | ------------------------------------------ | -------------------------------------- | --------------------------------------------------------------------- | | Web tag | Dev-Target-1 | Staging-Target-1
Staging-Target-2 | Production-Target-1
Production-Target-2
Production-Target-3 | | API tag | Dev-Target-2 | Staging-Target-3
Staging-Target-4 | Production-Target-4
Production-Target-5 | | Database tag | Dev-Target-3 | Staging-Target-5 | Production-Target-6
Production-Target-7 | +::: + You can manage the machines and services you deploy your software to on the **Infrastructure** tab of the Octopus Web Portal: :::figure From b58eb68a3c5d84edd70f28ec5f39343f48bd6ad9 Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 13:42:47 +1200 Subject: [PATCH 5/6] Left-align headings on the full-width table Headings sat 37-59px right of the data they label, by inconsistent amounts: Development and Staging are centred inside their 175px divs, Production inside a 232px cell, so the header row had no shared rhythm with the columns below it. `th` has no `text-align` anywhere in the stylesheet, so it fell back to the browser default of centre. Scoped to the same class as the width rule, so the two travel together - a table that opts into filling the column gets headings aligned to its data. Measured on the deployed build: all three offsets go to 0px. Co-Authored-By: Claude Opus 5 (1M context) --- public/docs/css/main.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/public/docs/css/main.css b/public/docs/css/main.css index 62b2753851..910d9c8d1c 100644 --- a/public/docs/css/main.css +++ b/public/docs/css/main.css @@ -423,6 +423,10 @@ table { width: 100%; } +.table-full-width th { + text-align: left; +} + table thead { font-weight: 700; } From 7f81752858651eb42225fe8a4c5a5dd135245994 Mon Sep 17 00:00:00 2001 From: William Laugesen Date: Thu, 30 Jul 2026 14:12:22 +1200 Subject: [PATCH 6/6] Move the opt-in table rules after the base table rules They were sitting between `table { border-collapse }` and `table thead { font-weight }`, splitting the base rules with a modifier. No behaviour change - nothing else in the stylesheet sets width or text-align on tables, so cascade order is not load-bearing here; this is for readability. Co-Authored-By: Claude Opus 5 (1M context) --- public/docs/css/main.css | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/public/docs/css/main.css b/public/docs/css/main.css index 910d9c8d1c..06c5ed2045 100644 --- a/public/docs/css/main.css +++ b/public/docs/css/main.css @@ -419,14 +419,6 @@ table { border-collapse: collapse; } -.table-full-width table { - width: 100%; -} - -.table-full-width th { - text-align: left; -} - table thead { font-weight: 700; } @@ -447,6 +439,14 @@ table th { padding: 0.8rem 1rem; } +.table-full-width table { + width: 100%; +} + +.table-full-width th { + text-align: left; +} + .credits table, .credits thead, .credits tbody,