dtable-ui-component 6.0.24-beta1 → 6.0.25

package/lib/InputItem/style/index.css

@@ -0,0 +1,512 @@
+.am-list-item .am-input-control .fake-input-container {
+  height: 30px;
+  line-height: 30px;
+  position: relative;
+}
+
+.am-list-item .am-input-control .fake-input-container .fake-input {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  margin-right: 5px;
+  -webkit-text-decoration: rtl;
+  text-decoration: rtl;
+  text-align: right;
+  color: #000;
+  font-size: 17px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.am-list-item .am-input-control .fake-input-container .fake-input.fake-input-disabled {
+  color: #bbb;
+}
+
+.am-list-item .am-input-control .fake-input-container .fake-input.focus {
+  -webkit-transition: color .2s;
+  transition: color .2s;
+}
+
+.am-list-item .am-input-control .fake-input-container .fake-input.focus:after {
+  content: "";
+  position: absolute;
+  right: 0;
+  top: 10%;
+  height: 80%;
+  border-right: 1.5px solid #108ee9;
+  -webkit-animation: keyboard-cursor infinite 1s step-start;
+  animation: keyboard-cursor infinite 1s step-start;
+}
+
+.am-list-item .am-input-control .fake-input-container .fake-input-placeholder {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  color: #bbb;
+  text-align: right;
+}
+
+.am-list-item .am-input-control .fake-input-container-left .fake-input {
+  text-align: left;
+}
+
+.am-list-item .am-input-control .fake-input-container-left .fake-input.focus:after {
+  position: relative;
+}
+
+.am-list-item .am-input-control .fake-input-container-left .fake-input-placeholder {
+  text-align: left;
+}
+
+.am-number-keyboard-wrapper {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  width: 100%;
+  z-index: 10000;
+  font-family: 'PingFang SC';
+  background-color: #f6f6f7;
+  -webkit-transition-duration: 0.2s;
+  transition-duration: 0.2s;
+  -webkit-transition-property: -webkit-transform display;
+  transition-property: -webkit-transform display;
+  transition-property: transform display;
+  transition-property: transform display, -webkit-transform display;
+  -webkit-transform: translateZ(0);
+  transform: translateZ(0);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+.am-number-keyboard-wrapper.am-number-keyboard-wrapper-hide {
+  bottom: -500px;
+}
+
+.am-number-keyboard-wrapper table {
+  width: 100%;
+  padding: 0;
+  margin: 0;
+  border-collapse: collapse;
+  border-top: 1PX solid #ddd;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table {
+    border-top: none;
+  }
+
+  html:not([data-scale]) .am-number-keyboard-wrapper table::before {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: 0;
+    right: auto;
+    bottom: auto;
+    left: 0;
+    width: 100%;
+    height: 1PX;
+    -webkit-transform-origin: 50% 50%;
+    -ms-transform-origin: 50% 50%;
+    transform-origin: 50% 50%;
+    -webkit-transform: scaleY(0.5);
+    -ms-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table::before {
+    -webkit-transform: scaleY(0.33);
+    -ms-transform: scaleY(0.33);
+    transform: scaleY(0.33);
+  }
+}
+
+.am-number-keyboard-wrapper table tr {
+  width: 100%;
+  padding: 0;
+  margin: 0;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item {
+  width: 25%;
+  padding: 0;
+  margin: 0;
+  height: 50px;
+  text-align: center;
+  font-size: 25.5px;
+  color: #2a2b2c;
+  position: relative;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm) {
+  border-left: 1PX solid #ddd;
+  border-bottom: 1PX solid #ddd;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm) {
+    border-left: none;
+  }
+
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm)::before {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: 0;
+    right: auto;
+    bottom: auto;
+    left: 0;
+    width: 1PX;
+    height: 100%;
+    -webkit-transform-origin: 100% 50%;
+    -ms-transform-origin: 100% 50%;
+    transform-origin: 100% 50%;
+    -webkit-transform: scaleX(0.5);
+    -ms-transform: scaleX(0.5);
+    transform: scaleX(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm)::before {
+    -webkit-transform: scaleX(0.33);
+    -ms-transform: scaleX(0.33);
+    transform: scaleX(0.33);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm) {
+    border-bottom: none;
+  }
+
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm)::after {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: auto;
+    right: auto;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1PX;
+    -webkit-transform-origin: 50% 100%;
+    -ms-transform-origin: 50% 100%;
+    transform-origin: 50% 100%;
+    -webkit-transform: scaleY(0.5);
+    -ms-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item:not(.keyboard-confirm)::after {
+    -webkit-transform: scaleY(0.33);
+    -ms-transform: scaleY(0.33);
+    transform: scaleY(0.33);
+  }
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.am-number-keyboard-item-active {
+  background-color: #ddd;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm {
+  color: #fff;
+  font-size: 21px;
+  background-color: #108ee9;
+  border-bottom: 1PX solid #ddd;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm {
+    border-bottom: none;
+  }
+
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm::after {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: auto;
+    right: auto;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1PX;
+    -webkit-transform-origin: 50% 100%;
+    -ms-transform-origin: 50% 100%;
+    transform-origin: 50% 100%;
+    -webkit-transform: scaleY(0.5);
+    -ms-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm::after {
+    -webkit-transform: scaleY(0.33);
+    -ms-transform: scaleY(0.33);
+    transform: scaleY(0.33);
+  }
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm.am-number-keyboard-item-active {
+  background-color: #0e80d2;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm.am-number-keyboard-item-disabled {
+  background-color: #0e80d2;
+  color: rgba(255, 255, 255, 0.45);
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-delete {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22204%22%20height%3D%22148%22%20viewBox%3D%220%200%20153.000000%20111.000000%22%3E%3Cpath%20d%3D%22M46.9%204.7c-2.5%202.6-14.1%2015.5-25.8%2028.6L-.1%2057l25.6%2027%2025.7%2027.1%2047.4-.3%2047.4-.3%203.2-3.3%203.3-3.2V7l-3.3-3.2L146%20.5%2098.7.2%2051.5-.1l-4.6%204.8zm97.9%203.5c1.7%201.7%201.7%2092.9%200%2094.6-.9.9-12.6%201.2-46.3%201.2H53.4L31.2%2080.4%209%2056.9l5.1-5.7c2.8-3.1%2012.8-14.4%2022.2-24.9L53.5%207h45c33.8%200%2045.4.3%2046.3%201.2z%22%2F%3E%3Cpath%20d%3D%22M69.5%2031c-1.9%202.1-1.7%202.2%209.3%2013.3L90%2055.5%2078.8%2066.7%2067.5%2078l2.3%202.2%202.2%202.3%2011.3-11.3L94.5%2060l11.2%2011.2L117%2082.5l2.2-2.3%202.3-2.2-11.3-11.3L99%2055.5l11.2-11.2L121.5%2033l-2.3-2.2-2.2-2.3-11.3%2011.3L94.5%2051l-11-11c-6-6-11.2-11-11.6-11-.3%200-1.4.9-2.4%202z%22%2F%3E%3C%2Fsvg%3E");
+  background-size: 25.5px 18.5px;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-hide {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22260%22%20height%3D%22188%22%20viewBox%3D%220%200%20195.000000%20141.000000%22%3E%3Cpath%20d%3D%22M0%2057v57h195V0H0v57zm183%200v45H12V12h171v45z%22%2F%3E%3Cpath%20d%3D%22M21%2031.5V39h15V24H21v7.5zM48%2031.5V39h15V24H48v7.5zM75%2031.5V39h15V24H75v7.5zM102%2031.5V39h15V24h-15v7.5zM129%2031.5V39h15V24h-15v7.5zM156%2031.5V39h15V24h-15v7.5zM36%2055.5V63h15V48H36v7.5zM63%2055.5V63h15V48H63v7.5zM90%2055.5V63h15V48H90v7.5zM117%2055.5V63h15V48h-15v7.5zM144%2055.5V63h15V48h-15v7.5zM27%2079.5V87h15V72H27v7.5zM48%2079.5V87h96V72H48v7.5zM150%2079.5V87h15V72h-15v7.5zM81%20124.5c0%20.8.7%201.5%201.5%201.5s1.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5c0-1.3-2.5-1.5-16.5-1.5s-16.5.2-16.5%201.5z%22%2F%3E%3C%2Fsvg%3E");
+  background-size: 32.5px 23.5px;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+}
+
+.am-number-keyboard-wrapper table tr .am-number-keyboard-item-disabled {
+  color: #bbb;
+}
+
+@-webkit-keyframes keyboard-cursor {
+  0% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes keyboard-cursor {
+  0% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.am-list-item.am-input-item {
+  height: 44px;
+  padding-left: 15px;
+}
+
+.am-list-item:not(:last-child) .am-list-line {
+  border-bottom: 1PX solid #ddd;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-list-item:not(:last-child) .am-list-line {
+    border-bottom: none;
+  }
+
+  html:not([data-scale]) .am-list-item:not(:last-child) .am-list-line::after {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: auto;
+    right: auto;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1PX;
+    -webkit-transform-origin: 50% 100%;
+    -ms-transform-origin: 50% 100%;
+    transform-origin: 50% 100%;
+    -webkit-transform: scaleY(0.5);
+    -ms-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-list-item:not(:last-child) .am-list-line::after {
+    -webkit-transform: scaleY(0.33);
+    -ms-transform: scaleY(0.33);
+    transform: scaleY(0.33);
+  }
+}
+
+.am-list-item .am-input-label {
+  color: #000;
+  font-size: 17px;
+  margin-left: 0;
+  margin-right: 5px;
+  text-align: left;
+  white-space: nowrap;
+  overflow: hidden;
+  padding: 2px 0;
+}
+
+.am-list-item .am-input-label.am-input-label-2 {
+  width: 34px;
+}
+
+.am-list-item .am-input-label.am-input-label-3 {
+  width: 51px;
+}
+
+.am-list-item .am-input-label.am-input-label-4 {
+  width: 68px;
+}
+
+.am-list-item .am-input-label.am-input-label-5 {
+  width: 85px;
+}
+
+.am-list-item .am-input-label.am-input-label-6 {
+  width: 102px;
+}
+
+.am-list-item .am-input-label.am-input-label-7 {
+  width: 119px;
+}
+
+.am-list-item .am-input-control {
+  font-size: 17px;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
+
+.am-list-item .am-input-control input {
+  color: #000;
+  font-size: 17px;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  width: 100%;
+  padding: 2px 0;
+  border: 0;
+  background-color: transparent;
+  line-height: 1;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.am-list-item .am-input-control input::-webkit-input-placeholder {
+  color: #bbb;
+  line-height: 1.2;
+}
+
+.am-list-item .am-input-control input::-moz-placeholder {
+  color: #bbb;
+  line-height: 1.2;
+}
+
+.am-list-item .am-input-control input::-ms-input-placeholder {
+  color: #bbb;
+  line-height: 1.2;
+}
+
+.am-list-item .am-input-control input::placeholder {
+  color: #bbb;
+  line-height: 1.2;
+}
+
+.am-list-item .am-input-control input:disabled {
+  color: #bbb;
+  background-color: #fff;
+}
+
+.am-list-item .am-input-clear {
+  display: none;
+  width: 21px;
+  height: 21px;
+  border-radius: 50%;
+  overflow: hidden;
+  font-style: normal;
+  color: #fff;
+  background-color: #ccc;
+  background-repeat: no-repeat;
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20viewBox%3D'0%200%2030%2030'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
+  background-size: 21px auto;
+  background-position: 2px 2px;
+}
+
+.am-list-item .am-input-clear-active {
+  background-color: #108ee9;
+}
+
+.am-list-item.am-input-focus .am-input-clear {
+  display: block;
+}
+
+.am-list-item .am-input-extra {
+  -webkit-box-flex: initial;
+  -webkit-flex: initial;
+  -ms-flex: initial;
+  flex: initial;
+  min-width: 0;
+  max-height: 21px;
+  overflow: hidden;
+  padding-right: 0;
+  line-height: 1;
+  color: #888;
+  font-size: 15px;
+  margin-left: 5px;
+}
+
+.am-list-item.am-input-error .am-input-control input {
+  color: #f50;
+}
+
+.am-list-item.am-input-error .am-input-error-extra {
+  height: 21px;
+  width: 21px;
+  margin-left: 6px;
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'18'%20height%3D'18'%20viewBox%3D'0%200%2018%2018'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20stroke%3D'none'%20stroke-width%3D'1'%20fill%3D'none'%20fill-rule%3D'evenodd'%3E%3Cg%20transform%3D'translate(-300.000000%2C%20-1207.000000)'%20fill%3D'%23FF5500'%3E%3Cg%20id%3D'exclamation-circle-o'%20transform%3D'translate(300.000000%2C%201207.000000)'%3E%3Cpath%20d%3D'M9%2C16.734375%20C10.0441406%2C16.734375%2011.0566406%2C16.5304688%2012.009375%2C16.1279297%20C12.9304688%2C15.7376953%2013.7566406%2C15.1804687%2014.4685547%2C14.4703125%20C15.1787109%2C13.7601563%2015.7376953%2C12.9322266%2016.1261719%2C12.0111328%20C16.5304688%2C11.0566406%2016.734375%2C10.0441406%2016.734375%2C9%20C16.734375%2C7.95585938%2016.5304688%2C6.94335938%2016.1279297%2C5.990625%20C15.7376953%2C5.06953125%2015.1804687%2C4.24335938%2014.4703125%2C3.53144531%20C13.7601563%2C2.82128906%2012.9322266%2C2.26230469%2012.0111328%2C1.87382813%20C11.0566406%2C1.46953125%2010.0441406%2C1.265625%209%2C1.265625%20C7.95585938%2C1.265625%206.94335938%2C1.46953125%205.990625%2C1.87207031%20C5.06953125%2C2.26230469%204.24335938%2C2.81953125%203.53144531%2C3.5296875%20C2.82128906%2C4.23984375%202.26230469%2C5.06777344%201.87382813%2C5.98886719%20C1.46953125%2C6.94335938%201.265625%2C7.95585938%201.265625%2C9%20C1.265625%2C10.0441406%201.46953125%2C11.0566406%201.87207031%2C12.009375%20C2.26230469%2C12.9304688%202.81953125%2C13.7566406%203.5296875%2C14.4685547%20C4.23984375%2C15.1787109%205.06777344%2C15.7376953%205.98886719%2C16.1261719%20C6.94335938%2C16.5304688%207.95585938%2C16.734375%209%2C16.734375%20L9%2C16.734375%20Z%20M9%2C18%20C4.02890625%2C18%200%2C13.9710937%200%2C9%20C0%2C4.02890625%204.02890625%2C0%209%2C0%20C13.9710937%2C0%2018%2C4.02890625%2018%2C9%20C18%2C13.9710937%2013.9710937%2C18%209%2C18%20L9%2C18%20L9%2C18%20Z%20M9%2C6.75%20C8.61152344%2C6.75%208.296875%2C7.06464844%208.296875%2C7.453125%20L8.296875%2C13.9394531%20C8.296875%2C14.3279297%208.61152344%2C14.6425781%209%2C14.6425781%20C9.38847656%2C14.6425781%209.703125%2C14.3279297%209.703125%2C13.9394531%20L9.703125%2C7.453125%20C9.703125%2C7.06464844%209.38847656%2C6.75%209%2C6.75%20L9%2C6.75%20Z%20M8.20898438%2C4.83398438%20C8.20898438%2C5.27085024%208.56313413%2C5.625%209%2C5.625%20C9.43686587%2C5.625%209.79101562%2C5.27085024%209.79101562%2C4.83398438%20C9.79101562%2C4.39711851%209.43686587%2C4.04296875%209%2C4.04296875%20C8.56313413%2C4.04296875%208.20898438%2C4.39711851%208.20898438%2C4.83398438%20L8.20898438%2C4.83398438%20Z'%20id%3D'Shape'%20transform%3D'translate(9.000000%2C%209.000000)%20scale(1%2C%20-1)%20translate(-9.000000%2C%20-9.000000)%20'%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
+  background-size: 21px auto;
+}
+
+.am-list-item.am-input-disabled .am-input-label {
+  color: #bbb;
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}