Upload Files Lightbox (View mode)


Home: Socialtext Style Customization Guide
Up: Styling The Lightboxes
Previous: Manage Attachments Lightbox
Next: Add Tags


uploadfileviewmode.png

HTML Snippet

<div id="st-attachments-attachinterface">
  <div id="st-attachments-attach-attachinterface-overlay" class="popup-overlay"></div>
  <div id="st-attachments-attach-interface">
    <form id="st-attachments-attach-form" name="attachForm" method="post" action="/page/css-guide-2/untitled_page/attachments" accept="text/javascript" enctype="multipart/form-data" target="st-attachments-attach-formtarget">
      <iframe id="st-attachments-attach-formtarget" name="st-attachments-attach-formtarget" src="/static/1.99.99.12/html/blank.html"></iframe>
      <div id="st-attachments-attach-title">Upload Files</div>
      <p id="st-attachments-attach-message">
        Click "Browse" to find the file you want to upload. 
        When you click "Upload file" your file will be uploaded 
        and added to the list of attachments for this page.
      </p>
      <p id="st-attachments-attach-fileprompt">
        <input id="st-attachments-attach-filename" size="60" type="file" name="file"/>
      </p>
      <div id="st-attachments-attach-error">&nbsp;</div>
      <div id="st-attachments-attach-uploadmessage">&nbsp;</div>
      <div id="st-attachments-attach-embed">
        <label for="st-attachments-attach-embedcheckbox" id="st-attachments-attach-embedlabel">
          <input class="checkbox" type="checkbox" id="st-attachments-attach-embedcheckbox" name="embedcb" value="1" checked="checked"/>
          <input type="hidden" id="st-attachments-attach-embedfield" name="embed" value="1"/>
          Add a link to the attachment at the top of the page? Images will appear in the page.
        </label>
      </div>
      <div id="st-attachments-attach-unpack">
        <label for="st-attachments-attach-unpackcheckbox" id="st-attachments-attach-unpacklabel">
          <input class="checkbox" type="checkbox" id="st-attachments-attach-unpackcheckbox" name="unpackcb" value="1" />
          <input type="hidden" id="st-attachments-attach-unpackfield" name="unpack" value="0"/>
          Expand zip archive and attach individual files to the page
        </label>
      </div>
      <div id="st-attachments-attach-list"></div>
      <div id="st-attachments-attach-buttons">
        <div id="st-attachments-attach-close">
          <table class="button-table">
            <tr>
              <td>
                <div class="button-straight">
                  <div class="button-straight-right-top">
                    <div class="button-straight-left-bottom">
                      <div class="button-straight-right-bottom">
                        <div class="button-content">
                          <a id="st-attachments-attach-closebutton" href="#" title="">Done</a>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </td>
            </tr>
          </table>
        </div>
        <div id="st-attachments-attach-uploadbutton">
          <input id="st-attachments-attach-submit" name="submit" type="submit" value="Upload file" />
        </div>
      </div>
    </form>
  </div>
</div>

CSS Selectors

See Standard Button for the button CSS selectors.

#st-attachments-attachinterface
#st-attachments-attach-attachinterface-overlay
div.popup-overlay
#st-attachments-attach-interface
#st-attachments-attach-form
#st-attachments-attach-formtarget
#st-attachments-attach-title
#st-attachments-attach-message
#st-attachments-attach-fileprompt
#st-attachments-attach-filename
#st-attachments-attach-error
#st-attachments-attach-uploadmessage
#st-attachments-attach-embed
#st-attachments-attach-embedlabel
#st-attachments-attach-embedcheckbox
#st-attachments-attach-unpack
#st-attachments-attach-unpacklabel
#st-attachments-attach-unpackcheckbox
#st-attachments-attach-list
#st-attachments-attach-buttons
#st-attachments-attach-close
#st-attachments-attach-closebutton
#st-attachments-attach-uploadbutton
#st-attachments-attach-submit