diff options
| author | Mark Otto <[email protected]> | 2016-02-13 17:54:40 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2016-02-13 17:54:40 -0800 |
| commit | 4724110583a9118ca0b811b303a18981d721d620 (patch) | |
| tree | 1668cb66e22a0b2221fc6aa0810624d742b93a5b /docs | |
| parent | d7d32c475f688b75d84fe3588d7b3e5b84c6396c (diff) | |
| parent | 095da95fdaaead873aadeab561def60997983e4f (diff) | |
| download | bootstrap-4724110583a9118ca0b811b303a18981d721d620.tar.xz bootstrap-4724110583a9118ca0b811b303a18981d721d620.zip | |
Merge branch 'v4-dev' of https://github.com/twbs/bootstrap into v4-dev
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/_data/browser-bugs.yml | 20 | ||||
| -rw-r--r-- | docs/components/forms.md | 19 |
2 files changed, 19 insertions, 20 deletions
diff --git a/docs/_data/browser-bugs.yml b/docs/_data/browser-bugs.yml index a610d1b56..0a52d6c92 100644 --- a/docs/_data/browser-bugs.yml +++ b/docs/_data/browser-bugs.yml @@ -72,26 +72,6 @@ browser: > Firefox summary: > - `max-width: 100%;` doesn't work inside tables. - upstream_bug: > - Mozilla#975632 - origin: > - Bootstrap#10690 - -- - browser: > - Firefox - summary: > - Button elements with `width: 100%` become cropped in long tables. - upstream_bug: > - Mozilla#1060131 - origin: > - Bootstrap#14320 - -- - browser: > - Firefox - summary: > If the disabled state of a form control is changed via JavaScript, the normal state doesn't return after refreshing the page. upstream_bug: > Mozilla#654072 diff --git a/docs/components/forms.md b/docs/components/forms.md index a7ce4062c..0028c2b85 100644 --- a/docs/components/forms.md +++ b/docs/components/forms.md @@ -819,3 +819,22 @@ Here's how it works: - We declare a `height` on the `<input>` for proper spacing for surrounding content. In other words, it's an entirely custom element, all generated via CSS. + +#### Translating or customizing the strings + +The [`:lang()` pseudo-class](https://developer.mozilla.org/en-US/docs/Web/CSS/:lang) is used to allow for easy translation of the "Browse" and "Choose file..." text into other languages. Simply override or add entries to the `$custom-file-text` SCSS variable with the relevant [language tag](https://en.wikipedia.org/wiki/IETF_language_tag) and localized strings. The English strings can be customized the same way. For example, here's how one might add a Spanish translation (Spanish's language code is `es`): + +{% highlight scss %} +$custom-file-text: ( + placeholder: ( + en: "Choose file...", + es: "Seleccionar archivo..." + ), + button-label: ( + en: "Browse", + es: "Navegar" + ) +); +{% endhighlight %} + +You'll need to set the language of your document (or subtree thereof) correctly in order for the correct text to be shown. This can be done using [the `lang` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang) or the [`Content-Language` HTTP header](https://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.12), among other methods. |