wx-csbwg-minapp/src/subModule/pages/feedback/index.scss

.feedback-page {
  padding: 6px 0 0 6px;
  height: 100vh;
  box-sizing: border-box;
  background: linear-gradient(#b9d6d3, #fafbeb);
}

.feedback {
  position: relative;

  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 25px;
    width: 35px;
    height: 130px;
    background: url("../../images/Userfeedback@2x-min.png") no-repeat center /
      contain;
  }
  &__bg {
    width: 100%;
  }
  &-main {
    position: absolute;
    top: 53px;
    left: 69px;
    right: 52px;
    bottom: 0;
    z-index: 1;
    background: unset;

    &__form {
      padding: 0 24px;

      &:first-child {
        margin-bottom: 38px;
        padding-bottom: 38px;
        border-bottom: 2px solid #d5ddd7;
      }
    }
  }
  &__label {
    font-family: "Source Han Serif CN-Bold";
    font-size: 38px;
    color: #424a4a;
  }
  &__input {
    margin: 20px 0 38px;
    padding: 2px;
    width: 100%;
    height: 100px;
    box-sizing: border-box;
    border-radius: 10px;
    overflow: hidden;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 1),
      rgba(255, 255, 255, 0.15)
    );

    .at-input__container {
      width: 100%;
      height: 100%;
      background-color: rgba(213, 221, 215, 0.5);
      border-radius: 10px;
    }
    .at-input__input {
      padding: 0 38px;
      font-size: 31px;
    }

    &.textarea {
      position: relative;
      margin-bottom: 0;
      padding: 2px;
      height: 385px;
      border: 0;

      .at-textarea__textarea {
        position: relative;
        padding: 30px 38px;
        height: 100%;
        box-sizing: border-box;
        border-radius: 10px;
        background-color: rgba(213, 221, 215, 0.5);
        z-index: 1;
      }
      &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient(
          180deg,
          rgba(255, 255, 255, 1),
          rgba(255, 255, 255, 0.15)
        );
      }
    }
  }

  .code {
    display: flex;
    align-items: center;
    margin: 20px 0 40px;
    gap: 20px;

    .feedback__input {
      flex: 1;
      margin: 0;
    }
    &__img {
      flex-shrink: 0;
      width: 256px;
      height: 100px;
    }
  }

  .toolbar {
    display: flex;
    justify-content: center;
    gap: 46px;

    &__btn {
      width: 262px;
      height: 128px;
      border: 0;
      font-size: 31px;

      .at-button__text {
        position: relative;
        top: 12px;
      }
      &.cancel {
        color: #525252;
        background: url("../../images/btn_L_whtie@2x-min.png") no-repeat center /
          contain;
      }
      &.submit {
        color: #9c6d42;
        background: url("../../images/btn_L_yellow@2x-min.png") no-repeat center /
          contain;
      }
    }
  }
}