@varlet/ui 1.27.20 → 2.0.0-alpha.1663499244572

package/es/action-sheet/actionSheet.less

@@ -1,68 +0,0 @@
-@action-sheet-border-radius: 2px;
-@action-sheet-title-color: #888;
-@action-sheet-title-padding: 10px 16px;
-@action-sheet-title-font-size: 14px;
-@action-sheet-action-item-height: 48px;
-@action-sheet-action-item-padding: 0px 18px;
-@action-sheet-action-item-color: #333;
-@action-sheet-action-item-disabled-color: var(--color-text-disabled);
-@action-sheet-icon-margin: 0 20px 0 0;
-@action-sheet-icon-size: 24px;
-@action-sheet-background: #fff;
-
-:root {
-  --action-sheet-border-radius: @action-sheet-border-radius;
-  --action-sheet-title-color: @action-sheet-title-color;
-  --action-sheet-title-padding: @action-sheet-title-padding;
-  --action-sheet-title-font-size: @action-sheet-title-font-size;
-  --action-sheet-action-item-height: @action-sheet-action-item-height;
-  --action-sheet-action-item-padding: @action-sheet-action-item-padding;
-  --action-sheet-action-item-color: @action-sheet-action-item-color;
-  --action-sheet-action-item-disabled-color: @action-sheet-action-item-disabled-color;
-  --action-sheet-icon-margin: @action-sheet-icon-margin;
-  --action-sheet-icon-size: @action-sheet-icon-size;
-  --action-sheet-background: @action-sheet-background;
-}
-
-.var-action-sheet {
-  padding: 10px 0;
-  max-height: 80%;
-  background: var(--action-sheet-background);
-  transition: background-color 0.25s;
-
-  &__popup-radius {
-    border-radius: var(--action-sheet-border-radius);
-  }
-
-  &__title {
-    padding: var(--action-sheet-title-padding);
-    color: var(--action-sheet-title-color);
-    font-size: var(--action-sheet-title-font-size);
-  }
-
-  &__action-item {
-    display: flex;
-    align-items: center;
-    height: var(--action-sheet-action-item-height);
-    padding: var(--action-sheet-action-item-padding);
-    color: var(--action-sheet-action-item-color);
-    cursor: pointer;
-  }
-
-  &__action-name {
-    overflow: auto;
-    max-height: var(--action-sheet-action-item-height);
-  }
-
-  &__action-icon[var-action-sheet-cover] {
-    margin: var(--action-sheet-icon-margin);
-    width: var(--action-sheet-icon-size);
-    height: var(--action-sheet-icon-size);
-    font-size: var(--action-sheet-icon-size);
-  }
-
-  &--disabled {
-    color: var(--action-sheet-action-item-disabled-color) !important;
-    cursor: not-allowed;
-  }
-}

package/es/action-sheet/style/less.js

@@ -1,6 +0,0 @@
-import '../../styles/common.less'
-import '../../icon/icon.less'
-import '../../ripple/ripple.less'
-import '../../popup/popup.less'
-import '../actionSheet.less'
-import '../ActionSheetSfc.less'

package/es/app-bar/appBar.less

@@ -1,57 +0,0 @@
-@app-bar-color: var(--color-primary);
-@app-bar-height: 54px;
-@app-bar-text-color: #fff;
-@app-bar-title-padding: 0 12px;
-@app-bar-left-gap: 6px;
-@app-bar-right-gap: 6px;
-
-:root {
-  --app-bar-color: @app-bar-color;
-  --app-bar-title-padding: @app-bar-title-padding;
-  --app-bar-text-color: #fff;
-  --app-bar-height: @app-bar-height;
-  --app-bar-left-gap: @app-bar-left-gap;
-  --app-bar-right-gap: @app-bar-right-gap;
-}
-
-.var-app-bar {
-  position: relative;
-  display: flex;
-  width: 100%;
-  justify-content: center;
-  align-items: center;
-  height: var(--app-bar-height);
-  background: var(--app-bar-color);
-  color: var(--app-bar-text-color);
-  transition: background-color 0.25s;
-
-  &__title {
-    flex: 1;
-    display: flex;
-    justify-content: center;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    padding: var(--app-bar-title-padding);
-  }
-
-  &__left,
-  &__right {
-    display: flex;
-    align-items: center;
-    height: 100%;
-    z-index: 2;
-  }
-
-  &__left {
-    position: absolute;
-    top: 0;
-    left: var(--app-bar-left-gap);
-  }
-
-  &__right {
-    position: absolute;
-    top: 0;
-    right: var(--app-bar-right-gap);
-  }
-}

