小程序彈框之Dialog


<view class='mask' bindtap='closeTk' wx:if="{{showTk}}"></view>
<view class="mask_model" wx:if="{{showTk}}">
  <view class="mask_tit">
    <image bindtap='closeTk' src="../../../imgs/del.png"></image>
  </view>
  <view class="mask_content">
    <input value="{{sms_text}}" bindblur="inputText" type="text" placeholder="請輸入活動文案"></input>
    <view class="btn_save" bindtap='saveTem'>確定</view>
  </view>
</view>
/* 蒙層 */
.mask {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 100;
}

.mask_model {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 650rpx;
  height: 278rpx;
  margin: auto;
  background: #fff;
  border-radius: 10rpx;
  z-index: 101;
  box-sizing: border-box;
}

.mask_tit {
  height: 60rpx;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.mask_tit image {
  width: 30rpx;
  height: 30rpx;
  padding: 15rpx 30rpx;
}

.mask_content {
  color: #666;
  line-height: 38rpx;
  font-size: 26rpx;
  text-align: center;
  padding: 0 35rpx;
}

.mask_content input {
  width: 580rpx;
  height: 88rpx;
  text-align: center;
  border-radius: 10rpx;
  border: 1rpx solid #d7d7d7;
}

.btn_save {
  width: 220rpx;
  height: 66rpx;
  background: rgba(252, 192, 46, 1);
  border-radius: 33rpx;
  text-align: center;
  line-height: 66rpx;
  color: #fff;
  margin: 28rpx auto 0;
  font-size: 30rpx;
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM