https://github.com/alphagov/govuk_elements
❗️GOV.UK Elements is deprecated, and will only receive major bug fixes and security patches.
https://github.com/alphagov/govuk_elements
deprecated govuk-design-system-team govuk-frontend portfolio
Last synced: 5 months ago
JSON representation
❗️GOV.UK Elements is deprecated, and will only receive major bug fixes and security patches.
- Host: GitHub
- URL: https://github.com/alphagov/govuk_elements
- Owner: alphagov
- License: mit
- Created: 2014-03-19T11:29:16.000Z (about 11 years ago)
- Default Branch: master
- Last Pushed: 2021-09-14T12:54:25.000Z (over 3 years ago)
- Last Synced: 2024-11-11T17:49:50.039Z (5 months ago)
- Topics: deprecated, govuk-design-system-team, govuk-frontend, portfolio
- Language: HTML
- Homepage: https://govuk-elements.herokuapp.com/
- Size: 16.7 MB
- Stars: 227
- Watchers: 97
- Forks: 90
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.txt
Awesome Lists containing this project
README
The GOV.UK Design System launched on 22 June 2018
===============
GOV.UK Elements:
- is no longer maintained
- will only be updated for major bug fixes and security patches
- does not meet the [Web Content Accessibility Guidelines (WCAG 2.1 level AA) accessibility standard](https://www.gov.uk/guidance/accessibility-requirements-for-public-sector-websites-and-apps#meeting-accessibility-requirements)
This framework will remain available in case you’re currently using it. To help your service meet accessibility requirements, you should use the [GOV.UK Design System](https://design-system.service.gov.uk/). You can [migrate to the Design System from GOV.UK Elements](https://frontend.design-system.service.gov.uk/migrating-from-legacy-products/).
GOV.UK elements ·
[](https://standardjs.com)
[](https://greenkeeper.io/)
===============
GOV.UK elements is three things:
1. [An online design guide](https://govuk-elements.herokuapp.com/), explaining how to make your service look consistent with the rest of GOV.UK.
2. An example of how to use the code in the [GOV.UK template](https://github.com/alphagov/govuk_template) and the [GOV.UK frontend toolkit](https://github.com/alphagov/govuk_frontend_toolkit).
3. An [npm package of the Sass files](https://www.npmjs.com/package/govuk-elements-sass).
# GOV.UK elements guide
[https://govuk-elements.herokuapp.com/](https://govuk-elements.herokuapp.com/).
# Using govuk-elements-sass
Installation and usage instructions can be found in the govuk-elements-sass [README](https://github.com/alphagov/govuk_elements/blob/master/packages/govuk-elements-sass/README.md).
## Running this site locally
If you would like to clone the repository and run it locally,
you will need [Node.js](https://nodejs.org/) (at least version v0.10.0).
Clone this repository
git clone [email protected]:alphagov/govuk_elements.git
Install all dependencies
npm install
Run the app
npm start
Go to [localhost:3000](http://localhost:3000) in your browser.
## Running tests
To check the whole codebase, run:
npm test
## Linting
### GOV.UK lint
[GOV.UK elements uses govuk-lint](https://github.com/alphagov/govuk-lint#sass), which uses [scss-lint](https://github.com/brigade/scss-lint) as its scss linter.
### Standard JavaScript
GOV.UK elements uses [standardjs](https://standardjs.com/), an opinionated JavaScript linter. All JavaScript files follow its conventions.
Both linters run on CI to ensure that new pull requests are in line with them.
## Running Wraith to compare changes
GOV.UK elements uses Wraith so that regressions can be easily spotted.
This needs to be run from the Wraith directory `/tests/wraith` and some dependencies need to be installed on the local machine first.
1. Install Wraith and its dependencies.
gem install wraith
brew install phantomjs
brew install imagemagick
2. Take a baseline of the current version.
On master run:
wraith history config.yaml
3. Switch to your feature branch and make changes.
On your feature branch run:
wraith latest config.yaml
## Releasing a new version
Follow the instructions in [CONTRIBUTING.md](https://github.com/alphagov/govuk_elements/blob/master/CONTRIBUTING.md).
## Pattern libraries using GOV.UK elements
Here are examples of service-specific pattern libraries using GOV.UK elements.
* [Rural Payments style guide](http://rural-payments-styleguide.herokuapp.com) | [Source Code](https://github.com/Defra/rural-payments-styleguide/)
* [Land Registry pattern library](http://land-registry-elements.herokuapp.com) | [Source Code](https://github.com/LandRegistry/land-registry-elements)
* [Digital Marketplace frontend toolkit](http://alphagov.github.io/digitalmarketplace-frontend-toolkit/) | [Source Code](https://github.com/alphagov/digitalmarketplace-frontend-toolkit)
## Contributing
You can find contribution guidelines in [CONTRIBUTING.md](https://github.com/alphagov/govuk_elements/blob/master/CONTRIBUTING.md)