Ignore:
Timestamp:
2 Apr 2014, 09:58:39 (11 years ago)
Author:
Henrik Bettermann
Message:

File input fields brought into shape with Bootstrap 3. Technique adapted from ​http://labs.abeautifulsite.net/demos/bootstrap-file-inputs/.

Location:
main/waeup.kofa/trunk/src/waeup/kofa
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • main/waeup.kofa/trunk/src/waeup/kofa/applicants/browser_templates/applicanteditpage.pt

    r11254 r11558  
    2828        <td>
    2929          <img src="passport.jpg" height="180px" /><br />
    30           <input type="file" name="form.passport" />
    3130          <br />
     31                <div class="input-group half">
     32                        <div class="input-group-btn">
     33                                <div class="btn btn-default btn-file">
     34                Select&hellip;
     35                <input type="file" name="form.passport" />
     36              </div>
     37                        </div>
     38                        <input type="text" class="form-control" readonly>
     39          </div>
    3240          <span i18n:translate="">
    3341            Max. file size:

  • main/waeup.kofa/trunk/src/waeup/kofa/browser/templates/datacenteruploadpage.pt

    r11254 r11558  
    1616      </td>
    1717      <td>
    18         <input type="file" size=47 name="uploadfile:file" />
     18                <div class="input-group half">
     19                        <div class="input-group-btn">
     20                                <div class="btn btn-default btn-file">
     21              Select&hellip;
     22              <input type="file" name="uploadfile:file" />
     23            </div>
     24                        </div>
     25                        <input type="text" class="form-control" readonly>
     26        </div>
    1927      </td>
    2028    </tr>

  • main/waeup.kofa/trunk/src/waeup/kofa/browser/templates/fileupload.pt

    r11254 r11558  
    44  </td>
    55  <td>
     6
     7                <div class="input-group">
     8                        <div class="input-group-btn">
     9                                <div class="btn btn-default btn-file">
     10          Select new file&hellip;
     11          <input type="file" tal:attributes="name viewlet/input_name" />
     12        </div>
     13                        </div>
     14                        <input type="text" class="form-control" readonly>
     15      <div class="input-group-btn">
     16        <input type="submit"
     17               tal:attributes="id python:('upload_%s' % viewlet.input_name);
     18                name python:('upload_%s' % viewlet.input_name);
     19                value viewlet/upload_button"
     20               class="btn btn-primary" />
     21        (<span tal:replace="viewlet/max_upload_size">10 kB</span> max.)
     22      </div>
     23    </div>
     24
    625    <tal:file tal:condition="viewlet/file_exists">
     26      <br />
     27      <input type="submit"
     28             tal:attributes="id python:('delete_%s' % viewlet.input_name);
     29                name python:('delete_%s' % viewlet.input_name);
     30                value viewlet/delete_button"
     31             class="btn btn-danger" />&nbsp;
    732      <a tal:attributes="href python: view.url(context, viewlet.download_name)"
    833         tal:content="viewlet/title"
    … …  
    1136      </a>
    1237    </tal:file>
    13     <input type="file" tal:attributes="name viewlet/input_name"/>
    14     <br />
    15     <input type="submit" tal:condition="viewlet/file_exists"
    16            tal:attributes="id python:('delete_%s' % viewlet.input_name);
    17               name python:('delete_%s' % viewlet.input_name);
    18               value viewlet/delete_button"
    19            class="btn btn-danger" />
    20     <input type="submit"
    21              tal:attributes="id python:('upload_%s' % viewlet.input_name);
    22                 name python:('upload_%s' % viewlet.input_name);
    23                 value viewlet/upload_button"
    24              class="btn btn-primary" />
    25     <span i18n:translate="">
    26       Max. file size:
    27     </span>
    28     <span tal:replace="viewlet/max_upload_size">10 KB</span>
     38
    2939    <br />
    3040  </td>

  • main/waeup.kofa/trunk/src/waeup/kofa/students/browser_templates/imageupload.pt

    r11254 r11558  
    66    <img align="middle" height="125px"
    77         tal:attributes="src python: view.url(context, viewlet.download_name)" />
     8    &nbsp;
    89    <input type="submit" tal:condition="viewlet/file_exists"
    910     tal:attributes="id python:('delete_%s' % viewlet.input_name);
    … …  
    1112     value="Delete" class="btn btn-danger" />
    1213    <br /><br />
    13     <input type="file" tal:attributes="name viewlet/input_name"/>
    14     <br /><br />
    15     <input type="submit"
    16              tal:attributes="id python:('upload_%s' % viewlet.input_name);
     14
     15                <div class="input-group">
     16                        <div class="input-group-btn">
     17                                <div class="btn btn-default btn-file">
     18          Select new file&hellip;
     19          <input type="file" tal:attributes="name viewlet/input_name" />
     20        </div>
     21                        </div>
     22                        <input type="text" class="form-control" readonly>
     23      <div class="input-group-btn">
     24        <input type="submit"
     25               tal:attributes="id python:('upload_%s' % viewlet.input_name);
    1726                name python:('upload_%s' % viewlet.input_name);
    1827                value viewlet/upload_button"
    19              value="Upload" class="btn btn-primary" />
    20     <span i18n:translate="">
    21       Max. file size:
    22     </span>
    23     <span tal:replace="viewlet/max_upload_size">10 KB</span>
     28               class="btn btn-primary" />
     29        (<span tal:replace="viewlet/max_upload_size">10 kB</span> max.)
     30      </div>
     31    </div>
    2432  </td>
    2533</tr>

  • main/waeup.kofa/trunk/src/waeup/kofa/students/viewlets.py

    r11254 r11558  
    894894    tab_redirect = '#tab2-top'
    895895    mus = 1024 * 150
    896     upload_button =_('Upload new file')
    897     delete_button = _('Delete attachment')
     896    upload_button =_('Upload selected file')
     897    delete_button = _('Delete')
    898898
    899899    @property
Note: See TracChangeset for help on using the changeset viewer.