Skip to content

Commit

Permalink
Remove border from file upload error state
Browse files Browse the repository at this point in the history
Align the error state of the file input component to that of radios / checkboxes, where the error state is indicated by the red left-hand border on the form group and the error message.
  • Loading branch information
Chris Thomas authored and 36degrees committed Jul 17, 2020
1 parent 6bdca06 commit 2bde81d
Showing 1 changed file with 0 additions and 23 deletions.
23 changes: 0 additions & 23 deletions src/govuk/components/file-upload/_index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -47,27 +47,4 @@
box-shadow: inset 0 0 0 4px $govuk-input-border-colour;
}
}

.govuk-file-upload--error {
// As `upload--error` has border, it needs to have the same padding as
// the standard focused element.
margin-right: -$component-padding;
margin-left: -$component-padding;
padding-right: $component-padding;
padding-left: $component-padding;
border: $govuk-border-width-form-element-error solid $govuk-error-colour;

&:focus {
border-color: $govuk-input-border-colour;
}

// Repeat `:focus` styles to prevent error styles from being applied when
// input button is pressed as this moves the focus to "within".
// This can't be set together with `:focus` as all versions of IE fail
// to recognise `focus-within` and don't set any styles from the block
// when it's a selector.
&:focus-within {
border-color: $govuk-input-border-colour;
}
}
}

0 comments on commit 2bde81d

Please sign in to comment.