<div id="bootstrap-theme" class="crm-container crm-oembed-sharing">

  <details class="crm-accordion-bold crm-oembed-sharing-accordion">
    <summary>
      {{::ts('Cross-Site Sharing')}}
    </summary>
    <div class="crm-accordion-body">

      <div class="container-fluid">
        <form class="form-horizontal">
          <div class="form-group">
            <label for="oembed-url">
              {{::ts('oEmbed URL')}}:
            </label>
            <textarea readonly class="form-control" id="oembed-url">{{ctrl.getShareUrl()}}</textarea>
          </div>
          <div class="form-group">
            <label for="oembed-iframe">
              {{ts('IFrame HTML')}}:
            </label>
            <textarea readonly class="form-control" id="oembed-iframe">{{ctrl.getIframeCode()}}</textarea>
          </div>

          <div class="form-group">
            <label for="oembed-width">
              {{::ts('Width')}}:
            </label>
            <input id="oembed-width" type="number" ng-model="options.maxwidth" />
          </div>
          <div class="form-group">
            <label for="oembed-height">
              {{::ts('Height')}}:
            </label>
            <input id="oembed-height" type="number" ng-model="options.maxheight" />
          </div>
        </form>
      </div>

    </div>
  </details>


</div>
