Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/simonwhatley/govuk-visual-studio-code-extension

This extension for Visual Studio Code includes snippets to help build UK Government digital services.
https://github.com/simonwhatley/govuk-visual-studio-code-extension

design design-system extension govuk nunjucks snippets visual-studio-code vscode vscode-extension

Last synced: about 1 month ago
JSON representation

This extension for Visual Studio Code includes snippets to help build UK Government digital services.

Host: GitHub
URL: https://github.com/simonwhatley/govuk-visual-studio-code-extension
Owner: simonwhatley
License: mit
Created: 2020-04-25T16:23:46.000Z (over 4 years ago)
Default Branch: main
Last Pushed: 2023-10-21T15:28:03.000Z (about 1 year ago)
Last Synced: 2023-10-21T16:31:51.747Z (about 1 year ago)
Topics: design, design-system, extension, govuk, nunjucks, snippets, visual-studio-code, vscode, vscode-extension
Homepage: https://marketplace.visualstudio.com/items?itemName=simonwhatley.govuk-design-system-snippets
Size: 225 KB
Stars: 3
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        # About the GOV.UK Visual Studio Code extension

This extension for Visual Studio Code includes snippets to help in the building of UK Government digital services.

## Available snippets

### Styles

#### Layout

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Form group](https://design-system.service.gov.uk/)|`govuk-form-group`||

|[Form section](https://design-system.service.gov.uk/)|`govuk-form-section`||

|[Grid column full](https://design-system.service.gov.uk/styles/layout/#full-width)|`govuk-grid-column-full`||

|[Grid column one-half](https://design-system.service.gov.uk/styles/layout/#one-half)|`govuk-grid-column-one-half`||

|[Grid column one-quarter](https://design-system.service.gov.uk/styles/layout/#one-quarter)|`govuk-grid-column-one-quarter`||

|[Grid column one-third](https://design-system.service.gov.uk/styles/layout/#one-third)|`govuk-grid-column-one-third`||

|[Grid column two-thirds](https://design-system.service.gov.uk/styles/layout/#two-thirds)|`govuk-grid-column-two-thirds`||

|[Grid column](https://design-system.service.gov.uk/styles/layout/)|`govuk-grid-column`||

|[Grid row](https://design-system.service.gov.uk/styles/layout/)|`govuk-grid-row`||

|[Layout one-third / two-thirds](https://design-system.service.gov.uk/styles/layout/#two-thirds-one-third)|`govuk-layout-one-third-two-thirds`||

|[Layout two-thirds / one-third](https://design-system.service.gov.uk/styles/layout/#two-thirds-one-third)|`govuk-layout-two-thirds-one-third`||

#### Typography

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Caption](https://design-system.service.gov.uk/styles/typography/#headings-with-captions)|`govuk-caption`||

|[Font size override](https://design-system.service.gov.uk/styles/typography/#font-size)|`govuk-font-size`||

|[Font weight override](https://design-system.service.gov.uk/styles/typography/#font-weight)|`govuk-font-weight`||

|[Heading](https://design-system.service.gov.uk/styles/typography/#headings)|`govuk-heading`||

|Link item|`govuk-link-item`||

|[Links](https://design-system.service.gov.uk/styles/typography/#links)|`govuk-link`||

|[Lists](https://design-system.service.gov.uk/styles/typography/#lists)|`govuk-list`||

|[lists – Bulleted](https://design-system.service.gov.uk/styles/typography/#bulleted-lists)|`govuk-list-bulleted`||

|[lists – Numbered](https://design-system.service.gov.uk/styles/typography/#numbered-lists)|`govuk-list-numbered`||

|[Paragraph body text](https://design-system.service.gov.uk/styles/typography/#body)|`govuk-paragraph-body`||

|[Paragraph body text large](https://design-system.service.gov.uk/styles/typography/#lead-paragraph)|`govuk-paragraph-body-lead`||

|[Paragraph body text small](https://design-system.service.gov.uk/styles/typography/#body-small)|`govuk-paragraph-body-small`||

|[Section break](https://design-system.service.gov.uk/styles/typography/#section-break)|`govuk-section-break`||

|Visually hidden|`govuk-visually-hidden`|Creates a visually hidden `span`|

### Components

#### Form elements

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Addresses](https://design-system.service.gov.uk/patterns/addresses/)|`govuk-address`||

|[Bank details](https://design-system.service.gov.uk/patterns/bank-details/)|`govuk-bank-details`||

|[Button](https://design-system.service.gov.uk/components/button/)|`govuk-button`||

|[Character count](https://design-system.service.gov.uk/components/character-count/)|`govuk-character-count`||

|[Checkboxes](https://design-system.service.gov.uk/components/checkboxes/)|`govuk-checkboxes`||

|Checkbox or radio option|`govuk-option`|Use in conjunction with the `govuk-checkboxes` and `govuk-radios` Nunjucks snippets.|

|[Currency input](https://design-system.service.gov.uk/components/text-input/#prefixes-and-suffixes)|`govuk-currency-input`||

|[Dates](https://design-system.service.gov.uk/components/date-input/)|`govuk-date`||

|[Email address](https://design-system.service.gov.uk/patterns/email-addresses/)|`govuk-email`||

|[Error summary](https://design-system.service.gov.uk/components/error-summary/)|`govuk-error-summary`||

|[Fieldset](https://design-system.service.gov.uk/components/fieldset/)|`govuk-fieldset`||

|[File upload](https://design-system.service.gov.uk/components/file-upload/)|`govuk-file`||

|[National Insurance Number (NINO)](https://design-system.service.gov.uk/patterns/national-insurance-numbers/)|`govuk-nino`||

|[Radios](https://design-system.service.gov.uk/components/radios/)|`govuk-radios`||

|[Select](https://design-system.service.gov.uk/components/select/)|`govuk-select`||

|Select option|`govuk-select-option`|Use in conjunction with the `govuk-select` Nunjucks snippet.|

|[Telephone number](https://design-system.service.gov.uk/patterns/telephone-numbers/)|`govuk-telephone`||

|[Text input](https://design-system.service.gov.uk/components/text-input/)|`govuk-input`||

|[Textarea](https://design-system.service.gov.uk/components/textarea/)|`govuk-textarea`||

#### Content presentation

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Accordion](https://design-system.service.gov.uk/components/accordion/)|`govuk-accordion`||

|[Details](https://design-system.service.gov.uk/components/details/)|`govuk-details`||

|[Inset text](https://design-system.service.gov.uk/components/inset-text/)|`govuk-inset-text`||

|[Notification banner](https://design-system.service.gov.uk/components/notification-banner/)|`govuk-notification-banner`||

|[Panels](https://design-system.service.gov.uk/components/panel/)|`govuk-panel`||

|[Phase banner](https://design-system.service.gov.uk/components/phase-banner/)|`govuk-phase-banner`||

|[Summary list](https://design-system.service.gov.uk/components/summary-list/)|`govuk-summary-list`||

|[Tables](https://design-system.service.gov.uk/components/table/)|`govuk-table`||

|[Tabs](https://design-system.service.gov.uk/components/tabs/)|`govuk-tabs`||

|Tab item HTML|`govuk-tab-item`|Use in conjunction with the `govuk-tabs` snippet. This snippet can be used to encapsulate a tab panel.|

|[Tags](https://design-system.service.gov.uk/components/tag/)|`govuk-tag`||

|[Warning text](https://design-system.service.gov.uk/components/warning-text/)|`govuk-warning-text`||

#### Navigation

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Back link](https://design-system.service.gov.uk/components/back-link/)|`govuk-back-link`||

|[Breadcrumbs](https://design-system.service.gov.uk/components/breadcrumbs/)|`govuk-breadcrumbs`||

|[Exit this page](https://design-system.service.gov.uk/components/exit-this-page/)|`govuk-exit-page`||

|[Footer](https://design-system.service.gov.uk/components/footer/)|`govuk-footer`||

|[Header](https://design-system.service.gov.uk/components/header/)|`govuk-header`||

|[Pagination](https://design-system.service.gov.uk/components/pagination/)|`govuk-pagination`||

|[Previous/next navigation](https://design-system.service.gov.uk/components/pagination/)|`govuk-previous-next`||

|[Skip link](https://design-system.service.gov.uk/components/skip-link/)|`govuk-skip-link`||

#### Miscellaneous

|Name|Shortcut|Notes|

|-------------------------|-------------------------|---|

|[Cookie banner](https://design-system.service.gov.uk/components/cookie-banner/)|`govuk-cookie-banner`||

## Dependencies

Using this extension depends on the installation of the [GOV.UK Frontend](https://www.npmjs.com/package/govuk-frontend) and [Nunjucks](https://www.npmjs.com/package/nunjucks) into your project.

## Support

This repository is maintained by Simon Whatley. If you’ve got a question or need support you can:

- Email [email protected] putting the repository name in the subject line.

- [View known issues on GitHub](https://github.com/simonwhatley/govuk-visual-studio-code-extension/issues).

## Contributing

If you’ve got an idea or suggestion you can:

- Email [email protected] putting the repository name in the subject line.

- [Create a GitHub issue](https://github.com/simonwhatley/govuk-visual-studio-code-extension/issues).

## Licence

Unless otherwise stated, this codebase is released under the [MIT License](https://github.com/simonwhatley/govuk-visual-studio-code-extension/blob/master/LICENSE). This covers both the codebase and any sample code in the documentation.