diff --git a/wechatMp/pages/examples/g-input/index.json b/wechatMp/pages/examples/g-input/index.json index 3e1894677..181155345 100644 --- a/wechatMp/pages/examples/g-input/index.json +++ b/wechatMp/pages/examples/g-input/index.json @@ -2,6 +2,6 @@ "navigationBarTitleText": "Input 输入框", "usingComponents": { "g-input": "../../../components/UI/g-input/index", - "g-pannel": "../../../components/UI/g-pannel/index" + "g-pannel": "../../../components/UI/g-panel/index" } } diff --git a/wechatMp/styles/base.less b/wechatMp/styles/base.less index e8089a013..9c5371ea7 100644 --- a/wechatMp/styles/base.less +++ b/wechatMp/styles/base.less @@ -73,3 +73,9 @@ @border-radius-base : 4px; @border-radius-small : 2px; + +@btn-circle-size : 40rpx; + +@btn-circle-size-mini : 30rpx; + +@btn-circle-size-large : 48rpx; diff --git a/wechatMp/styles/cpn.less b/wechatMp/styles/cpn.less deleted file mode 100644 index b5346d419..000000000 --- a/wechatMp/styles/cpn.less +++ /dev/null @@ -1,222 +0,0 @@ -@import "./base.less"; - -//btn -.btn-color(@color) { - color: #fff !important; - background: @color !important; -} - -.btn-primary() { - .btn-color(@primary-color); -} - -.btn-ghost() { - .btn-color(#fff); - - color: @text-color !important; -} - -.g-btn { - display: flex; - align-items: center; - justify-content: center; - vertical-align: middle; - touch-action: manipulation; - cursor: pointer; - background-image: none; - white-space: nowrap; - user-select: none; - font-size: @size-font-base; - border-radius: @border-radius-base; - border: 0 !important; - position: relative; - text-decoration: none; - height: @btn-size-base; - box-shadow: inset 0 0 0 1px rgb(0 0 0 / 10%); - - &-fullWidth { - width: 100% !important; - margin: 0 !important; - } - - &-hover { - opacity: 0.9; - } - - &-long { - border-radius: 0; - margin: 0; - box-shadow: none; - } - - &-large { - font-size: @size-font-large; - height: @btn-size-large; - } - - &-small { - font-size: @size-font-small; - height: @btn-size-small; - } - - &-primary { - .btn-primary; - } - - &-ghost { - .btn-ghost; - } - - &-success { - .btn-color(@success-color); - } - - &-warning { - .btn-color(@warning-color); - } - - &-error { - .btn-color(@error-color); - } - - &-info { - .btn-color(@info-color); - } - - &-loading { - opacity: 0.6; - } - - &-loading-inner { - display: inline-block; - margin-right: 12px; - vertical-align: middle; - width: 14px; - height: 14px; - background: transparent; - border-radius: 50%; - border: 2px solid #fff; - border-color: #fff #fff #fff transparent; - animation: btn-spin 0.6s linear; - animation-iteration-count: infinite; - } - - &-disabled { - color: @btn-disable-color !important; - background: @btn-disable-bg !important; - } -} - -@keyframes btn-spin { - 0% { - transform: rotate(0); - } - - 100% { - transform: rotate(360deg); - } -} - -//form - -.g-form { - position: relative; - display: flex; - flex-direction: column; - background-color: @background-color-base; - border: 0 solid @border-color-base; - border-top-width: 1px; - border-bottom-width: 1px; - - &-item { - position: relative; - display: flex; - align-items: center; - background-color: #fff; - padding: @size-spacing-base; - - &-label { - color: @title-color; - line-height: 1; - min-width: 150rpx; - padding-right: 20rpx; - } - - &-content { - display: flex; - flex: 1; - overflow: hidden; - color: @text-color; - justify-content: flex-end; - } - } -} - -.g-form > view:not(:last-child)::after { - .hairline(); - - border-bottom-width: 1px; - left: 15px; - right: 0; -} - -//input -.g-input { - flex: 1; - line-height: 1.6; - padding: 4px 0; - min-height: 22px; - height: auto; - - &-border { - text-align: right; - } - - &-error { - color: @error-color; - } -} - -//pannel -.g-cell { - padding: @size-spacing-base; - display: flex; - align-items: center; - justify-content: space-between; - background-color: #fff; -} - -.g-pannel { - display: flex; - flex-direction: column; - - &-title { - padding: @size-spacing-small @size-spacing-base; - font-size: @size-font-base; - color: @title-color; - } -} - -.g-border-radius { - border: 1px solid @border-color-base; - border-radius: @btn-border-radius; -} - -.g-border-error { - border-color: @error-color; -} - -//hairline -.hairline() { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 200%; - height: 200%; - transform: scale(0.5); - transform-origin: 0 0; - pointer-events: none; - box-sizing: border-box; - border: 0 solid @border-color-split; -}