-
Notifications
You must be signed in to change notification settings - Fork 3
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Global Forms #743
Merged
Merged
Global Forms #743
Changes from all commits
Commits
Show all changes
116 commits
Select commit
Hold shift + click to select a range
78db2ac
basic partials architecture
Heydon 20ac21e
error and error icon
Heydon 2076f97
select template
Heydon 22001ac
textarea
Heydon 86624eb
template hierarchy, logo, and BEM
Heydon 6c0745c
classes named after component
Heydon d8c2cdb
renaming and reorganization of partials
Heydon 8a503cc
checkbox input and improved structure
Heydon 0172a8e
basic file upload
Heydon 32ef2f4
basic colors
Heydon 7fe58ee
basic style settings using tokens where applicable
Heydon f970968
legend allowing headings
Heydon 0df4400
initial styling (text inputs)
Heydon 0a2ae35
select and radio styling
Heydon a9f93e1
adds component tokens build step
3b7d7f5
adds default brand global component tokens build step
7d3f87e
adds new aliases
a42f265
adds default footer tokens
79ef9de
updates generated aliases
4594502
adds forms default sass files
b8c7769
global icons and radio secreted fields
Heydon 00a1e6f
adds more borders
3d25034
adds indent to forms
f0c8b70
updates package json to do all global component brands
282d3c7
updates alias compiled sass files
f8ae023
global forms default styles
8cccf4d
missing global brand variant generators
001d91f
fixes if else statement for comment generation in sass files
84121e7
checkboxes
Heydon 5424d49
updates global brands build scripts
447729e
updates brands components build scripts
e9570d5
updates npm scripts
3428227
recreated Sass variables
18ffb33
generated global form default sass
783e4a3
adds SN typography to default
4948316
html/prose field
Heydon 559a8e8
textareas (rows and columns)
Heydon de4f90b
fixes the naming so file headers get printed out
58b25c9
makes one build script for all brands on global components
e959106
updates npm scripts
c818a97
deletes old global component scripts
9c702c9
compiled Sass
18c8028
adds default typography
dd97e2b
tidies up package json
fefc430
tidies up brand components build script
db8a85d
compiled Sass tokens
8b18e6b
more tidying
9b45a92
adds absolute and relative qualifiers for spacing and sizing
05f7c40
updates spacing references to include new qualifiers
03eeec9
updates spacing references to include new qualifiers
51d0ebe
all the recompiled Sass
d77145c
error summary
Heydon b306df8
better tokenage
Heydon 6700dd4
Merge branch 'enhancement/tokens-and-form-tokens' into form-templates
Heydon c95158c
converting global-forms to use tokens
Heydon 13e8046
Merge branch 'master' into form-templates
Heydon 8910c3a
continued
Heydon f2bfd67
continued tokenization
Heydon 863820e
tokenization continued
Heydon fe17f08
changes a few things around and creates alias colour tokens
0e65fcf
changes so font weight is now compiled to Sass variables
98ae6db
updates forms tokens json
479f7c3
adds new compiled brand context sass variables from tokens
21ef59f
adds new compiled brand context sass variables from tokens
8dc80d5
compiled form variables
0a98a84
small changes to _forms.scss that need checking
feec192
pluralises(?) form to forms for sass variable
e52d1c5
demo file created
ffd52a2
rejigging after tokens integration
Heydon 568d4c7
Merge branch 'master' into form-templates
sturobson 82c9599
Merge branch 'master' into form-templates
sturobson df06983
README and versioning
Heydon c0c19d9
buttons field
Heydon 3d2f143
Merge branch 'master' into form-templates
Heydon 6cfb833
Merge branch 'master' into form-templates
Heydon ec355aa
rebuilt tokens
Heydon 395066f
updates tokens to abstract named colors in alias from new numerically…
9f6a436
all the compiled Sass
d41e2e1
changes it so component output uses CSS values
28d8c75
compiled tokens
2a566ff
token regeneration and textarea whitespace removal
Heydon f50cc31
optional text inputs and label for connection
Heydon 929d01c
novalidate
Heydon 48931a5
optional property
Heydon 032d823
improved usage example
Heydon 8c01639
file input in demo
Heydon 61e9e14
updated to latest brand-context dependency
Heydon f892b36
new generated Sass variables from Design Tokens
03f7d5c
grey hint color
Heydon b5ff14a
Merge branch 'form-templates' of github.com:springernature/frontend-t…
Heydon bca5a74
id correction
Heydon 227a922
upgraded brand context dep
Heydon 28a4434
IE11 selector rollback
Heydon bea81fc
reverted logical property temporarily
Heydon 4080e47
radio name tersity
Heydon 630fbaa
tokens audit
Heydon a267c79
springernature and nature brand tweaks
Heydon 56b0cf0
radio spacing
Heydon 9c9cee4
copy change for clarity over select[multiple]
Heydon d7a7085
classes note
Heydon 4750107
revert class stuff
Heydon 446464c
remove legend heading margin, use stacking
Heydon 911b007
stronger legend avice
Heydon 9a99dd9
'type' terminology to 'template'
Heydon 22c3024
versioning
Heydon 18bc17b
README warning
Heydon 94b24cb
chore: add missing trailing semicolon
Heydon f5fd593
colors to three digits
Heydon 5404871
fieldset reference -> fieldsets
Heydon 6054ce4
qualified code syntax
Heydon 47da5df
update sass-lint config to allow for long form hex codes
alexkilgour eb52f4c
Merge branch 'master' into form-templates
aliuk2012 0ab79c1
docs changes, thanks Amy
Heydon 5132d88
Merge branch 'form-templates' of github.com:springernature/frontend-t…
Heydon 29017c0
AMy second pass
Heydon b7ca29b
arbitrary attributes support
Heydon File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| options: | ||
| config-file: ./node_modules/@springernature/sasslint-config/config/.sass-lint.yml | ||
| rules: | ||
| # Design tokens need to be in long form for design tool integration | ||
| # Allow both styles to fit with existing formatting | ||
| hex-length: | ||
| - 2 | ||
| - | ||
| style: off |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_background.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_border.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_breakpoints.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_button.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
33 changes: 33 additions & 0 deletions
33
context/brand-context/default/scss/00-tokens/_color.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--color-white: #ffffff; | ||
| $tokens--color-black: #000000; | ||
| $tokens--color-grayscale-200: #f8f8f8; | ||
| $tokens--color-grayscale-300: #f3f3f3; | ||
| $tokens--color-grayscale-400: #dadada; | ||
| $tokens--color-grayscale-500: #999999; | ||
| $tokens--color-grayscale-600: #666666; | ||
| $tokens--color-grayscale-700: #555555; | ||
| $tokens--color-grayscale-800: #222222; | ||
| $tokens--color-blue-100: #ebf1f5; | ||
| $tokens--color-blue-200: #cedbe0; | ||
| $tokens--color-blue-300: #0088cc; | ||
| $tokens--color-blue-400: #025e8d; | ||
| $tokens--color-blue-700: #003f8d; | ||
| $tokens--color-blue-900: #01324b; | ||
| $tokens--color-primary-universal-dark-blue: #01324b; | ||
| $tokens--color-primary-medium-blue: #025e8d; | ||
| $tokens--color-primary-bright-blue: #0088cc; | ||
| $tokens--color-primary-grey-blue-light-1: #ebf1f5; | ||
| $tokens--color-primary-grey-blue-light-2: #cedbe0; | ||
| $tokens--color-primary-black: #000000; | ||
| $tokens--color-primary-white: #ffffff; | ||
| $tokens--color-information-red: #c40606; | ||
| $tokens--color-information-orange: #f58220; | ||
| $tokens--color-information-blue: #000000; | ||
| $tokens--color-information-green: #00a69d; | ||
| $tokens--color-interaction-hover: #025e8d; | ||
| $tokens--color-interaction-visited: #a345c9; | ||
| $tokens--color-interaction-focus: #ffcc00; |
8 changes: 8 additions & 0 deletions
8
context/brand-context/default/scss/00-tokens/_font-weight.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--font-weight-light: 300; // normal | ||
| $tokens--font-weight-normal: 400; // The normal, or ‘regular’, font weight. | ||
| $tokens--font-weight-regular: 400; // The normal, or ‘regular’, font weight. | ||
| $tokens--font-weight-bold: 700; // The bold font weight. |
7 changes: 7 additions & 0 deletions
7
context/brand-context/default/scss/00-tokens/_icon.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--icon-checkbox-checked-stroke: #ffffff; | ||
| $tokens--icon-checkbox-checked-fill: #01324b; | ||
| $tokens--icon-select-stroke: #000000; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_link.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_sizing.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_spacing.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 3 additions & 3 deletions
6
context/brand-context/default/scss/00-tokens/_state.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,9 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Tue, 28 Jun 2022 10:44:21 GMT | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--state-focus: #0088cc; | ||
| $tokens--state-focus: #ffcc00; | ||
| $tokens--state-error: #c40606; | ||
| $tokens--state-warning: #f58220; | ||
| $tokens--state-success: #00a69d; | ||
| $tokens--state-information: #003f8d; | ||
| $tokens--state-information: #000000; |
2 changes: 1 addition & 1 deletion
2
context/brand-context/default/scss/00-tokens/_text.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
22 changes: 22 additions & 0 deletions
22
context/brand-context/default/scss/00-tokens/_typography.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--typography-heading-font-family: serif; | ||
| $tokens--typography-heading-letter-spacing: 0.2rem; | ||
| $tokens--typography-heading-line-height: 1.2; | ||
| $tokens--typography-heading-level-1-default-font-size: 2.5rem; | ||
| $tokens--typography-heading-level-1-default-font-weight: 400; | ||
| $tokens--typography-heading-level-1-fluid-font-size: clamp(1.875rem, 4vw, 2.5rem); | ||
| $tokens--typography-heading-level-2-default-font-size: 1.875rem; | ||
| $tokens--typography-heading-level-2-default-font-weight: 400; | ||
| $tokens--typography-heading-level-2-fluid-font-size: clamp(1.5rem, 4vw, 1.875rem); | ||
| $tokens--typography-heading-level-3-default-font-size: 1.5rem; | ||
| $tokens--typography-heading-level-3-fluid-font-size: clamp(1.25rem, 4vw, 1.5rem); | ||
| $tokens--typography-heading-level-4-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; | ||
| $tokens--typography-heading-level-4-default-font-size: 1.25rem; | ||
| $tokens--typography-heading-level-4-fluid-font-size: clamp(1.125rem, 4vw, 1.25rem); | ||
| $tokens--typography-heading-level-4-font-weight: 700; | ||
| $tokens--typography-heading-level-5-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; | ||
| $tokens--typography-heading-level-5-font-size: 1.125rem; | ||
| $tokens--typography-heading-level-5-font-weight: 700; | ||
7 changes: 7 additions & 0 deletions
7
context/brand-context/default/scss/00-tokens/_ui.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
|
|
||
| // Do not edit directly | ||
| // Generated on Fri, 01 Jul 2022 16:01:55 GMT | ||
|
|
||
| $tokens--ui-font-size: 1rem; | ||
| $tokens--ui-focus-outline-color: #025e8d; | ||
| $tokens--ui-content-width: 70ch; |
2 changes: 1 addition & 1 deletion
2
context/brand-context/nature/scss/00-tokens/_illustration.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/nature/scss/00-tokens/_typography.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/springer/scss/00-tokens/_typography.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/springernature/scss/00-tokens/_breakpoints.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
context/brand-context/springernature/scss/00-tokens/_typography.variables.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| { | ||
| "color": { | ||
| "primary": { | ||
| "universal-dark-blue": { | ||
| "value": "{color.blue.900}" | ||
| }, | ||
| "medium-blue": { | ||
| "value": "{color.blue.400}" | ||
| }, | ||
| "bright-blue": { | ||
| "value": "{color.blue.300}" | ||
| }, | ||
| "grey-blue-light-1": { | ||
| "value": "{color.blue.100}" | ||
| }, | ||
| "grey-blue-light-2": { | ||
| "value": "{color.blue.200}" | ||
| }, | ||
| "black": { | ||
| "value": "{color.black}" | ||
| }, | ||
| "white": { | ||
| "value": "{color.white}" | ||
| } | ||
| }, | ||
| "information": { | ||
| "red": { | ||
| "value": "#C40606" | ||
| }, | ||
| "orange": { | ||
| "value": "#F58220" | ||
| }, | ||
| "blue": { | ||
| "value": "{color.blue.700" | ||
| }, | ||
| "green": { | ||
| "value": "#00A69D" | ||
| } | ||
| }, | ||
| "interaction": { | ||
| "hover": { | ||
| "value": "{color.blue.400}" | ||
| }, | ||
| "visited": { | ||
| "value": "#A345C9" | ||
| }, | ||
| "focus": { | ||
| "value": "#FFCC00" | ||
| } | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| { | ||
| "icon": { | ||
| "checkbox": { | ||
| "checked": { | ||
| "stroke": { | ||
| "value": "{color.white}" | ||
| }, | ||
| "fill": { | ||
| "value": "{color.primary.universal-dark-blue}" | ||
| } | ||
| } | ||
| }, | ||
| "select": { | ||
| "stroke": { | ||
| "value": "{color.black}" | ||
| } | ||
| } | ||
| } | ||
| } |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What is the fallback for browsers not supporting clamp()? Browser default styles or do we have some sensible defaults?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this isn't really part of this PR, as the design tokens were merged some time ago …
however, the expectation is that these values are implemented (kind of) like they are for Nature (although, I'd suggest not as a variable in a placeholder that's used in a mixin, that's a bit Sass overkill).
I guess the fallback would be [similar to that in Springer Nature where with no fallback provided … a non-supporting browser would (presumably) default to the user agent.
This is why there is the
defaultvalue and thefluidvalue - so there's a fallback.I'll try and work out how to document this to be more explicit (getting Tokens documentation genearated as part of the documentation on the Elements site would help)