package/es/app-bar/style/less.js

@@ -1,4 +0,0 @@
-import '../../styles/common.less'
-import '../../styles/elevation.less'
-import '../appBar.less'
-import '../AppBarSfc.less'

package/es/back-top/backTop.less

@@ -1,27 +0,0 @@
-@back-top-right: 40px;
-@back-top-bottom: 40px;
-@back-top-button-size: 40px;
-
-:root {
-  --back-top-right: @back-top-right;
-  --back-top-bottom: @back-top-bottom;
-  --back-top-button-size: @back-top-button-size;
-}
-
-.var-back-top {
-  position: fixed;
-  right: var(--back-top-right);
-  bottom: var(--back-top-bottom);
-  transform: scale(0);
-  transition: 0.3s var(--cubic-bezier);
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-
-  .var-button[var-back-top-cover] {
-    width: var(--back-top-button-size);
-    height: var(--back-top-button-size);
-  }
-
-  &--active {
-    transform: scale(1);
-  }
-}

package/es/back-top/style/less.js

@@ -1,5 +0,0 @@
-import '../../styles/common.less'
-import '../../button/button.less'
-import '../../icon/icon.less'
-import '../backTop.less'
-import '../BackTopSfc.less'

package/es/badge/badge.less

@@ -1,119 +0,0 @@
-@badge-content-padding: 2px 6px;
-@badge-default-color: #e0e0e0;
-@badge-primary-color: var(--color-primary);
-@badge-danger-color: var(--color-danger);
-@badge-success-color: var(--color-success);
-@badge-warning-color: var(--color-warning);
-@badge-info-color: var(--color-info);
-
-:root {
-  --badge-content-padding: @badge-content-padding;
-  --badge-default-color: @badge-default-color;
-  --badge-primary-color: @badge-primary-color;
-  --badge-danger-color: @badge-danger-color;
-  --badge-success-color: @badge-success-color;
-  --badge-warning-color: @badge-warning-color;
-  --badge-info-color: @badge-info-color;
-}
-
-.var-badge {
-  display: inline-block;
-  position: relative;
-  transition: background-color 0.25s;
-
-  &__content {
-    color: #fff;
-    border-radius: 100px;
-    font-size: 12px;
-    padding: 2px 6px;
-    vertical-align: middle;
-    text-align: center;
-    display: inline-block;
-  }
-
-  &__icon {
-    padding: 2px 4px;
-  }
-
-  &__position {
-    border: 2px #fff solid;
-  }
-
-  &--default {
-    background: var(--badge-default-color);
-  }
-
-  &--primary {
-    background: var(--badge-primary-color);
-  }
-
-  &--info {
-    background: var(--badge-info-color);
-  }
-
-  &--warning {
-    background: var(--badge-warning-color);
-  }
-
-  &--success {
-    background: var(--badge-success-color);
-  }
-
-  &--danger {
-    background: var(--badge-danger-color);
-  }
-
-  &--right-top {
-    position: absolute;
-    top: 0;
-    right: 0;
-    transform: translateY(-50%) translateX(50%);
-  }
-
-  &--left-top {
-    position: absolute;
-    top: 0;
-    left: 0;
-    transform: translateY(-50%) translateX(-50%);
-  }
-
-  &--right-bottom {
-    position: absolute;
-    bottom: 0;
-    right: 0;
-    transform: translateY(50%) translateX(50%);
-  }
-
-  &--left-bottom {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    transform: translateY(50%) translateX(-50%);
-  }
-
-  &__dot {
-    box-sizing: content-box;
-    width: 8px;
-    height: 8px;
-    border-radius: 8px;
-    padding: 0;
-  }
-
-  &__dot--right {
-    right: 6px;
-  }
-
-  &__dot--left {
-    left: 6px;
-  }
-
-  &-fade-enter-active,
-  &-fade-leave-active {
-    transition: opacity 0.15s var(--cubic-bezier);
-  }
-
-  &-fade-enter-from,
-  &-fade-leave-to {
-    opacity: 0;
-  }
-}

