joyent-portal/consoles/my-joy-instances/src/components/__tests__/__snapshots__/menu.spec.js.snap

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

exports[`renders <Menu /> without throwing 1`] = `null`;

exports[`renders <Menu links /> without throwing 1`] = `
.c2 {
  margin-top: 0.75rem;
  margin-bottom: 1.875rem;
}

.c8 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
}

.c7 {
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
}

.c6 {
  color: rgb(59,70,204);
  -webkit-text-fill-color: currentcolor;
  cursor: pointer;
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.c1 {
  margin-right: auto;
  margin-left: auto;
}

.c0 {
  box-sizing: border-box;
  width: 100%;
  max-width: 78.75rem;
}

.c4 {
  font-size: 0.9375rem;
  line-height: 1.6;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.c5 {
  color: rgb(73,73,73);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
  padding: 0 0.75rem;
  padding-bottom: 0.9375rem;
  position: relative;
}

.c5:after {
  width: 100%;
  height: 0.0625rem;
  background: rgb(216,216,216);
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
}

.c5.active:after {
  background: rgb(73,73,73);
}

.c5.active {
  font-weight: 600;
}

.c3 {
  background: rgb(250,250,250);
  list-style-type: none;
  padding: 0 0 0.75rem 0;
  max-height: 3.125rem;
  overflow-x: auto;
  overflow-y: hidden;
  box-sizing: border-box;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  margin: 0;
}

.c3:after {
  width: 100%;
  height: 0.0625rem;
  background: rgb(216,216,216);
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
}

@media only screen and (min-width:48em) {
  .c1 {
    width: 46rem;
  }
}

@media only screen and (min-width:64em) {
  .c1 {
    width: 56rem;
  }
}

@media only screen and (min-width:75em) {
  .c1 {
    width: 59rem;
  }
}

@media only screen and (max-width:37.4375rem) {
  .c0 {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

@media only screen and (min-width:37.5rem) and (max-width:62.4375rem) {
  .c0 {
    padding-left: 1.875rem;
    padding-right: 1.875rem;
  }
}

@media only screen and (min-width:62.5rem) and (max-width:87.4375rem) {
  .c0 {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}

<div
  className="c0 c1"
>
  <div
    className="c2"
  >
    <ul
      className="c3"
    >
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/summary"
        >
          summary
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/tags"
        >
          tags
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/metadata"
        >
          metadata
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/networks"
        >
          networks
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/firewall"
        >
          firewall
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/dns"
        >
          dns
        </a>
      </li>
      <li
        className="c4"
      >
        <a
          className="c5 c6 c7 c8"
          to="/:name/snapshots"
        >
          snapshots
        </a>
      </li>
    </ul>
  </div>
</div>
`;