Home: Socialtext Style Customization Guide
Up: Styling The Lightboxes
Previous: Styling The Lightboxes
Next: Page Already Exists Lightbox

HTML Snippet

<div id="st-newpage-save">
  <form onsubmit="return false;">
    <div id="st-newpage-save-overlay" class="popup-overlay"></div>
    <div id="st-newpage-save-interface">
      <div id="st-newpage-save-title">Save Page As</div>
      <p id="st-newpage-save-prompt">Enter a meaningful and distinctive title for your page.</p>
      <p id="st-newpage-save-field-pagename">
          Page Title: <input id="st-newpage-save-pagename" size="45" type="text" name="pagename"/>
      </p>
      <p id="st-newpage-save-tip">Tip: You'll be able to find this page later by using the title you choose.</p>
      <div id="st-newpage-save-buttons">
        <table width="100%" border="0">
          <tr>
            <td align="right">
              <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-newpage-save-cancelbutton" href="#" title="">Cancel</a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </td>
                </tr>
              </table>
            </td>
            <td width="70px" align="right">
              <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-newpage-save-savebutton" href="#" title="">Save</a>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
        </table>
      </div>
    </div>
  </form>
</div>

CSS Selectors

See Standard Button for the CSS selectors for the buttons.

#st-newpage-save
#st-newpage-save-overlay
div.popup-overlay
#st-newpage-save-interface
#st-newpage-save-title
#st-newpage-save-prompt
#st-newpage-save-field-pagename
#st-newpage-save-pagename
#st-newpage-save-tip
#st-newpage-save-buttons
#st-newpage-save-cancelbutton
#st-newpage-save-savebutton