Evernote pop-up code example

[rgsoto]

  <textarea id="title" rows="2" tabindex="5" placeholder="Untitled note"></textarea>
  <div class="green button" id="saveButton" message="saveToEvernote" tabindex="5">Save</div>
  <section id="clip">
    <h1 message="quickNote">Clip</h1>
    <h2 message="articleClip" class="html frameset" id="article">Article</h2>
    <h2 message="clearly" class="html frameset" id="clearly">Simplified article</h2>
    <h2 message="fullPageClip" class="html" id="fullPage">Full page</h2>
    <h2 message="pdfClip" class="pdf" id="pdf">PDF</h2>
    <h2 message="emailClip" class="email" id="email">Email</h2>
    <h2 message="selectionClip" class="selection" id="selection">Selection</h2>
    <h2 message="urlClip" class="html pdf frameset active" id="url">Bookmark</h2>
    <h2 message="screenshotClip" class="html email pdf frameset" id="screenshot">Screenshot</h2>
  </section>
  <section id="annotate">
    <h1 message="annotate">Annotate</h1>
    <div id="skitchToolsContainer">
      <div class="skitchTool" id="highlighter" title="Image highlighter"></div><!--
      --><div class="skitchTool expandable arrow" id="shapes" data-tool="arrow" title="Shape tool"></div><!--
      --><div class="skitchTool" id="marker" title="Marker tool"></div><!--
      --><div class="skitchTool" id="crop" title="Crop"></div><!--
      --><div class="skitchTool" id="zoomout" title="Zoom Out"></div><!--
      --><div class="skitchTool expandable stampAccept" id="stamps" title="Stamp tool" data-tool="stampAccept"></div><!--
      --><div class="skitchTool" id="text" title="Type tool"></div><!--
      --><div class="skitchTool" id="pixelate" title="Pixelator tool"></div><!--
      --><div class="skitchTool expandable pink" id="colors" title="Colors" data-tool="pink"></div><!--
      --><div class="skitchTool" id="zoomin" title="Zoom In"></div>
      <div class="subtools" id="shapesSubtools">
        <div class="subtool" id="arrow"></div><!--
        --><div class="subtool" id="rectangle"></div><!--
        --><div class="subtool" id="roundedRectangle"></div><!--
        --><div class="subtool" id="ellipse"></div><!--
        --><div class="subtool" id="line"></div>
      </div>
      <div class="subtools" id="stampsSubtools">
        <div class="subtool" id="stampAccept"></div><!--
        --><div class="subtool" id="stampReject"></div><!--
        --><div class="subtool" id="stampExclaim"></div><!--
        --><div class="subtool" id="stampQuestion"></div><!--
        --><div class="subtool" id="stampPerfect"></div>
      </div>
      <div class="subtools" id="colorsSubtools">
        <div class="subtool" id="red"></div><!--
        --><div class="subtool" id="orange"></div><!--
        --><div class="subtool" id="yellow"></div><!--
        --><div class="subtool" id="black"></div><!--
        --><div class="subtool" id="green"></div><!--
        --><div class="subtool" id="blue"></div><!--
        --><div class="subtool" id="pink"></div><!--
        --><div class="subtool" id="white"></div>
      </div>
    </div>
  </section>
  <div class="gray button" id="cancelScreenshot" message="regForm_cancel">Cancel</div>
  <section id="organize">
    <h1 message="organize">Organize</h1>
    <div id="notebook" class="nbContainer"><div class="nbSelected" title="Technology" guid="af5dbc34-ebf2-4bed-83ca-470601ddf286">Technology</div><div class="nbDropdown"><div><input class="nbSearchInput" placeholder="Find a notebook" tabindex="2"></div><div class="nbList"><div class="nbNotebook" title="Bags" guid="af84cd62-33e9-4455-bb11-ebd0ba27b74e"><span>Bags</span></div><div class="nbNotebook" title="Books &amp; Movies" guid="d2d01549-fa9f-4ef2-81ae-541f87e0fecd"><span>Books &amp; Movies</span></div><div class="nbNotebook" title="Business" guid="4cd89990-f0bd-445e-a7fb-662eeff5399b"><span>Business</span></div><div class="nbNotebook" title="Gmat" guid="96383c18-9cb6-4071-a171-f1ab9a551e00"><span>Gmat</span></div><div class="nbNotebook" title="Grooming" guid="f9e6dbf1-a0bd-4958-a21a-db7b800b0b61"><span>Grooming</span></div><div class="nbNotebook" title="Informative" guid="2305dd4d-75e5-4597-a74c-ab3d7f6cf340"><span>Informative</span></div><div class="nbNotebook" title="Men's" guid="e91227a2-d1f0-4e5a-b5f3-3ae74570f857"><span>Men's</span></div><div class="nbNotebook" title="Music" guid="1d5a2290-8e8c-4451-80dd-fdd37c155332"><span>Music</span></div><div class="nbNotebook" title="My notebook" guid="569b7033-653c-4cbd-a12a-d82f7bc4172c"><span>My notebook</span></div><div class="nbNotebook" title="Pants" guid="d9861203-246c-44ca-ae69-6aa297acafab"><span>Pants</span></div><div class="nbNotebook" title="Pens &amp; Notes" guid="50c02759-ae62-44c6-9a1b-8c5cab92839e"><span>Pens &amp; Notes</span></div><div class="nbNotebook" title="Penultimate" guid="a575a813-e021-476c-8243-3b8b37203196"><span>Penultimate</span></div><div class="nbNotebook" title="Programming" guid="26e7a8f7-26ca-4baf-942c-553ebcb8c217"><span>Programming</span></div><div class="nbNotebook" title="Random" guid="a33da60b-6c08-4bf0-a3f5-a569cf6dd40f"><span>Random</span></div><div class="nbNotebook" title="Reni's  notebook" guid="a28e50eb-bcc1-4628-b6b2-2d242c778a70" default=""><span>Reni's  notebook</span></div><div class="nbNotebook" title="Shirts" guid="1cd0c507-7f3b-498b-955e-872c3c5ed21b"><span>Shirts</span></div><div class="nbNotebook" title="Shoes" guid="a7872273-ea7c-426d-84f3-858eb2a3159b"><span>Shoes</span></div><div class="nbNotebook" title="Skincare" guid="fbebad06-e703-46ae-8a3d-5fc7db249601"><span>Skincare</span></div><div class="nbNotebook" title="Skitch" guid="1aae8d01-7817-4df1-b89a-9226c5bb8f2e"><span>Skitch</span></div><div class="nbNotebook" title="Spiritual/Life" guid="75e318ef-e27e-48b3-a6d4-e36911c7070f"><span>Spiritual/Life</span></div><div class="nbNotebook nbSelectedNotebook" title="Technology" guid="af5dbc34-ebf2-4bed-83ca-470601ddf286"><span>Technology</span></div><div class="nbNotebook" title="Watches" guid="4099e025-ccd0-46db-89b8-5e04e256c8aa"><span>Watches</span></div><div class="nbNotebook" title="Wishlist" guid="382d3da7-647d-43b2-bccb-095b9be2c073" visibletoothers=""><span>Wishlist</span></div></div></div><div class="nbInputFocuser" tabindex="1"></div></div>
    <div id="tags" class="tContainer"><div class="tInput" data-placeholder="Add tag" data-max-tags-placeholder="Max 20 tags" data-linked-placeholder="Tags not supported" tabindex="3" contenteditable="true"></div><div class="tExisting"></div><div class="tDropdown"></div></div>
    <textarea id="comments" rows="1" tabindex="4" placeholder="Add remark"></textarea>
  </section>
  <section id="account">
    <hr>
    <div id="settings" message="options_title">Options</div>
    <div id="sso" message="signInToBusiness">Sign in to Business</div>
  </section>
</div>

[anthony-dandrea]

Is that in a notification, popup, or embedded code in the page?

[rgsoto]

Embedded code in the page.