projects / extjs.git / blame
| Commit | Line | Data |
|---|---|---|
| 6527f429 DM |
1 | .#{$prefix}form-file-btn {\r |
| 2 | overflow: hidden;\r | |
| 3 | position: relative;\r | |
| 4 | }\r | |
| 5 | \r | |
| 6 | .#{$prefix}form-file-input {\r | |
| 7 | border: 0; // disables the focus border in old IE\r | |
| 8 | position: absolute;\r | |
| 9 | cursor: pointer;\r | |
| 10 | \r | |
| 11 | top: 0;\r | |
| 12 | right: 0;\r | |
| 13 | width: 100%;\r | |
| 14 | height: 100%;\r | |
| 15 | overflow: hidden;\r | |
| 16 | \r | |
| 17 | @include opacity(0);\r | |
| 18 | \r | |
| 19 | /* Yes, there's actually a good reason for this...\r | |
| 20 | * If the configured buttonText is set to something longer than the default,\r | |
| 21 | * then it will quickly exceed the width of the hidden file input's "Browse..."\r | |
| 22 | * button, so part of the custom button's clickable area will be covered by\r | |
| 23 | * the hidden file input's text box instead. This results in a text-selection\r | |
| 24 | * mouse cursor over that part of the button, at least in Firefox, which is\r | |
| 25 | * confusing to a user. Giving the hidden file input a huge font-size makes\r | |
| 26 | * the native button part very large so it will cover the whole clickable area.\r | |
| 27 | */\r | |
| 28 | font-size: 1000px;\r | |
| 29 | }\r | |
| 30 | \r | |
| 31 | @if $include-rtl {\r | |
| 32 | .#{$prefix}rtl.#{$prefix}form-file-input {\r | |
| 33 | right: auto;\r | |
| 34 | left: 0;\r | |
| 35 | }\r | |
| 36 | }\r |