ant-design-vue/components/layout/__tests__/__snapshots__/demo.test.js.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders ./antdv-demo/docs/layout/demo/basic.md correctly 1`] = `
<div id="components-layout-demo-basic">
  <section class="ant-layout">
    <header class="ant-layout-header">Header</header>
    <main class="ant-layout-content">Content</main>
    <footer class="ant-layout-footer">Footer</footer>
  </section>
  <section class="ant-layout">
    <header class="ant-layout-header">Header</header>
    <section class="ant-layout">
      <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
        <div class="ant-layout-sider-children">Sider</div>
      </aside>
      <main class="ant-layout-content">Content</main>
    </section>
    <footer class="ant-layout-footer">Footer</footer>
  </section>
  <section class="ant-layout">
    <header class="ant-layout-header">Header</header>
    <section class="ant-layout">
      <main class="ant-layout-content">Content</main>
      <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
        <div class="ant-layout-sider-children">Sider</div>
      </aside>
    </section>
    <footer class="ant-layout-footer">Footer</footer>
  </section>
  <section class="ant-layout">
    <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
      <div class="ant-layout-sider-children">Sider</div>
    </aside>
    <section class="ant-layout">
      <header class="ant-layout-header">Header</header>
      <main class="ant-layout-content">Content</main>
      <footer class="ant-layout-footer">Footer</footer>
    </section>
  </section>
</div>
`;

exports[`renders ./antdv-demo/docs/layout/demo/custom-trigger.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-custom-trigger">
  <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
    <div class="ant-layout-sider-children">
      <div class="logo"></div>
      <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-dark">
        <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 24px;">
          <!----> <span>nav 1</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span>nav 2</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span>nav 3</span></li>
      </ul>
    </div>
  </aside>
  <section class="ant-layout">
    <header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
    <main class="ant-layout-content" style="margin: 24px 16px; padding: 24px; background: rgb(255, 255, 255); min-height: 280px;">
      Content
    </main>
  </section>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/fixed.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-fixed">
  <header class="ant-layout-header" style="position: fixed; z-index: 1; width: 100%;">
    <div class="logo"></div>
    <ul role="menu" class="ant-menu ant-menu-horizontal ant-menu-root ant-menu-dark" style="line-height: 64px;">
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 1</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item ant-menu-item-selected">nav 2</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 3</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="visibility: hidden; position: absolute; display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
    </ul>
  </header>
  <main class="ant-layout-content" style="padding: 0px 50px; margin-top: 64px;">
    <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
    <div style="background: rgb(255, 255, 255); padding: 24px; min-height: 380px;">Content</div>
  </main>
  <footer class="ant-layout-footer" style="text-align: center;">
    Ant Design ©2018 Created by Ant UED
  </footer>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/fixed-sider.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-fixed-sider">
  <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; overflow: auto; height: 100vh; position: fixed; left: 0px; flex: 0 0 200px;">
    <div class="ant-layout-sider-children">
      <div class="logo"></div>
      <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-dark">
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 1</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 2</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 3</span></li>
        <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 4</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 5</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 6</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 7</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 8</span></li>
      </ul>
    </div>
  </aside>
  <section class="ant-layout" style="margin-left: 200px;">
    <header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
    <main class="ant-layout-content" style="margin: 24px 16px 0px; overflow: initial;">
      <div style="padding: 24px; background: rgb(255, 255, 255); text-align: center;">
        ...
        <br>
        Really
        <br>...<br>...<br>...<br>
        long
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>...
        <br>...<br>...<br>...<br>...<br>...<br>
        content
      </div>
    </main>
    <footer class="ant-layout-footer" style="text-align: center;">
      Ant Design ©2018 Created by Ant UED
    </footer>
  </section>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/responsive.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-responsive">
  <aside class="ant-layout-sider ant-layout-sider-dark" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
    <div class="ant-layout-sider-children">
      <div class="logo"></div>
      <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-dark">
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 1</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 2</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 3</span></li>
        <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 24px;">
          <!----> <span class="nav-text">nav 4</span></li>
      </ul>
    </div>
  </aside>
  <section class="ant-layout">
    <header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
    <main class="ant-layout-content" style="margin: 24px 16px 0px;">
      <div style="padding: 24px; background: rgb(255, 255, 255); min-height: 360px;">
        content
      </div>
    </main>
    <footer class="ant-layout-footer" style="text-align: center;">
      Ant Design ©2018 Created by Ant UED
    </footer>
  </section>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/side.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-side" style="min-height: 100vh;">
  <aside class="ant-layout-sider ant-layout-sider-dark ant-layout-sider-has-trigger" style="flex: 0 0 200px; max-width: 200px; min-width: 200px; width: 200px;">
    <div class="ant-layout-sider-children">
      <div class="logo"></div>
      <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-dark">
        <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 24px;">
          <!----> <span>Option 1</span></li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span>Option 2</span></li>
        <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
          <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!----><span>User</span></span><i class="ant-menu-submenu-arrow"></i></div>
          <div></div>
        </li>
        <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
          <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!----><span>Team</span></span><i class="ant-menu-submenu-arrow"></i></div>
          <div></div>
        </li>
        <li role="menuitem" class="ant-menu-item" style="padding-left: 24px;">
          <!----> <span>File</span></li>
      </ul>
    </div>
    <div class="ant-layout-sider-trigger" style="width: 200px;"><span role="img" aria-label="left" class="anticon anticon-left"><svg viewBox="64 64 896 896" focusable="false" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path></svg></span></div>
  </aside>
  <section class="ant-layout">
    <header class="ant-layout-header" style="background: rgb(255, 255, 255); padding: 0px;"></header>
    <main class="ant-layout-content" style="margin: 0px 16px;">
      <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">User</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">Bill</span><span class="ant-breadcrumb-separator">/</span></span></div>
      <div style="padding: 24px; background: rgb(255, 255, 255); min-height: 360px;">
        Bill is a cat.
      </div>
    </main>
    <footer class="ant-layout-footer" style="text-align: center;">
      Ant Design ©2018 Created by Ant UED
    </footer>
  </section>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/top.md correctly 1`] = `
