mercury_editor-2.0.x-dev/templates/page--mercury-editor.html.twig

{#
/**
 * @file
 * Claro's theme implementation to display a single Drupal page.
 *
 * The doctype, html, head, and body tags are not in this template. Instead
 * they can be found in the html.html.twig template normally located in the
 * core/modules/system directory.
 *
 * Available variables:
 *
 * General utility variables:
 * - base_path: The base URL path of the Drupal installation. Will usually be
 *   "/" unless you have installed Drupal in a sub-directory.
 * - is_front: A flag indicating if the current page is the front page.
 * - logged_in: A flag indicating if the user is registered and signed in.
 * - is_admin: A flag indicating if the user has permission to access
 *   administration pages.
 *
 * Site identity:
 * - front_page: The URL of the front page. Use this instead of base_path when
 *   linking to the front page. This includes the language domain or prefix.
 *
 * Page content (in order of occurrence in the default page.html.twig):
 * - node: Fully loaded node, if there is an automatically-loaded node
 *   associated with the page and the node ID is the second argument in the
 *   page's path (e.g. node/12345 and node/12345/revisions, but not
 *   comment/reply/12345).
 *
 * Regions:
 * - page.header: Items for the header region.
 * - page.pre_content: Items for the pre-content region.
 * - page.breadcrumb: Items for the breadcrumb region.
 * - page.highlighted: Items for the highlighted region.
 * - page.help: Dynamic help text, mostly for admin pages.
 * - page.content: The main content of the current page.
 *
 * @see template_preprocess_page()
 * @see html.html.twig
 */
#}
{{ attach_library('mercury_editor/edit_screen')}}
<div id="me-toolbar" class="me-toolbar">
  <div class="me-toolbar__branding">
    <a href="https://drupal.org/project/mercury_editor" target="_blank" class="me-toolbar__logo">{{'Mercury Editor'|t}}</a>
  </div>
  <div class="screen-actions me-toolbar__group">
    <a href="{{base_path}}mercury-editor/{{uuid}}/component-outline" class="use-ajax me-button--icon me-button--component-outline" id="me-component-outline">
      <span>{{'Component Outline'|t}}</span>
    </a>
  </div>
  <div class="me-toolbar__screen-controls screen-actions me-toolbar__group">
    <a href="#" id="me-desktop-toggle-btn" class="me-button--icon active me-button--desktop">
      <span>{{'Desktop'|t}}</span>
    </a>
    <a href="#" id="me-mobile-toggle-btn" class="me-button--icon me-button--mobile">
      <span>{{'Mobile'|t}}</span>
    </a>
    {{ mobile_presets }}
  </div>
  <div class="me-toolbar__edit-controls main-actions me-toolbar__group">
    <div class="me-toolbar__messages"></div>

    <button class="me-button--icon me-button--undo me-button--simple disabled" id="me-undo"><span>{{'Undo'|t}}</span></button>
    <button class="me-button--icon me-button--redo me-button--simple disabled" id="me-redo"><span>{{'Redo'|t}}</span></button>

    <button id="me-save-btn" class="me-button--primary" title="{{'Save and continue editing.'|t}}">{{'Save Changes'|t}}</button>
    <a id="me-done-btn" class="me-button--secondary" href="{{exit_url}}" title="{{'Exit without saving.'|t}}">{{'Exit'|t}}</a>
    <a id="me-sidebar-toggle-btn" class="me-button--icon me-button--simple me-button--sidebar-collapse" href="#toggle-sidebar" role="button" title="{{'Hide sidebar'|t}}">
      <span>{{'Hide Sidebar'|t}}</span>
    </a>
  </div>
</div>
<div id="me-iframe-wrapper">
  <div id="me-iframe-canvas">
    <iframe id="me-preview" width="100%" height="100%" style="border:none;" data-src="{{ preview_url }}">
    </iframe>
  </div>
</div>
<mercury-dialog id="me-edit-screen" hide-close-button push resizable dock="right">
  {{ page.highlighted }}
  {{ page.content|without(local_actions_block) }}
</mercury-dialog>