<commit_before>    <a class="back-link" href="/">Back to the index</a>


    <h1 class="heading-xlarge">Typography</h1>


    <div class="text">


      <div class="alert-info" role="alert">

        <div class="alert-message">

          <p>All typography used in the site <strong>should be</strong> in alignment with the beta banner. If any design mockups illustrate this, then please question why and do not simply copy it!</p>

        </div>

      </div>


      <h1 class="heading-xlarge">Large heading <span class="heading-secondary">with sub heading</span></h1>


      <p class="lede">This is an intro paragraph at 24px. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Curabitur blandit tempus porttitor. Vestibulum id ligula porta felis euismod semper.</p>


      <h2 class="heading-large">A 36px heading</h2>

      <p>This is a body copy paragraph at 19px. Donec id elit non mi porta gravida at eget metus. Cum sociis natoque penatibus et magnis dis parturient montes, <a href="#" rel="external">nasceturridiculus</a> mus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p>


      <h3 class="heading-medium">A 24px heading</h3>

      <p>Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod semper. Donec id elit non mi porta gravida at eget metus.</p>


      <h4 class="heading-small">A 19px heading</h4>

      <p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Donec sed odio dui. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>


      <h2 class="heading-medium">Inset text</h2>

      <div class="text panel-indent">

        <p>It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.</p>

      </div>


      <h2 class="heading-medium">Hidden text (progressive disclosure)</h2>

      <details>

        <summary><span class="summary">Help with nationality</span></summary>

        <div class="panel-indent">
          <p>If you’re not sure about your nationality, try to find out from an official document like a passport or national ID card.</p>
          <p>We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.</p>
        </div>

      </details>


      <h2 class="heading-medium">Unordered list</h2>

      <ul class="list-bullet">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis euismod semper.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ul>


      <h2 class="heading-medium">Ordered list</h2>

      <ol class="list-number">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis <a href="https://www.gov.uk" rel="external">visit gov.uk</a>.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ol>


      <h2 class="heading-medium">Alpha list</h2>

      <ol class="list-alpha">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis euismod semper.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ol>


      <h2 class="heading-medium">External links (Screen reader optimised)</h2>

      <p><a href="https://www.gov.uk" rel="external">Visit gov.uk</a></p>


      <h2 class="heading-medium">Address using ( <a href="http://microformats.org/wiki/microdata">microdata </a>)</h2>


      <div class="hcard" itemtype="http://schema.org/Organization" itemscope>

        <div itemprop="name"><b>Beech Farm</b></div>

        <div class="hcard-adr" itemprop="address" itemtype="http://schema.org/PostalAddress" itemscope>
          <div itemprop="streetAddress">Pooley Bridge</div>
          <div itemprop="addressLocality">Penrith</div>
          <div itemprop="addressRegion">Cumbria</div>
          <div itemprop="postalCode">CH3 6NZ</div>
          <div itemprop="addressCountry">United Kingdom</div>
        </div>

        <div itemprop="telephone">0147 9643 7770</div>
        <div itemprop="email"><a href="mailto:<EMAIL>"><EMAIL></a></div>

      </div>


      <h2 class="heading-medium">You cannot use Government Gateway to access this service.</h2>

      <p>You need to register with GOV.UK to use this service. People you want to act on behalf of a business will also need to register.</p>

      <p>To do this, or to sign in if you are already registered, click the button below.</p>

      <p><a class="button" href="#">Register or sign in to GOV.UK services</a></p>


    </div><commit_msg>Add heading links example<commit_after>    <a class="back-link" href="/">Back to the index</a>


    <h1 class="heading-xlarge">Typography</h1>


    <div class="text">


      <div class="alert-info" role="alert">

        <div class="alert-message">

          <p>All typography used in the site <strong>should be</strong> in alignment with the beta banner. If any design mockups illustrate this, then please question why and do not simply copy it!</p>

        </div>

      </div>


      <h1 class="heading-xlarge">Large heading <span class="heading-secondary">with sub heading</span></h1>


      <p class="lede">This is an intro paragraph at 24px. Maecenas faucibus mollis interdum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Curabitur blandit tempus porttitor. Vestibulum id ligula porta felis euismod semper.</p>


      <h2 class="heading-large">A 36px heading</h2>

      <p>This is a body copy paragraph at 19px. Donec id elit non mi porta gravida at eget metus. Cum sociis natoque penatibus et magnis dis parturient montes, <a href="#" rel="external">nasceturridiculus</a> mus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p>


      <h3 class="heading-medium">A 24px heading</h3>

      <p>Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod semper. Donec id elit non mi porta gravida at eget metus.</p>


      <h4 class="heading-small">A 19px heading</h4>

      <p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Donec sed odio dui. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare vel eu leo.</p>


      <h2 class="heading-medium">Inset text</h2>

      <div class="text panel-indent">

        <p>It can take up to 8 weeks to register a lasting power of attorney if there are no mistakes in the application.</p>

      </div>


      <h2 class="heading-medium">Hidden text (progressive disclosure)</h2>

      <details>

        <summary><span class="summary">Help with nationality</span></summary>

        <div class="panel-indent">
          <p>If you’re not sure about your nationality, try to find out from an official document like a passport or national ID card.</p>
          <p>We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.</p>
        </div>

      </details>


      <h2 class="heading-medium">Unordered list</h2>

      <ul class="list-bullet">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis euismod semper.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ul>


      <h2 class="heading-medium">Ordered list</h2>

      <ol class="list-number">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis <a href="https://www.gov.uk" rel="external">visit gov.uk</a>.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ol>


      <h2 class="heading-medium">Alpha list</h2>

      <ol class="list-alpha">
        <li>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</li>
        <li>Vestibulum id ligula porta felis euismod semper.</li>
        <li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</li>
      </ol>


      <h2 class="heading-medium">Link headings (with descriptions)</h2>

      <ol>
        <li>
          <h3 class="heading-medium"><a href="#">Integer posuere erat</a></h3>
          <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
        </li>
        <li>
          <h3 class="heading-medium"><a href="#">Venenatis dapibus posuere</a></h3>
          <p>Vestibulum id ligula porta felis euismod semper.</p>
        </li>
      </ol>


      <h2 class="heading-medium">External links (Screen reader optimised)</h2>

      <p><a href="https://www.gov.uk" rel="external">Visit gov.uk</a></p>


      <h2 class="heading-medium">Address using ( <a href="http://microformats.org/wiki/microdata">microdata </a>)</h2>


      <div class="hcard" itemtype="http://schema.org/Organization" itemscope>

        <div itemprop="name"><b>Beech Farm</b></div>

        <div class="hcard-adr" itemprop="address" itemtype="http://schema.org/PostalAddress" itemscope>
          <div itemprop="streetAddress">Pooley Bridge</div>
          <div itemprop="addressLocality">Penrith</div>
          <div itemprop="addressRegion">Cumbria</div>
          <div itemprop="postalCode">CH3 6NZ</div>
          <div itemprop="addressCountry">United Kingdom</div>
        </div>

        <div itemprop="telephone">0147 9643 7770</div>
        <div itemprop="email"><a href="mailto:joe.<EMAIL>"><EMAIL></a></div>

      </div>


      <h2 class="heading-medium">You cannot use Government Gateway to access this service.</h2>

      <p>You need to register with GOV.UK to use this service. People you want to act on behalf of a business will also need to register.</p>

      <p>To do this, or to sign in if you are already registered, click the button below.</p>

      <p><a class="button" href="#">Register or sign in to GOV.UK services</a></p>


    </div>
{'fraction_non_alphanumeric': 0.1156868057437009, 'fraction_numerical': 0.009753454348415064, 'mean_word_length': 3.205848841625522, 'pattern_counts': {'":': 0, '<': 287, '<?xml version=': 0, '>': 287, 'https://': 4, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5267580', 'n_tokens_mistral': 3797, 'n_tokens_neox': 3512, 'n_words': 1176}