package/es/badge/style/less.js

@@ -1,4 +0,0 @@
-import '../../styles/common.less'
-import '../../icon/icon.less'
-import '../badge.less'
-import '../BadgeSfc.less'

package/es/bottom-navigation/bottomNavigation.less

@@ -1,56 +0,0 @@
-@bottom-navigation-height: 50px;
-@bottom-navigation-z-index: 1;
-@bottom-navigation-background-color: #fff;
-@bottom-navigation-border-color: #e3e3e3;
-@bottom-navigation-fab-offset: 4px;
-
-:root {
-  --bottom-navigation-height: @bottom-navigation-height;
-  --bottom-navigation-z-index: @bottom-navigation-z-index;
-  --bottom-navigation-background-color: @bottom-navigation-background-color;
-  --bottom-navigation-border-color: @bottom-navigation-border-color;
-  --bottom-navigation-fab-offset: @bottom-navigation-fab-offset;
-}
-
-.var-bottom-navigation {
-  width: 100%;
-  height: var(--bottom-navigation-height);
-  display: flex;
-  position: relative;
-  background-color: var(--bottom-navigation-background-color);
-  transition: background-color 250ms, border-color 250ms;
-  -webkit-tap-highlight-color: transparent;
-
-  &--safe-area {
-    padding-bottom: constant(safe-area-inset-bottom); // iOS < 11.2
-    padding-bottom: env(safe-area-inset-bottom); // iOS >= 11.2
-  }
-
-  &--fixed {
-    position: fixed;
-    left: 0;
-    bottom: 0;
-  }
-
-  &--border {
-    border-top: 1px solid var(--bottom-navigation-border-color);
-  }
-
-  &__fab[var-bottom-navigation__fab] {
-    width: var(--bottom-navigation-height);
-    height: var(--bottom-navigation-height);
-    position: absolute;
-    z-index: 2;
-    transform: translateY(-50%);
-    overflow: hidden;
-    transition: right 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
-  }
-
-  &--fab-center {
-    right: calc(50% - var(--bottom-navigation-height) / 2);
-  }
-
-  &--fab-right {
-    right: var(--bottom-navigation-fab-offset);
-  }
-}

package/es/bottom-navigation/style/less.js

@@ -1,4 +0,0 @@
-import '../../styles/common.less'
-import '../../button/button.less'
-import '../bottomNavigation.less'
-import '../BottomNavigationSfc.less'

package/es/bottom-navigation-item/bottomNavigationItem.less

