Skip to content

Commit

Permalink
Merge branch 'DAC-accessibility-examples' of https://github.com/alpha…
Browse files Browse the repository at this point in the history 
…gov/govuk-frontend into DAC-accessibility-examples
  • Loading branch information
@CharlotteDowns
CharlotteDowns committed Apr 26, 2023
2 parents 3303f84 + c64f7aa commit ceb1a31
Show file tree
Hide file tree
Showing 11 changed files with 30 additions and 75 deletions.
2 changes: 0 additions & 2 deletions app/src/views/full-page-examples/cookie-banner-server-side/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,6 @@ notes: >-

The content of the page is not important for this scenario.

hidden: true

---

{# This example is based of the live "Apply online for a UK passport" start page: https://www.gov.uk/apply-renew-passport #}
Expand Down
1 change: 0 additions & 1 deletion app/src/views/full-page-examples/feedback/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ scenario: >-

notes: Based on https://www.signin.service.gov.uk/feedback

hidden: true
---
{% extends "full-page-example.njk" %}

Expand Down
9 changes: 0 additions & 9 deletions app/src/views/full-page-examples/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,26 +25,17 @@

<h3 class="govuk-heading-m"><a href="/full-page-examples/{{ example.path }}" class="govuk-link">{{ example.name | replace("-", " ") | capitalize }}</a></h3>

{% if example.scenario %}
<div class="app-prose-scope">
{{ markdown(example.scenario) | safe }}
</div>
{% endif %}
{% if example.scenario %}
<div class="app-prose-scope">
{{ markdown(example.scenario) | safe }}
</div>
{% endif %}

{% if example.notes %}
<p class="govuk-body govuk-!-font-size-16">{{ example.notes }}</p>
{% endif %}
{% if example.notes %}
<p class="govuk-body govuk-!-font-size-16">{{ example.notes }}</p>
{% endif %}

<hr class="govuk-section-break govuk-section-break--l" />
<hr class="govuk-section-break govuk-section-break--l" />

{% endif %}

Expand Down
2 changes: 0 additions & 2 deletions app/src/views/full-page-examples/search/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,6 @@ notes: >-
of the sort of interactions that you would find on a search page.

This example merges features seen on GOV.UK news and communication finders and search pages.

hidden: true
---

{% extends "full-page-example.njk" %}
Expand Down
39 changes: 0 additions & 39 deletions app/src/views/full-page-examples/service-manual-topic/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -241,44 +241,5 @@ notes: The links within each section are not functional.

</div>

<div class="govuk-grid-column-one-third">

<!-- The Related items component is not part of GOV.UK Frontend but will be styled if used in the Prototype Kit -->

<aside class="app-related-items" role="complementary">
<h2 class="govuk-heading-m" id="subsection-title">
Join the community
</h2>
<p class="govuk-body">Find out what the cross-government community does and how to get involved.</p>
<nav role="navigation" aria-labelledby="subsection-title">
<ul class="govuk-list govuk-!-font-size-16">
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Technology community (web operations)</a>
</li>
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Technology community (technical architecture)</a>
</li>
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Technology community (backend development)</a>
</li>
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Design community</a>
</li>
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Standards and assurance community</a>
</li>
<li class="gem-c-related-navigation__link">
<a class="govuk-link" href="#">Accessibility community</a>
</li>
</ul>
</nav>
<h2 class="govuk-heading-m">
Get notifications
</h2>
<p class="govuk-body">When any guidance within this topic is updated
<a class="govuk-link related-item__email-link" href="/service-manual/technology/email-signup">email</a></p>
</aside>

</div>
</div>
{% endblock %}
1 change: 0 additions & 1 deletion app/src/views/full-page-examples/upload-your-photo-success/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ scenario: >-

The upload will always result in a success (alert) message that uses the notification banner.

hidden: true
---

{# This example is based of the live "Passport" service: https://www.passport.service.gov.uk/photo/upload #}
Expand Down
1 change: 1 addition & 0 deletions app/src/views/full-page-examples/what-is-your-national-insurance-number/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ scenario: >-
{{ govukInput({
label: {
text: "What is your National Insurance number?",
isPageHeading: true,
classes: "govuk-label--l"
},
hint: {
Expand Down
4 changes: 2 additions & 2 deletions app/src/views/full-page-examples/work-history/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -251,7 +251,7 @@ notes: The links to change your answers are not functional.
]
}) }}

<form action="/full-page-examples/work-history" method="post">
<form action="/#" method="post">

<input type="hidden" name="answers-checked" value="true">

Expand All @@ -262,7 +262,7 @@ notes: The links to change your answers are not functional.

{{ govukButton({
text: "Add new work history",
href: "/full-page-examples/work-history",
href: "/#",
classes: "govuk-button--secondary"
}) }}
</div>
Expand Down
4 changes: 2 additions & 2 deletions app/src/views/index.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,10 @@
<li><a href="https://alphagov.github.io/accessible-autocomplete/examples/" class="govuk-link">Accessible autocomplete example</a></li>
<li><a href="https://www.gov.uk/government/organisations/hm-revenue-customs/contact/income-tax-enquiries-for-individuals-pensioners-and-employees" class="govuk-link">Contact a department or service team example</a></li>
<li><a href="http://gov.uk/account" class="govuk-link">GOV.UK Account</a></li>
<li><a href="https://design-system.service.gov.uk/patterns/cookies-page/" class="govuk-link">GOV.UK Design System cookie page</a></li>
<li><a href="https://design-system.service.gov.uk/cookies/" class="govuk-link">GOV.UK Design System cookie page</a></li>
<li><a href="https://govuk-formats.herokuapp.com/document-types/step-by-step-nav" class="govuk-link">Step-by-step navigation example</a></li>
</div>

</div>
</div>
{% endblock %}
{% endblock %}
18 changes: 13 additions & 5 deletions src/govuk/components/exit-this-page/exit-this-page.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -221,13 +221,21 @@ ExitThisPage.prototype.handleKeypress = function (e) {

/**
* Starts the 'quick escape' keyboard sequence timer.
*
* This can be invoked several times. We want this to be possible so that the
* timer is restarted each time the shortcut key is pressed (e.g. the user has
* up to n seconds between each keypress, rather than n seconds to invoke the
* entire sequence.)
*/
ExitThisPage.prototype.setKeypressTimer = function () {
if (this.keypressTimeoutId === null) {
this.keypressTimeoutId = setTimeout(function () {
this.resetKeypressTimer()
}.bind(this), this.timeoutTime)
}
// Clear any existing timeout. This is so only one timer is running even if
// there are multiple keypresses in quick succession.
clearTimeout(this.keypressTimeoutId)

// Set a fresh timeout
this.keypressTimeoutId = setTimeout(function () {
this.resetKeypressTimer()
}.bind(this), this.timeoutTime)
}

/**
Expand Down
24 changes: 12 additions & 12 deletions src/govuk/components/task-list/_index.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,13 +81,13 @@
}

.govuk-task-list__status--light-blue {
color: govuk-shade(govuk-colour("blue"), 60);
background-color: govuk-tint(govuk-colour("blue"), 90);
color: govuk-shade(govuk-colour("blue"), 60%);
background-color: govuk-tint(govuk-colour("blue"), 90%);
}

.govuk-task-list__status--blue {
color: govuk-shade(govuk-colour("blue"), 60);
background-color: govuk-tint(govuk-colour("blue"), 75);
color: govuk-shade(govuk-colour("blue"), 60%);
background-color: govuk-tint(govuk-colour("blue"), 75%);
}

.govuk-task-list__status--text-colour {
Expand All @@ -99,22 +99,22 @@
}

.govuk-task-list__status--purple {
color: govuk-shade(govuk-colour("bright-purple"), 50);
background-color: govuk-tint(govuk-colour("bright-purple"), 85);
color: govuk-shade(govuk-colour("bright-purple"), 50%);
background-color: govuk-tint(govuk-colour("bright-purple"), 85%);
}

.govuk-task-list__status--grey {
color: govuk-shade(govuk-colour("dark-grey", $legacy: "grey-1"), 50);
background-color: govuk-tint(govuk-colour("dark-grey", $legacy: "grey-1"), 85);
color: govuk-shade(govuk-colour("dark-grey", $legacy: "grey-1"), 50%);
background-color: govuk-tint(govuk-colour("dark-grey", $legacy: "grey-1"), 85%);
}

.govuk-task-list__status--pink {
color: govuk-shade(govuk-colour("pink"), 50);
background-color: govuk-tint(govuk-colour("pink"), 85);
color: govuk-shade(govuk-colour("pink"), 50%);
background-color: govuk-tint(govuk-colour("pink"), 85%);
}

.govuk-task-list__status--error {
color: govuk-shade($govuk-error-colour, 80);
background-color: govuk-tint($govuk-error-colour, 75);
color: govuk-shade($govuk-error-colour, 80%);
background-color: govuk-tint($govuk-error-colour, 75%);
}
}

0 comments on commit ceb1a31

Please sign in to comment.