HQ_yueYue/展示端/src/pages/A5order/index.module.scss

.A5order {
  position: relative;
  :global {
    .A5main {
      padding: 5px 0 14px;
      background-image: url('../../assets/img/selectCourse/bg.jpg');
      background-size: cover;
      height: calc(100% - 60px);

      .A5list {
        width: 100%;
        height: calc(100% - 80px);
        margin-bottom: 20px;
        overflow-y: auto;

        .A5listMain {
          padding: 0 16px;
        }

        .A5lTop {
          height: 130px;
          width: 100%;
          background-image: url(../../assets/img/order/top.png);
          background-size: 100% 100%;
          display: flex;
          flex-direction: column;
          justify-content: center;
          padding: 0 0 4px 13%;
          font-size: 16px;
          color: #828282;
          & > p {
            padding-right: 20px;
            margin-bottom: 6px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            & > span {
              font-weight: 700;
              color: var(--themeColor2);
            }
          }
        }
        .A5lKaBox {
          padding: 0 6px;

          .A5btn {
            position: absolute;
            z-index: 10;
            width: 90%;
            bottom: 3%;
            margin: auto;
            height: 60px;
            background-color: var(--themeColor2) !important;
            text-align: center;
            color: #fff;
            font-size: 20px;
            font-weight: 700;
            border-radius: 4px;
          }

          .A5lKa {
            margin-bottom: 15px;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.25);
            padding: 18px 0 10px;
            .A5tit {
              padding-left: 25px;
              font-weight: 700;
              font-size: 18px;
              color: var(--themeColor);
              position: relative;
              margin-bottom: 20px;
              &::before {
                content: '';
                position: absolute;
                width: 6px;
                height: 100%;
                top: 0;
                left: 0;
                background-color: var(--themeColor);
              }
            }

            .ant-form-item {
              padding: 0 13px;
              margin-bottom: 12px;
              height: 40px;
              .ant-row {
                display: flex;
                .ant-form-item-label {
                  width: 110px;
                  flex: none;
                  display: block;
                }
                .ant-form-item-control {
                  flex: none;
                  display: block;
                  width: calc(100% - 110px);
                }

                .ant-input {
                  border: none !important;
                  box-shadow: none !important;
                  border-bottom: 1px solid #bebebe !important;
                  border-radius: 0;
                }
              }

              .ant-input-number {
                width: 100%;
                border: none !important;
                box-shadow: none !important;
                border-bottom: 1px solid #bebebe !important;
                border-radius: 0;
              }
            }
            .A5llmove {
              label {
                padding-left: 12px;
              }
            }
            .A5Text {
              label {
                padding-left: 12px;
              }

              min-height: 80px;
              height: auto;

              textarea {
                min-height: 80px !important;
              }
            }
            .A5Text20 {
              height: 41px;
              textarea {
                min-height: 30px !important;
              }
            }

            // 文本域不换行问题
            .A5TextPdf {
              display: flex;
              padding: 0 13px;
              margin-bottom: 12px;
              min-height: 40px;
              span {
                color: #ff4d4f;
                margin-right: 4px;
              }
              & > div {
                &:nth-of-type(1) {
                  width: 110px;
                }
                &:nth-of-type(2) {
                  width: calc(100% - 110px);
                  border-bottom: 1px solid #bebebe;
                  padding-bottom: 10px;
                }
              }
            }

            // 下面下载
            .A5LA1 {
              display: flex;
              justify-content: space-between;
              padding: 0 23px;
              font-size: 16px;
              height: 40px;
              align-items: center;
              margin-bottom: 10px;

              .A5LA1ll {
                height: 100%;
                width: calc(100% - 70px);
                span {
                  display: block;
                  font-size: 10px;
                  color: #999;
                }
              }

              .A5LA1btn {
                height: 100%;
                width: 60px;
                background-color: var(--themeColor2);
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 4px;
                color: #fff;
              }
              div.A5LA1btn {
                background-color: var(--themeColor);
              }
            }
            .A5file {
              font-size: 16px;
              padding: 0 23px;
              position: relative;

              & > img {
                border-radius: 4px;
                width: 100%;
                object-fit: contain !important;
                display: block;
              }

              .A5file2 {
                display: flex;
                flex-direction: column;
                z-index: 10;
                color: #fff;
                position: absolute;
                top: 10px;
                right: 33px;
                font-size: 24px;
                & > span {
                  background-color: rgba(0, 0, 0, 0.6);
                  padding: 5px;
                  border-radius: 6px;
                  margin-bottom: 10px;
                }
              }
            }

            .A5LAkuang {
              margin-top: 10px;
              padding: 0 23px;
              margin-bottom: 8px;
              & > div {
                background-color: #f3f8fd;
                border-radius: 4px;
                font-size: 14px;
                color: var(--themeColor);
                padding: 12px 0 12px 20px;
                & > p {
                  margin-bottom: 5px;
                }
              }
            }
          }
        }
      }
    }
  }
}