| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 | <!DOCTYPE html><html><head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>The source code</title>  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>  <style type="text/css">    .highlight { display: block; background-color: #ddd; }  </style>  <script type="text/javascript">    function highlight() {      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";    }  </script></head><body onload="prettyPrint(); highlight();">  <pre class="prettyprint lang-js"><span id='Ext-form-field-File-css_mixin-extjs-form-file'>/**</span> * Creates the base structure of file field. * @member Ext.form.field.File */@mixin extjs-form-file {    .#{$prefix}form-file-wrap {        .#{$prefix}form-text {            color: #777;        }        .#{$prefix}form-file-btn {            overflow: hidden;        }        .#{$prefix}form-file-input {            position: absolute;            top: -4px;            right: -2px;            height: $form-field-height + 8;            @include opacity(0);            /* Yes, there's actually a good reason for this...             * If the configured buttonText is set to something longer than the default,             * then it will quickly exceed the width of the hidden file input's "Browse..."             * button, so part of the custom button's clickable area will be covered by             * the hidden file input's text box instead. This results in a text-selection             * mouse cursor over that part of the button, at least in Firefox, which is             * confusing to a user. Giving the hidden file input a huge font-size makes             * the native button part very large so it will cover the whole clickable area.             */            font-size: 100px;        }    }}</pre></body></html>
 |