login.vue 808 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <view class="container">
  3. <img src="../../static/index/logo.png" />
  4. <view class="msg">靖安乡村民宿</view>
  5. <view class="btn">授权登录</view>
  6. </view>
  7. </template>
  8. <script>
  9. export default {
  10. data() {
  11. return {}
  12. }
  13. }
  14. </script>
  15. <style lang="scss" scoped>
  16. .container {
  17. display: flex;
  18. flex-direction: column;
  19. align-items: center;
  20. height: 100vh;
  21. background-color: #fff;
  22. img {
  23. margin-top: 116rpx;
  24. width: 138rpx;
  25. height: 138rpx;
  26. }
  27. .msg {
  28. margin-top: 32rpx;
  29. font-size: 32rpx;
  30. font-weight: bold;
  31. }
  32. .btn {
  33. position: absolute;
  34. // left: 20rpx;
  35. bottom: 74rpx;
  36. display: flex;
  37. justify-content: center;
  38. align-items: center;
  39. width: 710rpx;
  40. height: 96rpx;
  41. color: #fff;
  42. font-size: 32rpx;
  43. border-radius: 64rpx;
  44. background-color: #096562;
  45. }
  46. }
  47. </style>