diff --git a/miniprogram/components/introduction-popup/introduction-popup.less b/miniprogram/components/introduction-popup/introduction-popup.less index 2dc85bd..28b7c41 100644 --- a/miniprogram/components/introduction-popup/introduction-popup.less +++ b/miniprogram/components/introduction-popup/introduction-popup.less @@ -8,11 +8,16 @@ z-index: 9999; &-title { + position: absolute; + top: 52rpx; + left: 50%; + transform: translateX(-50%); text-align: center; color: rgba(255, 235, 59, 0.95); font-size: 40rpx; font-weight: bold; - margin-top: 52rpx; + width: 100%; + // margin-top: 52rpx; } .tip-box { @@ -21,15 +26,19 @@ .tip-text { color: rgba(255, 235, 59, 0.95); + // color: #fff; font-size: 32rpx; } .first-step { - position: relative; + position: absolute; + top: 128rpx; + left: 0; + width: 100%; .tip-box { position: absolute; - top: 18rpx; + top: 0; left: 50%; transform: translateX(-50%); width: 342px; @@ -40,7 +49,7 @@ .guide-icon { position: absolute; - top: 66rpx; + top: 48rpx; left: 106rpx; width: 22px; height: 39px; @@ -49,7 +58,7 @@ .tip-text { position: absolute; - top: 156rpx; + top: 138rpx; left: 110rpx; width: 550rpx; height: 94rpx; @@ -57,4 +66,12 @@ } } + .btn-next-step { + color: rgba(255, 235, 59, 0.95); + border-radius: 28rpx; + position: absolute; + top: 260rpx; + left: 50%; + transform: translateX(-50%); + } } \ No newline at end of file diff --git a/miniprogram/components/introduction-popup/introduction-popup.wxml b/miniprogram/components/introduction-popup/introduction-popup.wxml index 2cd629e..d38152e 100644 --- a/miniprogram/components/introduction-popup/introduction-popup.wxml +++ b/miniprogram/components/introduction-popup/introduction-popup.wxml @@ -11,5 +11,12 @@ 这里请输入你想让小朋友熟悉的汉字、字母、数字等,点击“确定” + + 下一步 + diff --git a/miniprogram/ui/button/button.less b/miniprogram/ui/button/button.less index 1416a54..5da0a17 100644 --- a/miniprogram/ui/button/button.less +++ b/miniprogram/ui/button/button.less @@ -3,6 +3,12 @@ @button-default-font-size: 32rpx; @button-default-color: #fff; +wx-button:not([size=mini]) { + margin-left: auto; + margin-right: auto; + width: auto; +} + .toy-button { box-sizing: border-box; display: inline-flex; @@ -13,6 +19,9 @@ border-radius: @button-border-radius; font-size: @button-default-font-size; color: @button-default-color; + padding: 0 44rpx; + width: auto !important; + &--primary { background: rgba(255, 215, 25, 1); @@ -46,6 +55,32 @@ } } + &--white { + color: rgba(34, 36, 37, 0.9); + background: #fff; + box-shadow: 0 10rpx 0 rgba(255, 255, 255, 0.7); + + &.disabled { + background: rgba(255, 255, 255, 0.8); + box-shadow: 0px 3px 0px rgba(255, 255, 255, 0.55); + } + + &.plain { + color: #fff; + background: rgba(255, 255, 255, 0.2); + border: 1px solid rgba(255, 255, 255, 1); + box-shadow: 0px 3px 0px rgba(255, 255, 255, 0.88); + + // &.disabled { + // background: rgba(255, 255, 255, 0.2); + // border: 1px solid rgba(255, 255, 255, 0.6); + // box-shadow: 0px 3px 0px rgba(255, 255, 255, 0.6); + // } + } + } + + + .loading-class, &__icon { margin-right: 24rpx; diff --git a/miniprogram/ui/button/button.ts b/miniprogram/ui/button/button.ts index bfbc1e5..82961a8 100644 --- a/miniprogram/ui/button/button.ts +++ b/miniprogram/ui/button/button.ts @@ -10,6 +10,10 @@ Component({ type: String, value: 'default', // primary, green, white }, + plain: { + type: Boolean, + value: false, // 是否朴素按钮 + }, size: { type: String, value: 'normal', // large, normal, small, mini @@ -88,4 +92,5 @@ Component({ this.triggerEvent('click', e); }, }, + externalClasses: ['custom-class'], }); diff --git a/miniprogram/ui/button/button.wxml b/miniprogram/ui/button/button.wxml index 0a159dd..e8e017f 100644 --- a/miniprogram/ui/button/button.wxml +++ b/miniprogram/ui/button/button.wxml @@ -4,7 +4,7 @@