@trionesdev/antd-mobile-base-react 0.0.2-beta.0 → 0.0.2-beta.2

package/dist/PickerView/style.scss

@@ -1,72 +1,72 @@
-$pickerViewCls: 'triones-antm-picker-view';
-.#{$pickerViewCls} {
-  width: 100%;
-  height: var(--height,240Px);
-  display: flex;
-  position: relative;
-  overflow: hidden;
-  --item-height: 34Px;
-  --item-font-size: 16Px;
-
-  &-column {
-    height: 100%;
-    flex: 1 1;
-    user-select: none;
-    touch-action: none;
-    position: relative;
-    z-index: 0;
-    &-wheel{
-      width: 100%;
-      cursor: grab;
-      position: absolute;
-      top: calc(50% - var(--item-height)/2);
-      left: 0;
-    }
-
-    &-item {
-      font-size: var(--item-font-size);
-      padding: 0 6px;
-      height: var(--item-height);
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      &-label{
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-    }
-  }
-
-  &-mask {
-    position: absolute;
-    z-index: 10000;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    pointer-events: none;
-
-    &-top {
-      background-color: white;
-      flex: auto;
-      mask: linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
-    }
-
-    &-middle {
-      height: var(--item-height);
-      box-sizing: border-box;
-      flex: none;
-      border-top: 1px solid #eee;
-      border-bottom: 1px solid #eee;
-    }
-
-    &-bottom {
-      background-color: white;
-      flex: auto;
-      mask: linear-gradient(180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
-    }
-  }
-}
+$pickerViewCls: 'triones-antm-picker-view';
+.#{$pickerViewCls} {
+  width: 100%;
+  height: var(--height,240Px);
+  display: flex;
+  position: relative;
+  overflow: hidden;
+  --item-height: 34Px;
+  --item-font-size: 16Px;
+
+  &-column {
+    height: 100%;
+    flex: 1 1;
+    user-select: none;
+    touch-action: none;
+    position: relative;
+    z-index: 0;
+    &-wheel{
+      width: 100%;
+      cursor: grab;
+      position: absolute;
+      top: calc(50% - var(--item-height)/2);
+      left: 0;
+    }
+
+    &-item {
+      font-size: var(--item-font-size);
+      padding: 0 6px;
+      height: var(--item-height);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      &-label{
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+
+  &-mask {
+    position: absolute;
+    z-index: 10000;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    pointer-events: none;
+
+    &-top {
+      background-color: white;
+      flex: auto;
+      mask: linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
+    }
+
+    &-middle {
+      height: var(--item-height);
+      box-sizing: border-box;
+      flex: none;
+      border-top: 1px solid #eee;
+      border-bottom: 1px solid #eee;
+    }
+
+    &-bottom {
+      background-color: white;
+      flex: auto;
+      mask: linear-gradient(180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .8) 50%, #000);
+    }
+  }
+}

package/dist/Popup/style.scss

@@ -1,53 +1,53 @@
-@import "../style/variable";
-$popupCls: 'triones-antm-popup';
-
-.#{$popupCls} {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-
-  &-mask {
-    height: 100%;
-    width: 100%;
-    background-color: rgba(0, 0, 0, .55);
-  }
-
-  &-close {
-    position: absolute;
-    right: 10Px;
-    top: 10Px;
-  }
-
-  &-body {
-    background-color: white;
-    position: fixed;
-    border-top-left-radius: $trionesBorderRadius;
-    border-top-right-radius: $trionesBorderRadius;
-  }
-
-  &-top {
-    top: 0;
-    left: 0;
-    right: 0;
-  }
-
-  &-bottom {
-    bottom: 0;
-    left: 0;
-    right: 0;
-  }
-
-  &-left {
-    left: 0;
-    top: 0;
-    bottom: 0;
-  }
-
-  &-right {
-    right: 0;
-    top: 0;
-    bottom: 0;
-  }
-}
+@use "../style/variable" as *;
+$popupCls: 'triones-antm-popup';
+
+.#{$popupCls} {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+
+  &-mask {
+    height: 100%;
+    width: 100%;
+    background-color: rgba(0, 0, 0, .55);
+  }
+
+  &-close {
+    position: absolute;
+    right: 10Px;
+    top: 10Px;
+  }
+
+  &-body {
+    background-color: white;
+    position: fixed;
+    border-top-left-radius: $trionesBorderRadius;
+    border-top-right-radius: $trionesBorderRadius;
+  }
+
+  &-top {
+    top: 0;
+    left: 0;
+    right: 0;
+  }
+
+  &-bottom {
+    bottom: 0;
+    left: 0;
+    right: 0;
+  }
+
+  &-left {
+    left: 0;
+    top: 0;
+    bottom: 0;
+  }
+
+  &-right {
+    right: 0;
+    top: 0;
+    bottom: 0;
+  }
+}

package/dist/Radio/style.scss

@@ -1,138 +1,138 @@
-@import "../style/variable";
-
-$checkboxDisabledColor: rgba(0, 0, 0, 0.25) !default;
-
-$class-prefix-radio: 'triones-antm-radio';
-
-.#{$class-prefix-radio}-wrapper {
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 8Px;
-
-  .#{$class-prefix-radio} {
-    &-fake {
-      width: 22PX;
-      height: 22PX;
-
-      .triones-antm-icon {
-        //position: absolute;
-      }
-
-      &-checked {
-        height: 100%;
-        width: 100%;
-        display: inline-flex;
-        justify-content: center;
-        align-items: center;
-        background-color: $trionesColorPrimary;
-        color: white;
-        border-radius: 50vh;
-        box-sizing: border-box;
-        overflow: hidden;
-
-      }
-
-      &-unchecked {
-        height: 100%;
-        width: 100%;
-        display: inline-flex;
-        justify-content: center;
-        align-items: center;
-        border-radius: 50vh;
-        border: 1PX solid $trionesBorderColor;
-        box-sizing: border-box;
-      }
-
-    }
-
-
-
-    &-label {
-      flex: 1 auto;
-    }
-  }
-
-  &.#{$class-prefix-radio} {
-    &-disabled {
-      color: $checkboxDisabledColor;
-      pointer-events: none;
-
-      .#{$class-prefix-radio}-fake-checked {
-        background-color: $checkboxDisabledColor;
-      }
-    }
-    &-block {
-      width: 100%;
-    }
-  }
-
-}
-
-
-.#{$class-prefix-radio}-group {
-  display: flex;
-  gap: 8Px;
-  &-horizontal{
-    flex-direction: row;
-  }
-  &-vertical{
-    flex-direction: column;
-  }
-}
-
-.#{$class-prefix-radio}-button-group {
-  display: flex;
-}
-
-.#{$class-prefix-radio}-button-wrapper {
-  display: inline-flex;
-  position: relative;
-  border-top: 1PX solid $trionesBorderColor;
-  border-bottom: 1PX solid $trionesBorderColor;
-  border-right: 1PX solid $trionesBorderColor;
-
-  &:first-child {
-    border-left: 1PX solid $trionesBorderColor;
-    border-top-left-radius: $trionesBorderRadius;
-    border-bottom-left-radius: $trionesBorderRadius;
-  }
-
-  &:last-child {
-    border-right: 1PX solid $trionesBorderColor;
-    border-top-right-radius: $trionesBorderRadius;
-    border-bottom-right-radius: $trionesBorderRadius;
-  }
-
-  &-checked {
-    border-top: 1PX solid $trionesColorPrimary;
-    border-bottom: 1PX solid $trionesColorPrimary;
-    color: $trionesColorPrimary;
-
-    &:first-child {
-      border: 1PX solid $trionesColorPrimary;
-    }
-
-    &:not(:first-child) {
-      &::before {
-        content: " ";
-        width: 1PX;
-        background-color: $trionesColorPrimary;
-        position: absolute;
-        inset-block-start: -1Px;
-        inset-inline-start: -1Px;
-        height: 100%;
-        padding-block: 1Px;
-      }
-
-      border-right: 1PX solid $trionesColorPrimary;
-    }
-  }
-
-  .#{$class-prefix-radio}-button {
-    cursor: pointer;
-    display: inline-flex;
-    padding: 8Px 12Px;
-
-  }
-}
+@use "../style/variable" as *;
+
+$checkboxDisabledColor: rgba(0, 0, 0, 0.25) !default;
+
+$class-prefix-radio: 'triones-antm-radio';
+
+.#{$class-prefix-radio}-wrapper {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8Px;
+
+  .#{$class-prefix-radio} {
+    &-fake {
+      width: 22PX;
+      height: 22PX;
+
+      .triones-antm-icon {
+        //position: absolute;
+      }
+
+      &-checked {
+        height: 100%;
+        width: 100%;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        background-color: $trionesColorPrimary;
+        color: white;
+        border-radius: 50vh;
+        box-sizing: border-box;
+        overflow: hidden;
+
+      }
+
+      &-unchecked {
+        height: 100%;
+        width: 100%;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        border-radius: 50vh;
+        border: 1PX solid $trionesBorderColor;
+        box-sizing: border-box;
+      }
+
+    }
+
+
+
+    &-label {
+      flex: 1 auto;
+    }
+  }
+
+  &.#{$class-prefix-radio} {
+    &-disabled {
+      color: $checkboxDisabledColor;
+      pointer-events: none;
+
+      .#{$class-prefix-radio}-fake-checked {
+        background-color: $checkboxDisabledColor;
+      }
+    }
+    &-block {
+      width: 100%;
+    }
+  }
+
+}
+
+
+.#{$class-prefix-radio}-group {
+  display: flex;
+  gap: 8Px;
+  &-horizontal{
+    flex-direction: row;
+  }
+  &-vertical{
+    flex-direction: column;
+  }
+}
+
+.#{$class-prefix-radio}-button-group {
+  display: flex;
+}
+
+.#{$class-prefix-radio}-button-wrapper {
+  display: inline-flex;
+  position: relative;
+  border-top: 1PX solid $trionesBorderColor;
+  border-bottom: 1PX solid $trionesBorderColor;
+  border-right: 1PX solid $trionesBorderColor;
+
+  &:first-child {
+    border-left: 1PX solid $trionesBorderColor;
+    border-top-left-radius: $trionesBorderRadius;
+    border-bottom-left-radius: $trionesBorderRadius;
+  }
+
+  &:last-child {
+    border-right: 1PX solid $trionesBorderColor;
+    border-top-right-radius: $trionesBorderRadius;
+    border-bottom-right-radius: $trionesBorderRadius;
+  }
+
+  &-checked {
+    border-top: 1PX solid $trionesColorPrimary;
+    border-bottom: 1PX solid $trionesColorPrimary;
+    color: $trionesColorPrimary;
+
+    &:first-child {
+      border: 1PX solid $trionesColorPrimary;
+    }
+
+    &:not(:first-child) {
+      &::before {
+        content: " ";
+        width: 1PX;
+        background-color: $trionesColorPrimary;
+        position: absolute;
+        inset-block-start: -1Px;
+        inset-inline-start: -1Px;
+        height: 100%;
+        padding-block: 1Px;
+      }
+
+      border-right: 1PX solid $trionesColorPrimary;
+    }
+  }
+
+  .#{$class-prefix-radio}-button {
+    cursor: pointer;
+    display: inline-flex;
+    padding: 8Px 12Px;
+
+  }
+}

