govuk-frontend
Version:
GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.
2 lines (1 loc) • 2.24 kB
Source Map (JSON)
{"version":3,"sources":["../../../../src/govuk/components/file-upload/_index.scss"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,uBAAuB;AACvB,wBAAwB;;AAExB;EACE,oCAAoC;;EAEpC;IACE,8BAA8B;IAC9B,0BAA0B;IAC1B,eAAe;IACf,gCAAgC;IAChC,2BAA2B;;IAE3B,qEAAqE;IACrE,2EAA2E;IAC3E,mDAAmD;IACnD,6BAA6B;IAC7B;MACE,0BAA0B;MAC1B,cAAc;MACd,aAAa;IACf;;IAEA;MACE,qDAAqD;MACrD,mEAAmE;MACnE,sEAAsE;MACtE,yBAAyB;MACzB,sDAAsD;IACxD;;IAEA,uEAAuE;IACvE,4BAA4B;IAC5B,qEAAqE;IACrE,qEAAqE;IACrE,uBAAuB;IACvB;MACE,qDAAqD;;MAErD,sDAAsD;IACxD;;IAEA;MACE,YAAY;MACZ,mBAAmB;IACrB;EACF;AACF","file":"_index.scss","sourcesContent":["@import \"../error-message/index\";\n@import \"../hint/index\";\n@import \"../label/index\";\n\n@include govuk-exports(\"govuk/component/file-upload\") {\n $component-padding: govuk-spacing(1);\n\n .govuk-file-upload {\n @include govuk-font($size: 19);\n @include govuk-text-colour;\n max-width: 100%;\n margin-left: -$component-padding;\n padding: $component-padding;\n\n // The default file upload button in Safari does not support setting a\n // custom font-size. Set `-webkit-appearance` to `button` to drop out of the\n // native appearance so the font-size is set to 19px\n // https://webkit.org/b/224746\n &::-webkit-file-upload-button {\n -webkit-appearance: button;\n color: inherit;\n font: inherit;\n }\n\n &:focus {\n outline: $govuk-focus-width solid $govuk-focus-colour;\n // Use `box-shadow` to add border instead of changing `border-width`\n // (which changes element size) and since `outline` is already used for\n // the yellow focus state.\n box-shadow: inset 0 0 0 4px $govuk-input-border-colour;\n }\n\n // Set \"focus-within\" to fix https://bugzil.la/1430196 so that component\n // receives focus in Firefox.\n // This can't be set together with `:focus` as all versions of IE fail\n // to recognise `focus-within` and don't set any styles from the block\n // when it's a selector.\n &:focus-within {\n outline: $govuk-focus-width solid $govuk-focus-colour;\n\n box-shadow: inset 0 0 0 4px $govuk-input-border-colour;\n }\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n }\n}\n"]}