<section class="layout ant-layout" id="components-layout-demo-top">
  <header class="ant-layout-header">
    <div class="logo"></div>
    <ul role="menu" class="ant-menu ant-menu-horizontal ant-menu-root ant-menu-dark" style="line-height: 64px;">
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 1</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item ant-menu-item-selected">nav 2</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 3</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="visibility: hidden; position: absolute; display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
    </ul>
  </header>
  <main class="ant-layout-content" style="padding: 0px 50px;">
    <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
    <div style="background: rgb(255, 255, 255); padding: 24px; min-height: 280px;">Content</div>
  </main>
  <footer class="ant-layout-footer" style="text-align: center;">
    Ant Design ©2018 Created by Ant UED
  </footer>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/top-side.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-top-side">
  <header class="header ant-layout-header">
    <div class="logo"></div>
    <ul role="menu" class="ant-menu ant-menu-horizontal ant-menu-root ant-menu-dark" style="line-height: 64px;">
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 1</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item ant-menu-item-selected">nav 2</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 3</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="visibility: hidden; position: absolute; display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
    </ul>
  </header>
  <main class="ant-layout-content" style="padding: 0px 50px;">
    <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
    <section class="ant-layout" style="padding: 24px 0px; background: rgb(255, 255, 255);">
      <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px; background: rgb(255, 255, 255);">
        <div class="ant-layout-sider-children">
          <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%;">
            <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected">
              <div aria-expanded="true" aria-owns="sub1$Menu" aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
              <ul role="menu" class="ant-menu ant-menu-inline  ant-menu-sub">
                <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 48px;">option1</li>
                <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option2</li>
                <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option3</li>
                <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option4</li>
              </ul>
            </li>
            <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
              <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 2</span><i class="ant-menu-submenu-arrow"></i></div>
              <div></div>
            </li>
            <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
              <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 3</span><i class="ant-menu-submenu-arrow"></i></div>
              <div></div>
            </li>
          </ul>
        </div>
      </aside>
      <main class="ant-layout-content" style="padding: 0px 24px; min-height: 280px;">
        Content
      </main>
    </section>
  </main>
  <footer class="ant-layout-footer" style="text-align: center;">
    Ant Design ©2018 Created by Ant UED
  </footer>
</section>
`;

exports[`renders ./antdv-demo/docs/layout/demo/top-side-2.md correctly 1`] = `
<section class="ant-layout" id="components-layout-demo-top-side-2">
  <header class="header ant-layout-header">
    <div class="logo"></div>
    <ul role="menu" class="ant-menu ant-menu-horizontal ant-menu-root ant-menu-dark" style="line-height: 64px;">
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 1</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item ant-menu-item-selected">nav 2</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
      <li role="menuitem" class="ant-menu-item">nav 3</li>
      <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style="visibility: hidden; position: absolute; display: none;">
        <div aria-haspopup="true" class="ant-menu-submenu-title"><span>···</span><i class="ant-menu-submenu-arrow"></i></div>
      </li>
    </ul>
  </header>
  <section class="ant-layout">
    <aside class="ant-layout-sider ant-layout-sider-dark" style="max-width: 200px; min-width: 200px; width: 200px; flex: 0 0 200px; background: rgb(255, 255, 255);">
      <div class="ant-layout-sider-children">
        <ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%; border-right: 0;">
          <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected">
            <div aria-expanded="true" aria-owns="sub1$Menu" aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
            <ul role="menu" class="ant-menu ant-menu-inline  ant-menu-sub">
              <li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 48px;">option1</li>
              <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option2</li>
              <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option3</li>
              <li role="menuitem" class="ant-menu-item" style="padding-left: 48px;">option4</li>
            </ul>
          </li>
          <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
            <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 2</span><i class="ant-menu-submenu-arrow"></i></div>
            <div></div>
          </li>
          <li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline">
            <div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><!---->subnav 3</span><i class="ant-menu-submenu-arrow"></i></div>
            <div></div>
          </li>
        </ul>
      </div>
    </aside>
    <section class="ant-layout" style="padding: 0px 24px 24px;">
      <div class="ant-breadcrumb" style="margin: 16px 0px;"><span class=""><span class="ant-breadcrumb-link">Home</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">List</span><span class="ant-breadcrumb-separator">/</span></span><span class=""><span class="ant-breadcrumb-link">App</span><span class="ant-breadcrumb-separator">/</span></span></div>
      <main class="ant-layout-content" style="background: rgb(255, 255, 255); padding: 24px; margin: 0px; min-height: 280px;">
        Content
      </main>
    </section>
  </section>
</section>
`;