createroom.wxss 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. /**创建房间页**/
  2. page {
  3. background: #f5f5f5;
  4. padding: 10rpx 0;
  5. }
  6. /**每个人物 box**/
  7. .itemroom-container {
  8. display: flex;
  9. justify-content: center;
  10. align-content: space-between;
  11. flex-wrap: wrap;
  12. padding-bottom: 300rpx;
  13. padding-top: 30rpx;
  14. }
  15. .itemroom-item {
  16. width: 210rpx;
  17. height: 284rpx;
  18. background: #fff;
  19. box-shadow: 0 4rpx 6rpx 0 #e2e2e2;
  20. margin: 0rpx auto 30rpx;
  21. border-radius: 10rpx;
  22. padding: 20rpx 15rpx;
  23. box-sizing: border-box;
  24. }
  25. .itemroom-pic {
  26. width: 140rpx;
  27. height: 140rpx;
  28. margin: 0 auto;
  29. }
  30. .itemroom-pic image {
  31. width: 140rpx;
  32. height: 140rpx;
  33. }
  34. .itemroom-text .name {
  35. color: #333;
  36. font-size: 30rpx;
  37. display: block;
  38. text-align: center;
  39. margin-top: 15rpx;
  40. margin-bottom: 10rpx;
  41. }
  42. .itemroom-operate {
  43. display: flex;
  44. justify-content: space-around;
  45. align-items: center;
  46. align-content: center;
  47. }
  48. .itemroom-reduce {
  49. width: 36rpx;
  50. height: 36rpx;
  51. border-radius: 36rpx;
  52. line-height: 36rpx;
  53. text-align: center;
  54. color: #fff;
  55. background: #ff5252;
  56. font-size: 36rpx;
  57. vertical-align: middle;
  58. box-sizing: border-box;
  59. }
  60. .itemroom-add {
  61. width: 36rpx;
  62. height: 36rpx;
  63. border-radius: 36rpx;
  64. line-height: 36rpx;
  65. text-align: center;
  66. color: #fff;
  67. background: #256df2;
  68. font-size: 36rpx;
  69. vertical-align: bottom;
  70. box-sizing: border-box;
  71. }
  72. .itemroom-no{
  73. background: #999999;
  74. }
  75. .itemroom-num{
  76. color: #333;
  77. font-size: 36rpx;
  78. }
  79. /*创建房间底部*/
  80. .itemroom-bottom{
  81. position: fixed;
  82. bottom: 0;
  83. left: 0;
  84. width: 100%;
  85. min-height: 275rpx;
  86. background: #fff;
  87. box-shadow: 0 -2px 6px 0 rgba(0, 0, 0, 0.1);
  88. padding: 30rpx;
  89. box-sizing: border-box;
  90. }
  91. .itemroom-setting{
  92. min-height: 58rpx;
  93. }
  94. .itemroom-setting text:last-child .douhao{
  95. display: none;
  96. }
  97. .itemroom-setting text{
  98. font-size: 24rpx;
  99. color: #333;
  100. }
  101. .itemroom-total{
  102. font-size: 30rpx;
  103. text-align: center;
  104. color: #6882FF;
  105. margin-top: 20rpx;
  106. }
  107. .itemroom-btn{
  108. width: 100%;
  109. height: 100rpx;
  110. background: #6882ff;
  111. color: #fff;
  112. line-height: 100rpx;
  113. text-align: center;
  114. border-radius: 10rpx;
  115. font-size: 32rpx;
  116. margin-right: auto;
  117. margin-left: auto;
  118. margin-top: 40rpx;
  119. }