diff --git a/CHANGELOG.md b/CHANGELOG.md index ff596028..86652fb0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +## 6.7.0 + +### Improvements + +- Add new "Big" variant of Dropdown component. ([#328](https://github.com/18F/identity-style-guide/pull/328)) + ## 6.6.0 ### Improvements diff --git a/docs/_components/form-fields.md b/docs/_components/form-fields.md index e35814d6..6504e8e6 100644 --- a/docs/_components/form-fields.md +++ b/docs/_components/form-fields.md @@ -96,6 +96,8 @@ Three text fields are the easiest way for users to enter most dates. ## Dropdowns +### Default + {% capture example %} + + + + + +{% endcapture %} +{% include helpers/code-example.html code=example %} + ## Radio buttons Three styles of radio buttons are provided. diff --git a/package-lock.json b/package-lock.json index 58078d3e..8319b78b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "identity-style-guide", - "version": "6.6.0", + "version": "6.7.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "identity-style-guide", - "version": "6.6.0", + "version": "6.7.0", "license": "CC0-1.0", "dependencies": { "domready": "1.0.8", diff --git a/package.json b/package.json index 2a5b6783..a1a20ba9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "identity-style-guide", - "version": "6.6.0", + "version": "6.7.0", "description": "The global style of Login.gov", "main": "./build/cjs/index.js", "module": "./build/esm/index.js", diff --git a/src/scss/elements/form-controls/_all.scss b/src/scss/elements/form-controls/_all.scss index 60237de7..449dfe61 100644 --- a/src/scss/elements/form-controls/_all.scss +++ b/src/scss/elements/form-controls/_all.scss @@ -1,2 +1,3 @@ +@import 'dropdown'; @import 'global'; @import 'text-input'; diff --git a/src/scss/elements/form-controls/_dropdown.scss b/src/scss/elements/form-controls/_dropdown.scss new file mode 100644 index 00000000..d08c5f18 --- /dev/null +++ b/src/scss/elements/form-controls/_dropdown.scss @@ -0,0 +1,6 @@ +.usa-select.usa-select--big { + @include u-padding-x(2); + height: auto; + font-size: 1.25rem; + line-height: 1.5; +} diff --git a/src/scss/elements/form-controls/_text-input.scss b/src/scss/elements/form-controls/_text-input.scss index 955cbd9a..8b300e89 100644 --- a/src/scss/elements/form-controls/_text-input.scss +++ b/src/scss/elements/form-controls/_text-input.scss @@ -1,14 +1,14 @@ -.usa-input--big, -.usa-textarea--big { +.usa-input.usa-input--big, +.usa-textarea.usa-textarea--big { font-size: units(2.5); line-height: 1.5; } -.usa-input--big { +.usa-input.usa-input--big { @include u-padding-x(2); height: auto; } -.usa-textarea--big { +.usa-textarea.usa-textarea--big { height: 15rem; }