u-index.scss 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. /* start--去除webkit的默认样式--start */
  2. .u-fix-ios-appearance {
  3. -webkit-appearance:none;
  4. }
  5. /* end--去除webkit的默认样式--end */
  6. /* start--icon图标外层套一个view,让其达到更好的垂直居中的效果--start */
  7. .u-icon-wrap {
  8. display: flex;
  9. align-items: center;
  10. }
  11. /* end-icon图标外层套一个view,让其达到更好的垂直居中的效果--end */
  12. /* start--iPhoneX底部安全区定义--start */
  13. .safe-area-inset-bottom {
  14. padding-bottom: 0;
  15. padding-bottom: constant(safe-area-inset-bottom);
  16. padding-bottom: env(safe-area-inset-bottom);
  17. }
  18. /* end-iPhoneX底部安全区定义--end */
  19. /* start--各种hover点击反馈相关的类名-start */
  20. .u-hover-class {
  21. // background-color: #f7f8f9!important;
  22. opacity: 0.6;
  23. }
  24. .u-cell-hover {
  25. background-color: #f7f8f9!important;
  26. }
  27. /* end--各种hover点击反馈相关的类名--end */
  28. /* start--文本行数限制--start */
  29. .u-line-1 {
  30. overflow: hidden;
  31. white-space: nowrap;
  32. text-overflow: ellipsis;
  33. }
  34. .u-line-2 {
  35. -webkit-line-clamp: 2;
  36. }
  37. .u-line-3 {
  38. -webkit-line-clamp: 3;
  39. }
  40. .u-line-4 {
  41. -webkit-line-clamp: 4;
  42. }
  43. .u-line-5 {
  44. -webkit-line-clamp: 5;
  45. }
  46. .u-line-2, .u-line-3, .u-line-4, .u-line-5 {
  47. overflow: hidden;
  48. word-break: break-all;
  49. text-overflow: ellipsis;
  50. display: -webkit-box; // 弹性伸缩盒
  51. -webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
  52. }
  53. /* end--文本行数限制--end */
  54. /* start--Retina 屏幕下的 1px 边框--start */
  55. .u-border,
  56. .u-border-bottom,
  57. .u-border-left,
  58. .u-border-right,
  59. .u-border-top,
  60. .u-border-top-bottom {
  61. position: relative
  62. }
  63. .u-border-bottom:after,
  64. .u-border-left:after,
  65. .u-border-right:after,
  66. .u-border-top-bottom:after,
  67. .u-border-top:after,
  68. .u-border:after {
  69. /* #ifndef APP-NVUE */
  70. content: ' ';
  71. /* #endif */
  72. position: absolute;
  73. left: 0;
  74. top: 0;
  75. pointer-events: none;
  76. box-sizing: border-box;
  77. -webkit-transform-origin: 0 0;
  78. transform-origin: 0 0;
  79. // 多加0.1%,能解决有时候边框缺失的问题
  80. width: 199.8%;
  81. height: 199.7%;
  82. transform: scale(0.5, 0.5);
  83. border: 0 solid #e2e2e2;
  84. z-index: 2;
  85. }
  86. .u-border-top:after {
  87. border-top-width: 1px
  88. }
  89. .u-border-left:after {
  90. border-left-width: 1px
  91. }
  92. .u-border-right:after {
  93. border-right-width: 1px
  94. }
  95. .u-border-bottom:after {
  96. border-bottom-width: 1px
  97. }
  98. .u-border-top-bottom:after {
  99. border-width: 1px 0
  100. }
  101. .u-border:after {
  102. border-width: 1px
  103. }
  104. /* end--Retina 屏幕下的 1px 边框--end */
  105. /* start--clearfix--start */
  106. .u-clearfix:after,
  107. .clearfix:after {
  108. /* #ifndef APP-NVUE */
  109. content: '';
  110. /* #endif */
  111. display: table;
  112. clear: both
  113. }
  114. /* end--clearfix--end */
  115. /* start--高斯模糊tabbar底部处理--start */
  116. .u-blur-effect-inset {
  117. width: 750rpx;
  118. height: var(--window-bottom);
  119. background-color: #FFFFFF;
  120. }
  121. /* end--高斯模糊tabbar底部处理--end */
  122. /* start--提升H5端uni.toast()的层级,避免被uView的modal等遮盖--start */
  123. /* #ifdef H5 */
  124. uni-toast {
  125. z-index: 10090;
  126. }
  127. uni-toast .uni-toast {
  128. z-index: 10090;
  129. }
  130. /* #endif */
  131. /* end--提升H5端uni.toast()的层级,避免被uView的modal等遮盖--end */
  132. /* start--去除button的所有默认样式--start */
  133. .u-reset-button {
  134. padding: 0;
  135. font-size: inherit;
  136. line-height: inherit;
  137. background-color: transparent;
  138. color: inherit;
  139. }
  140. .u-reset-button::after {
  141. border: none;
  142. }
  143. /* end--去除button的所有默认样式--end */