@@ -1,78 +0,0 @@
-@bottom-navigation-item-font-size: var(--font-size-sm);
-@bottom-navigation-item-inactive-color: #646566;
-@bottom-navigation-item-active-color: var(--color-primary);
-@bottom-navigation-item-active-background-color: #fff;
-@bottom-navigation-item-line-height: 1;
-@bottom-navigation-item-icon-size: 22px;
-@bottom-navigation-item-icon-margin-bottom: 5px;
-
-:root {
-  --bottom-navigation-item-font-size: @bottom-navigation-item-font-size;
-  --bottom-navigation-item-inactive-color: @bottom-navigation-item-inactive-color;
-  --bottom-navigation-item-active-color: @bottom-navigation-item-active-color;
-  --bottom-navigation-item-active-background-color: @bottom-navigation-item-active-background-color;
-  --bottom-navigation-item-line-height: @bottom-navigation-item-line-height;
-  --bottom-navigation-item-icon-size: @bottom-navigation-item-icon-size;
-  --bottom-navigation-item-icon-margin-bottom: @bottom-navigation-item-icon-margin-bottom;
-}
-
-.var-bottom-navigation-item {
-  height: 100%;
-  padding: 6px 12px 8px;
-  position: relative;
-  display: inline-flex;
-  flex: 1 1 0%;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  line-height: var(--bottom-navigation-item-line-height);
-  color: var(--bottom-navigation-item-inactive-color);
-  cursor: pointer;
-  user-select: none;
-  vertical-align: middle;
-  appearance: none;
-  text-decoration: none;
-  background-color: transparent;
-  outline: 0;
-  border: 0;
-  transition: color 250ms, margin 250ms;
-
-  &--active {
-    color: var(--bottom-navigation-item-active-color);
-    background-color: var(--bottom-navigation-item-active-background-color);
-    transition: background-color 250ms;
-
-    .var-bottom-navigation-item__label {
-      font-size: calc(var(--bottom-navigation-item-font-size) * 1.16);
-    }
-  }
-
-  &--right-half-space {
-    margin-right: calc(var(--bottom-navigation-height) / 2);
-  }
-
-  &--left-half-space {
-    margin-left: calc(var(--bottom-navigation-height) / 2);
-  }
-
-  &--right-space {
-    margin-right: calc(var(--bottom-navigation-height) + var(--bottom-navigation-fab-offset));
-  }
-
-  &__icon[var-bottom-navigation-item-cover] {
-    font-size: var(--bottom-navigation-item-icon-size);
-  }
-
-  &__badge[var-bottom-navigation-item-cover] {
-    position: absolute;
-    left: 4px;
-    transform: translateY(-22px);
-  }
-
-  &__label {
-    margin-top: var(--bottom-navigation-item-icon-margin-bottom);
-    font-size: var(--bottom-navigation-item-font-size);
-    transition: font-size 0.2s ease 0.1s;
-    white-space: nowrap;
-  }
-}

package/es/bottom-navigation-item/style/less.js

@@ -1,6 +0,0 @@
-import '../../styles/common.less'
-import '../../ripple/ripple.less'
-import '../../badge/badge.less'
-import '../../icon/icon.less'
-import '../bottomNavigationItem.less'
-import '../BottomNavigationItemSfc.less'

package/es/button/button.less

