@import "../colors";
@import "../fonts";

.preview.pane {
  .sw-font;

  .dirty-message {
    background: @dirty-msg;
    padding: .3em;
  }

  .section-header {
    a {
      cursor: pointer;
      color: @gray-dk;

      &:hover {
        text-decoration: none;
        border-bottom: 1px dotted @silver;
      }
    }

    .on-hover {
      display: none;
      font-size: 14px;
    }

    &:hover .on-hover {
      display: inline-block;
    }
  }

  .section-content {
    margin-left: 10px;
    list-style: none;
    padding-left: 0;
  }

  .definition {
    h4 {
      .jump-to-yaml {
        float: right;
        position: relative;
        top: -4px;
        right: 0;
        padding: 0.3em;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        font-size: 0.8em;
        display: inline-block;
        height: 19px;
        width: 22px;
        color: @gray-md;
        background-image: url("../../images/jump-icon.svg");
      }
    }

  }

  .definition-title {
    color: @gray-dk;
  }
}