@import './../../variable/config.scss';

.doc-wrapper {
  display: inline-block;
  padding: 1rem;
  border: 1px solid $primary-color;
  background: rgba(255, 255, 255, 0.6);
  margin: 0.5rem;
  min-width: 25rem;

  .doc-descr {
    margin: 1rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .doc-example {
    padding: 1rem;
    border-top: 1px dashed;
  }

  .doc-source {
    .doc-source-triger {
      text-align: right;
      font-size: 16px;
      border-top: 1px solid #ebedf0;
      padding: 1rem 0.5rem;
      color: rgba(0, 0, 0, 0.65);

      .source-triger-btn {
        display: inline-block;
        cursor: pointer;
      }
    }

    .doc-source-code {
      display: block;
      overflow: auto;
      border-radius: 0 0 2px 2px;
      border-top: 1px dashed #ebedf0;

      .code-wrapper {
        position: relative;
        line-height: 1.5;
        padding: 1rem 0.5rem;
      }
    }
  }
}