@@ -1,183 +0,0 @@
-@button-default-color: #f5f5f5;
-@button-primary-color: var(--color-primary);
-@button-danger-color: var(--color-danger);
-@button-success-color: var(--color-success);
-@button-warning-color: var(--color-warning);
-@button-info-color: var(--color-info);
-@button-disabled-color: var(--color-disabled);
-@button-disabled-text-color: var(--color-text-disabled);
-@button-border-radius: 4px;
-@button-mini-padding: 0 9px;
-@button-small-padding: 0 11px;
-@button-normal-padding: 0 15px;
-@button-large-padding: 0 22px;
-@button-round-padding: 6px;
-@button-mini-height: 20px;
-@button-small-height: 28px;
-@button-normal-height: 36px;
-@button-large-height: 44px;
-
-:root {
-  --button-default-color: @button-default-color;
-  --button-primary-color: @button-primary-color;
-  --button-danger-color: @button-danger-color;
-  --button-success-color: @button-success-color;
-  --button-warning-color: @button-warning-color;
-  --button-info-color: @button-info-color;
-  --button-disabled-color: @button-disabled-color;
-  --button-disabled-text-color: @button-disabled-text-color;
-  --button-border-radius: @button-border-radius;
-  --button-mini-padding: @button-mini-padding;
-  --button-small-padding: @button-small-padding;
-  --button-normal-padding: @button-normal-padding;
-  --button-large-padding: @button-large-padding;
-  --button-round-padding: @button-round-padding;
-  --button-mini-height: @button-mini-height;
-  --button-small-height: @button-small-height;
-  --button-normal-height: @button-normal-height;
-  --button-large-height: @button-large-height;
-}
-
-.var-button {
-  position: relative;
-  justify-content: center;
-  align-items: center;
-  outline: none;
-  border: none;
-  border-radius: var(--button-border-radius);
-  user-select: none;
-  cursor: pointer;
-  font-family: inherit;
-  transition: box-shadow 0.2s, background-color 0.25s;
-  will-change: box-shadow;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  white-space: nowrap;
-  line-height: 1;
-
-  &:active {
-    box-shadow: 0 3px 5px -1px var(--shadow-key-umbra-opacity), 0 5px 8px 0 var(--shadow-key-penumbra-opacity),
-      0 1px 14px 0 var(--shadow-key-ambient-opacity);
-  }
-
-  &__loading[var-button-cover] {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-  }
-
-  &--default {
-    color: inherit;
-    background-color: var(--button-default-color);
-  }
-
-  &--primary {
-    color: #fff;
-    background-color: var(--button-primary-color);
-  }
-
-  &--info {
-    color: #fff;
-    background-color: var(--button-info-color);
-  }
-
-  &--success {
-    color: #fff;
-    background-color: var(--button-success-color);
-  }
-
-  &--warning {
-    color: #fff;
-    background-color: var(--button-warning-color);
-  }
-
-  &--danger {
-    color: #fff;
-    background-color: var(--button-danger-color);
-  }
-
-  &--disabled {
-    background-color: var(--button-disabled-color);
-    color: var(--button-disabled-text-color);
-    cursor: not-allowed;
-    box-shadow: none !important;
-  }
-
-  &--block {
-    width: 100%;
-  }
-
-  &--text {
-    background-color: transparent;
-
-    &:active {
-      box-shadow: none;
-    }
-  }
-
-  &--text-default {
-    color: inherit;
-  }
-
-  &--text-primary {
-    color: var(--button-primary-color);
-  }
-
-  &--text-info {
-    color: var(--button-info-color);
-  }
-
-  &--text-success {
-    color: var(--button-success-color);
-  }
-
-  &--text-warning {
-    color: var(--button-warning-color);
-  }
-
-  &--text-danger {
-    color: var(--button-danger-color);
-  }
-
-  &--text-disabled {
-    color: var(--button-disabled-text-color);
-  }
-
-  &--normal {
-    height: var(--button-normal-height);
-    padding: var(--button-normal-padding);
-    font-size: var(--font-size-md);
-  }
-
-  &--large {
-    height: var(--button-large-height);
-    padding: var(--button-large-padding);
-    font-size: var(--font-size-lg);
-  }
-
-  &--small {
-    height: var(--button-small-height);
-    padding: var(--button-small-padding);
-    font-size: var(--font-size-sm);
-  }
-
-  &--mini {
-    height: var(--button-mini-height);
-    padding: var(--button-mini-padding);
-    font-size: var(--font-size-xs);
-  }
-
-  &--round {
-    padding: var(--button-round-padding);
-    border-radius: 50%;
-    height: auto;
-  }
-
-  &--outline {
-    border: thin solid currentColor;
-  }
-
-  &--hidden {
-    opacity: 0;
-  }
-}

package/es/button/style/less.js

@@ -1,6 +0,0 @@
-import '../../styles/common.less'
-import '../../styles/elevation.less'
-import '../../ripple/ripple.less'
-import '../../loading/loading.less'
-import '../button.less'
-import '../ButtonSfc.less'