init

uni_modules/nutui-uni/components/ecard/index.scss

@@ -0,0 +1,117 @@
+@import "../inputnumber/index";
+
+.nut-theme-dark {
+  .nut-ecard {
+    color: $dark-color3;
+
+    .nut-ecard__list__item {
+      background: $dark-background5;
+      border-color: $dark-background5;
+
+      &.active {
+        color: $dark-color2;
+        background: $dark-background6;
+        border-color: $dark-color2;
+      }
+    }
+
+    .nut-ecard__list__input {
+      color: $dark-color3;
+      background: $dark-background7;
+
+      &.active {
+        background: $dark-background7;
+
+        .nut-ecard-input {
+          background: $dark-background7;
+        }
+      }
+
+      .nut-ecard__list__input--con > .nut-ecard-input {
+        color: $dark-color3;
+        background-color: transparent;
+      }
+    }
+  }
+}
+
+.nut-ecard {
+  width: 100%;
+
+  &__title {
+    font-size: 15px;
+    font-weight: normal;
+    line-height: 1;
+  }
+
+  &__list {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    margin-top: 15px;
+
+    &__item {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 48%;
+      height: 46px;
+      margin-bottom: 12px;
+      background: $ecard-bg-color;
+      border: 1px solid $ecard-bg-color;
+      border-radius: 4px;
+
+      &.active {
+        background: $white;
+        border-color: $primary-color;
+      }
+    }
+
+    &__input {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      width: 100%;
+      height: 46px;
+      padding: 0 15px 0 20px;
+      font-size: 14px;
+      background: $ecard-bg-color;
+      border: 1px solid $ecard-bg-color;
+      border-radius: 4px;
+
+      &--con {
+        display: flex;
+        flex: 1;
+        justify-content: flex-end;
+
+        .nut-ecard-input {
+          margin-right: 10px;
+          text-align: right;
+          text-decoration: none;
+          caret-color: $primary-color;
+          background: transparent;
+          border: none;
+        }
+      }
+
+      &.active {
+        background: $white;
+        border-color: $primary-color;
+
+        .nut-ecard-input {
+          background: $white;
+        }
+      }
+    }
+
+    &__step {
+      display: flex;
+      justify-content: space-between;
+      width: 100%;
+      margin-top: 17px;
+      font-size: 20px;
+      font-weight: normal;
+      color: $primary-color;
+    }
+  }
+}