@import '~choerodon-ui/lib/style/themes/default';

.c7n-quill-editor {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;

  .react-quill-editor {
    display: flex;
    flex-direction: column;
    height: 100%;

    .ql-toolbar {
      border-bottom: none;
    }

    .quill {
      height: auto !important;
      flex: 1;
      overflow: hidden;
      padding: 2px;
      transition: box-shadow 0.1s ease-in;
      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.20) inset;

      &:focus-within {
        box-shadow: 0 0 0 2px @primary-color inset;
      }

      .ql-container {
        border: none;
        transition: box-shadow 0.1s ease-in;
      }
    }

    img {
      // max-width: 4rem !important;
      max-width: 100% !important;
    }

    .ql-snow .ql-picker.ql-expanded .ql-picker-options {
      right: 0;
    }

    /* link start */
    .ql-snow .ql-tooltip {
      &[data-mode=link]::before {
        content: "输入链接:";
      }

      &::before {
        content: "访问链接:";
      }

      &.ql-editing a.ql-action::after {
        content: '保存';
      }

      & a {
        &.ql-action::after {
          content: '编辑';
        }

        &.ql-remove::before {
          content: '移除链接';
        }
      }
    }

    .ql-toolbar.ql-snow {
      border-bottom: none;

      .ql-formats {
        margin-right: 0;
      }
    }

    /* link end */
    &-read {
      .ql-editor > * {
        cursor: auto;
      }

      .ql-toolbar {
        display: none;
      }

      .ql-container {
        border: none;
      }
    }
  }

  &-bottomBar {
    padding: 0 8px;
    display: flex;
    justify-content: flex-end;
    border: 1px solid rgba(0, 0, 0, 0.20);
    border-top: none;
  }
}