Component

Govspeak content (HTML Publications)

To display long form text with numbered parts, which has been converted from Govspeak

This component calls the standard Govspeak component, and layers a set of overriding styles on top. Styles for numbered parts are added, and heading sizes are increased.

Requires Slimmer >= 9.1.0 for nested component support.

Search for usage of this component on GitHub.

How it looks (preview) (preview all)

This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.

How to call this component

<%= render "govuk_publishing_components/components/govspeak_html_publication", {} do %>
  <p>This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.</p>
<% end %>

Accessibility acceptance criteria

  • headings must be part of a correct heading structure for the page
  • text should have a text contrast ratio higher than 4.5:1 against the background colour to meet WCAG AA

Links in the component must:

  • accept focus
  • be focusable with a keyboard
  • be usable with a keyboard
  • indicate when they have focus
  • change in appearance when touched (in the touch-down state)
  • change in appearance when hovered
  • be usable with touch
  • be usable with voice commands
  • have visible text
  • have meaningful text

Other examples

With content (preview)

This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.

<%= render "govuk_publishing_components/components/govspeak_html_publication", {
  content: sanitize("<p>This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.</p>
    ")
} %>

Heading level 2 (preview)

1. Executive summary

This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.

<%= render "govuk_publishing_components/components/govspeak_html_publication", {} do %>
  <h2>
  <span class="number">1. </span>Executive summary
</h2>
<p>This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.</p>
<% end %>

Heading level 3 (preview)

1.1 Fixing the public finances and running a surplus

The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.

<%= render "govuk_publishing_components/components/govspeak_html_publication", {} do %>
  <h3>
  <span class="number">1.1 </span>Fixing the public finances and running a surplus
</h3>
<p>The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.</p>
<% end %>

Numbered content (preview)

1. Executive summary

This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.

1.1 Fixing the public finances and running a surplus

The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.

1.2 Economic forecast

The Office for Budget Responsibility (OBR) forecasts GDP growth of 2.4% in 2015, 2.3% in 2016, and 2.4% for the remainder of the forecast period.

2. The UK economy and public finances

2.1 UK economy

The government’s long‑term economic plan has secured the recovery. The government’s fiscal responsibility has allowed monetary activism to support demand in the economy alongside repair of the financial sector. This has been supported by supply-side reform to deliver sustainable increases in standards of living.

<%= render "govuk_publishing_components/components/govspeak_html_publication", {} do %>
  <h2 id="executive-summary">
  <span class="number">1. </span>Executive summary
</h2>
<p>This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.</p>
<h3 id="fixing-the-public-finances-and-running-a-surplus">
  <span class="number">1.1 </span>Fixing the public finances and running a surplus
</h3>
<p>The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.</p>
<h3 id="economic-forecast">
  <span class="number">1.2 </span>Economic forecast
</h3>
<p>The Office for Budget Responsibility (OBR) forecasts GDP growth of 2.4% in 2015, 2.3% in 2016, and 2.4% for the remainder of the forecast period.</p>
<h2 id="the-uk-economy-and-public-finances">
  <span class="number">2. </span>The UK economy and public finances
</h2>
<h3 id="uk-economy">
  <span class="number">2.1 </span>UK economy
</h3>
<p>The government’s long‑term economic plan has secured the recovery. The government’s fiscal responsibility has allowed monetary activism to support demand in the economy alongside repair of the financial sector. This has been supported by supply-side reform to deliver sustainable increases in standards of living.</p>
<% end %>

Right to left (preview)

1. Executive summary

This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.

1.1 Fixing the public finances and running a surplus

The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.

1.2 Economic forecast

The Office for Budget Responsibility (OBR) forecasts GDP growth of 2.4% in 2015, 2.3% in 2016, and 2.4% for the remainder of the forecast period.

2. The UK economy and public finances

2.1 UK economy

The government’s long‑term economic plan has secured the recovery. The government’s fiscal responsibility has allowed monetary activism to support demand in the economy alongside repair of the financial sector. This has been supported by supply-side reform to deliver sustainable increases in standards of living.

<%= render "govuk_publishing_components/components/govspeak_html_publication", {
  direction: "rtl"
} do %>
  <h2>
  <span class="number">1. </span>Executive summary
</h2>
<p>This is a Budget that puts security first. It ensures economic security for working people by putting the public finances in order and setting out a bold plan for a more productive, balanced economy.</p>
<h3>
  <span class="number">1.1 </span>Fixing the public finances and running a surplus
</h3>
<p>The government’s long-term economic plan has laid the foundations for a stronger economy, and the UK’s recovery is now well established. The labour market remains strong, and in the 3 months to April 2015, employment was around record levels at 31.1 million.</p>
<h3>
  <span class="number">1.2 </span>Economic forecast
</h3>
<p>The Office for Budget Responsibility (OBR) forecasts GDP growth of 2.4% in 2015, 2.3% in 2016, and 2.4% for the remainder of the forecast period.</p>
<h2>
  <span class="number">2. </span>The UK economy and public finances
</h2>
<h3>
  <span class="number">2.1 </span>UK economy
</h3>
<p>The government’s long‑term economic plan has secured the recovery. The government’s fiscal responsibility has allowed monetary activism to support demand in the economy alongside repair of the financial sector. This has been supported by supply-side reform to deliver sustainable increases in standards of living.</p>
<% end %>

Financial table (preview)

Table 1.6: Total Managed Expenditure (as produced by the financial table editor)
2015-16 2016-17 2017-18 2018-19 2019-20 2020-21
Current Expenditure
Resource AME 345.3 353.3 365.9 378.4 391.8 403.9
Resource DEL excluding depreciation 315.1 320.8 322.9 325.2 328.3 341.2
Ring-fenced depreciation 21.9 21.9 21.9 21.9 21.9 21.9
Public Sector Current Expenditure 682.3 696.0 710.7 725.5 742.0 767.0
Capital Expenditure
Capital AME 31.7 33.4 31.7 30.7 31.7 34.5
Capital DEL 41.7 44.0 45.0 45.0 47.3 55.7
Public Sector Gross Investment 73.4 77.4 76.7 75.7 79.0 90.2
Total Managed Expenditure 755.7 773.3 787.5 801.2 821.0 857.2
Total Managed Expenditure (% GDP) 39.7% 39.1% 38.1% 37.2% 36.5% 36.4% 
<%= render "govuk_publishing_components/components/govspeak_html_publication", {} do %>
  <table class="financial-data">
  <caption>Table 1.6: Total Managed Expenditure (as produced by the <a href="https://alphagov.github.io/table-editor/financial-tables.html">financial table editor</a>)</caption>
  <thead>
    <tr>
      <td></td>
      <th class="numeric">2015-16</th>
      <th class="numeric">2016-17</th>
      <th class="numeric">2017-18</th>
      <th class="numeric">2018-19</th>
      <th class="numeric">2019-20</th>
      <th class="numeric">2020-21</th>
    </tr>
  </thead>
  <tbody>
    <tr class="section-heading">
      <th colspan="7">Current Expenditure</th>
    </tr>
    <tr>
      <th>Resource AME</th>
      <td class="numeric">345.3</td>
      <td class="numeric">353.3</td>
      <td class="numeric">365.9</td>
      <td class="numeric">378.4</td>
      <td class="numeric">391.8</td>
      <td class="numeric">403.9</td>
    </tr>
    <tr>
      <th>Resource DEL excluding depreciation</th>
      <td class="numeric">315.1</td>
      <td class="numeric">320.8</td>
      <td class="numeric">322.9</td>
      <td class="numeric">325.2</td>
      <td class="numeric">328.3</td>
      <td class="numeric">341.2</td>
    </tr>
    <tr>
      <th>Ring-fenced depreciation</th>
      <td class="numeric">21.9</td>
      <td class="numeric">21.9</td>
      <td class="numeric">21.9</td>
      <td class="numeric">21.9</td>
      <td class="numeric">21.9</td>
      <td class="numeric">21.9</td>
    </tr>
    <tr class="subtotal">
      <th>Public Sector Current Expenditure</th>
      <td class="numeric">682.3</td>
      <td class="numeric">696.0</td>
      <td class="numeric">710.7</td>
      <td class="numeric">725.5</td>
      <td class="numeric">742.0</td>
      <td class="numeric">767.0</td>
    </tr>
    <tr class="section-heading">
      <th colspan="7">Capital Expenditure</th>
    </tr>
    <tr>
      <th>Capital AME</th>
      <td class="numeric">31.7</td>
      <td class="numeric">33.4</td>
      <td class="numeric">31.7</td>
      <td class="numeric">30.7</td>
      <td class="numeric">31.7</td>
      <td class="numeric">34.5</td>
    </tr>
    <tr>
      <th>Capital DEL</th>
      <td class="numeric">41.7</td>
      <td class="numeric">44.0</td>
      <td class="numeric">45.0</td>
      <td class="numeric">45.0</td>
      <td class="numeric">47.3</td>
      <td class="numeric">55.7</td>
    </tr>
    <tr class="subtotal">
      <th>Public Sector Gross Investment</th>
      <td class="numeric">73.4</td>
      <td class="numeric">77.4</td>
      <td class="numeric">76.7</td>
      <td class="numeric">75.7</td>
      <td class="numeric">79.0</td>
      <td class="numeric">90.2</td>
    </tr>
  </tbody>
  <tfoot>
    <tr class="total">
      <th>Total Managed Expenditure</th>
      <td class="numeric">755.7</td>
      <td class="numeric">773.3</td>
      <td class="numeric">787.5</td>
      <td class="numeric">801.2</td>
      <td class="numeric">821.0</td>
      <td class="numeric">857.2</td>
    </tr>
    <tr>
      <th>Total Managed Expenditure (% GDP)</th>
      <td class="numeric">39.7%</td>
      <td class="numeric">39.1%</td>
      <td class="numeric">38.1%</td>
      <td class="numeric">37.2%</td>
      <td class="numeric">36.5%</td>
      <td class="numeric">36.4%</td>
    </tr>
  </tfoot>
</table>
<% end %>