Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/simonwhatley/nhsuk-visual-studio-code-extension
This extension for Visual Studio Code includes snippets to help build the UK's NHS digital services.
https://github.com/simonwhatley/nhsuk-visual-studio-code-extension
extension nhsuk 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 the UK's NHS digital services.
- Host: GitHub
- URL: https://github.com/simonwhatley/nhsuk-visual-studio-code-extension
- Owner: simonwhatley
- License: mit
- Created: 2020-05-04T20:29:31.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2023-10-06T09:40:38.000Z (about 1 year ago)
- Last Synced: 2023-10-06T16:39:07.164Z (about 1 year ago)
- Topics: extension, nhsuk, nunjucks, snippets, visual-studio-code, vscode, vscode-extension
- Homepage: https://marketplace.visualstudio.com/items?itemName=simonwhatley.nhsuk-design-system-snippets
- Size: 159 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
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 NHS.UK Visual Studio Code extension
This extension for Visual Studio Code includes snippets to help in building the UK's NHS digital services.
## Available snippets
### Styles
#### Layout
|Name|Shortcut|Notes|
|-------------------------|-------------------------|---|
|Form group|`nhsuk-form-group`||
|Form section|`nhsuk-form-section`||
|[Grid column full](https://service-manual.nhs.uk/design-system/styles/layout/#full-width)|`nhsuk-grid-column-full`||
|[Grid column one-half](https://service-manual.nhs.uk/design-system/styles/layout/#one-half)|`nhsuk-grid-column-one-half`||
|[Grid column one-quarter](https://service-manual.nhs.uk/design-system/styles/layout/#one-quarter)|`nhsuk-grid-column-one-quarter`||
|[Grid column one-third](https://service-manual.nhs.uk/design-system/styles/layout/#one-third)|`nhsuk-grid-column-one-third`||
|[Grid column two-thirds](https://service-manual.nhs.uk/design-system/styles/layout/#two-thirds)|`nhsuk-grid-column-two-thirds`||
|[Grid column](https://service-manual.nhs.uk/design-system/styles/layout/)|`nhsuk-grid-column`||
|[Grid row](https://service-manual.nhs.uk/design-system/styles/layout/)|`nhsuk-grid-row`||
|[Layout one-third / two-thirds](https://service-manual.nhs.uk/design-system/styles/layout/#two-thirds-one-third)|`nhsuk-layout-one-third-two-thirds`||
|[Layout two-thirds / one-third](https://service-manual.nhs.uk/design-system/styles/layout/#two-thirds-one-third)|`nhsuk-layout-two-thirds-one-third`||#### Typography
|Name|Shortcut|Notes|
|-------------------------|-------------------------|---|
|Caption|`nhsuk-caption`||
|[Font size override](https://service-manual.nhs.uk/design-system/styles/typography/#font-size)|`nhsuk-font-size`||
|[Font weight override](https://service-manual.nhs.uk/design-system/styles/typography/#font-weight)|`nhsuk-font-weight`||
|[Heading](https://service-manual.nhs.uk/design-system/styles/typography/#headings)|`nhsuk-heading`||
|[Links](https://service-manual.nhs.uk/design-system/styles/typography/#links)|`nhsuk-link`||
|[Lists](https://service-manual.nhs.uk/design-system/styles/typography/#lists)|`nhsuk-list`||
|[Lists – Bulleted](https://service-manual.nhs.uk/design-system/styles/typography/#bulleted-lists)|`nhsuk-list-bulleted`||
|[Lists – Numbered](https://service-manual.nhs.uk/design-system/styles/typography/#numbered-lists)|`nhsuk-list-numbered`||
|[Paragraph body text](https://service-manual.nhs.uk/design-system/styles/typography/#body)|`nhsuk-paragraph-body`||
|[Paragraph body text large](https://service-manual.nhs.uk/design-system/styles/typography/#lead-paragraph)|`nhsuk-paragraph-body-lead`||
|[Paragraph body text small](https://service-manual.nhs.uk/design-system/styles/typography/#body-small)|`nhsuk-paragraph-body-small`||
|[Section break](https://service-manual.nhs.uk/design-system/styles/typography/#section-break)|`nhsuk-section-break`||
|Visually hidden|`nhsuk-visually-hidden`|Creates a visually hidden `span`|### Components
#### Form elements
|Name|Shortcut|Notes|
|-------------------------|-------------------------|---|
|Addresses|`nhsuk-address`||
|Bank details|`nhsuk-bank-details`||
|[Button](https://service-manual.nhs.uk/design-system/components/button/)|`nhsuk-button`||
|[Character count](https://service-manual.nhs.uk/design-system/components/character-count)|`nhsuk-character-count`||
|[Checkboxes](https://service-manual.nhs.uk/design-system/components/checkboxes/)|`nhsuk-checkboxes`||
|Checkbox or radio option|`nhsuk-option`|Use in conjunction with the `nhsuk-checkboxes` and `nhsuk-radios` Nunjucks snippets.|
|[Date input](https://service-manual.nhs.uk/design-system/components/date-input/)|`nhsuk-date`||
|Email address|`nhsuk-email`||
|[Error summary](https://service-manual.nhs.uk/design-system/components/error-summary/)|`nhsuk-error-summary`||
|[Fieldset](https://service-manual.nhs.uk/design-system/components/fieldset/)|`nhsuk-fieldset`||
|National insurance number|`nhsuk-nino`||
|[Radios](https://service-manual.nhs.uk/design-system/components/radios/)|`nhsuk-radios`||
|[Select](https://service-manual.nhs.uk/design-system/components/select/)|`nhsuk-select`||
|Select option|`nhsuk-select-option`|Use in conjunction with the `nhsuk-select` Nunjucks snippet.|
|Telephone number|`nhsuk-telephone`||
|[Text input](https://service-manual.nhs.uk/design-system/components/text-input/)|`nhsuk-input`||
|[Textarea](https://service-manual.nhs.uk/design-system/components/textarea/)|`nhsuk-textarea`||#### Content presentation
|Name|Shortcut|Notes|
|-------------------------|-------------------------|---|
|[Care cards](https://service-manual.nhs.uk/design-system/patterns/help-users-decide-when-and-where-to-get-care)|`nhsuk-care-card`||
|[Details](https://service-manual.nhs.uk/design-system/components/details/)|`nhsuk-details`||
|[Do and don’t lists](https://service-manual.nhs.uk/design-system/components/do-and-dont-lists/)|`nhsuk-do-dont-list`||
|[Expander](https://service-manual.nhs.uk/design-system/components/expander/)|`nhsuk-expander`||
|[Images](https://service-manual.nhs.uk/design-system/components/images/)|`nhsuk-image`||
|[Inset text](https://service-manual.nhs.uk/design-system/components/inset-text/)|`nhsuk-inset-text`||
|[Summary list](https://service-manual.nhs.uk/design-system/components/summary-list)|`nhsuk-summary-list`||
|[Table](https://service-manual.nhs.uk/design-system/components/table/)|`nhsuk-table`||
|[Tabs](https://service-manual.nhs.uk/design-system/components/tabs/)|`nhsuk-tabs`||
|Tab item HTML|`nhsuk-tab-item`|Use in conjunction with the `nhsuk-tabs` snippet. This snippet can be used to encapsulate a tab panel.|
|[Tag](https://service-manual.nhs.uk/design-system/components/tag/)|`nhsuk-tag`||
|[Warning callout](https://service-manual.nhs.uk/design-system/components/warning-callout/)|`nhsuk-warning-callout`||#### Navigation
|Name|Shortcut|Notes|
|-------------------------|-------------------------|---|
|[Action link](https://service-manual.nhs.uk/design-system/components/action-link/)|`nhsuk-action-link`||
|[Back link](https://service-manual.nhs.uk/design-system/components/back-link/)|`nhsuk-back-link`||
|[Breadcrumbs](https://service-manual.nhs.uk/design-system/components/breadcrumbs/)|`nhsuk-breadcrumbs`||
|[Contents list](https://service-manual.nhs.uk/design-system/components/contents-list/)|`nhsuk-contents-list`||
|[Footer](https://service-manual.nhs.uk/design-system/components/footer/)|`nhsuk-footer`||
|[Header](https://service-manual.nhs.uk/design-system/components/header/)|`nhsuk-header`||
|[Pagination](https://service-manual.nhs.uk/design-system/components/pagination/)|`nhsuk-pagination`||
|[Skip link](https://service-manual.nhs.uk/design-system/components/skip-link/)|`nhsuk-skip-link`||## Dependencies
Using this extension depends on the installation of the [NHS.UK Frontend](https://www.npmjs.com/package/nhsuk-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/nhsuk-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/nhsuk-visual-studio-code-extension/issues).## Licence
Unless otherwise stated, this codebase is released under the [MIT License](https://github.com/simonwhatley/nhsuk-visual-studio-code-extension/blob/master/LICENSE). This covers both the codebase and any sample code in the documentation.