.modal.fade id="share-modal" tabindex="-1" role="dialog"
  .modal-dialog.share-modal
    .modal-content
      .modal-header
        button type="button" class="close" data-dismiss="modal"
          span ×
        h4.modal-title id="myModalLabel" Share this recording
      .modal-body
        .row
          .col-md-6
            h2 Link
            p
              input[type="text" value=asciicast_url(page.asciicast) data-behavior="auto-select" readonly]
              br
              span
                ' Append
                code
                  ' ?t=30
                ' to start the playback at 30s,
                code
                  ' ?t=3:20
                ' to start the playback at 3m 20s.

          .col-md-6
            h2 Social
            div
              = render 'shared/social_buttons', title: page.asciicast_title, url: asciicast_url(page.asciicast)

        h2 Embed image link
        p Use snippets below to display a screenshot linking to this recording. Useful in places where scripts are not allowed (e.g. in a project's README file).
        p
          span HTML:
          br
          input[type="text" value=embed_html_link(page.asciicast) data-behavior="auto-select" readonly]
        p
          span Markdown:
          br
          input[type="text" value=embed_markdown_link(page.asciicast) data-behavior="auto-select" readonly]

        h2 Embed the player

        p If you're embedding on your own page or on a site which permits script tags,
          you can use the full player widget:
        p
          input[type="text" value=embed_script(page.asciicast) data-behavior="auto-select" readonly]
        p Paste the above script tag where you want the player to be displayed on your page.

        hr
        p See #{link_to 'Sharing & embedding', docs_path(:embedding)} for additional options.