package/dist/Rate/style.scss

@@ -1,37 +1,37 @@
-$rateCls: 'triones-antm-rate';
-
-.#{$rateCls} {
-  display: inline-flex;
-  align-items: center;
-
-  &-star-wrapper {
-    position: relative;
-    padding: 0 2px;
-    cursor: pointer;
-  }
-
-  &-star {
-    font-size: 20px;
-    color: var(--inactive-color, #e8e8e8);
-    transition: color 0.3s;
-
-    &-active {
-      color: var(--active-color, #ffb400);
-    }
-  }
-
-  &-star-half-item {
-    position: absolute;
-    left: 2px;
-    top: 0;
-    width: 42%;
-    height: 100%;
-    overflow: hidden;
-  }
-
-  &-readonly {
-    .#{$rateCls}-star-wrapper {
-      cursor: default;
-    }
-  }
-}
+$rateCls: 'triones-antm-rate';
+
+.#{$rateCls} {
+  display: inline-flex;
+  align-items: center;
+
+  &-star-wrapper {
+    position: relative;
+    padding: 0 2px;
+    cursor: pointer;
+  }
+
+  &-star {
+    font-size: 20px;
+    color: var(--inactive-color, #e8e8e8);
+    transition: color 0.3s;
+
+    &-active {
+      color: var(--active-color, #ffb400);
+    }
+  }
+
+  &-star-half-item {
+    position: absolute;
+    left: 2px;
+    top: 0;
+    width: 42%;
+    height: 100%;
+    overflow: hidden;
+  }
+
+  &-readonly {
+    .#{$rateCls}-star-wrapper {
+      cursor: default;
+    }
+  }
+}

package/dist/Result/demo/base.js

@@ -1,5 +1,5 @@
-/**
- * compact: true
+/**
+ * compact: true
  */
 import { DemoBlock } from "../../DemoBlock";
 import React from 'react';