common.scss 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. @import "~/assets/css/tool.scss";
  2. // @import "~/assets/css/font/iconfont.css";
  3. @import "~/assets/bqfl1/iconfont.css";
  4. @import "~/assets/font/iconfont.css";
  5. // .mywow {
  6. // // display: none;
  7. // transform: translateX(-10000000px);
  8. // }
  9. * {
  10. // padding: 0;
  11. // margin: 0;
  12. box-sizing: border-box;
  13. }
  14. a {
  15. text-decoration: none;
  16. /* 去除默认的下划线 */
  17. color: inherit;
  18. /* 去除默认的颜色和点击后变化的颜色 */
  19. }
  20. @include responseTo("pc") {
  21. html,
  22. body {
  23. // min-width: 1500px;
  24. color: var(--color-01);
  25. font-weight: var(--weight-400);
  26. font-family: var(--family-01);
  27. margin: 0;
  28. }
  29. .container {
  30. // padding-top: 170px;
  31. }
  32. body {
  33. max-width: 1920px;
  34. margin: auto;
  35. }
  36. .center1200 {
  37. width: 1200px !important;
  38. margin: 0 auto !important;
  39. }
  40. .center1440 {
  41. width: 1440px !important;
  42. margin: 0 auto !important;
  43. }
  44. .center1670 {
  45. width: 1670px !important;
  46. margin: 0 auto !important;
  47. }
  48. }
  49. img {
  50. line-height: 1;
  51. }
  52. .one-row {
  53. white-space: nowrap;
  54. overflow: hidden;
  55. text-overflow: ellipsis;
  56. }
  57. .bg {
  58. background-repeat: no-repeat;
  59. background-position: center center;
  60. background-size: cover;
  61. }
  62. .center-btn {
  63. width: auto;
  64. min-width: var(--size-178);
  65. min-height: var(--size-50);
  66. background: linear-gradient(-45deg, #2cbac0 0%, #006efe 100%), #006efe;
  67. border-radius: 4px;
  68. display: inline-flex;
  69. justify-content: center;
  70. align-items: center;
  71. font-size: var(--size-18);
  72. font-family: var(--family-01);
  73. font-weight: var(--weight-400);
  74. color: #ffffff;
  75. }
  76. .btn-01 {
  77. width: 1px;
  78. display: inline-flex;
  79. justify-content: center;
  80. align-items: center;
  81. flex-wrap: nowrap;
  82. min-width: var(--size-178);
  83. min-height: var(--size-50);
  84. padding: 0 var(--size-20);
  85. background: #ffffff;
  86. border: 1px solid var(--color-04);
  87. border-radius: var(--size-4);
  88. font-size: var(--size-18);
  89. font-family: var(--family-01);
  90. font-weight: var(--weight-400);
  91. color: var(--color-04);
  92. }
  93. .load {
  94. position: fixed;
  95. top: 45%;
  96. left: 50%;
  97. // .n-spin-description {
  98. // color: #b10000;
  99. // }
  100. // .n-base-loading__icon {
  101. // color: #b10000 !important;
  102. // }
  103. }
  104. .n-dropdown-menu.en .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__label {
  105. font-size: 0.85em;
  106. }
  107. /** 个人中心共用样式 */
  108. .personal-center {
  109. padding: var(--size-220) var(--size-220) var(--size-40) var(--size-220);
  110. background-color: #f5f5f5;
  111. .center-component {
  112. width: 100%;
  113. min-height: var(--size-220);
  114. // background-color: #ffffff;
  115. border-radius: var(--size-16);
  116. overflow: hidden;
  117. display: flex;
  118. background-color: #ffffff;
  119. .center-component-right {
  120. flex: 1;
  121. .component-right-head {
  122. width: 100%;
  123. display: flex;
  124. align-items: center;
  125. justify-content: space-between;
  126. border-bottom: var(--size-3) solid #f5f5f5;
  127. padding: var(--size-40) var(--size-30) var(--size-14) var(--size-54);
  128. .head-title {
  129. flex: 1;
  130. color: #1a1a1a;
  131. margin: 0;
  132. font-size: var(--size-24);
  133. font-weight: 700;
  134. }
  135. }
  136. .component-right-body {
  137. padding: var(--size-40) var(--size-30) var(--size-14) var(--size-54);
  138. }
  139. }
  140. }
  141. }
  142. // 表格样式
  143. .table-style {
  144. box-sizing: border-box;
  145. .th-sort {
  146. display: flex;
  147. justify-content: center;
  148. .iconfont {
  149. color: #ff6a00;
  150. margin-right: var(--size-4);
  151. }
  152. span {
  153. min-width: var(--size-70);
  154. }
  155. }
  156. th {
  157. background-color: #fff7f1;
  158. font-weight: 700;
  159. font-size: var(--size-16);
  160. box-sizing: border-box;
  161. }
  162. td,
  163. th {
  164. text-align: center;
  165. word-wrap: break-word;
  166. /* 或者使用 overflow-wrap: break-word; */
  167. white-space: normal;
  168. /* 默认值,允许文本换行 */
  169. }
  170. tr:nth-of-type(even) td {
  171. background-color: #f7f7f7 !important;
  172. }
  173. .highlight {
  174. display: block;
  175. color: #0090ff;
  176. cursor: pointer;
  177. }
  178. .highlight.ver {
  179. color: #06a71b;
  180. margin-top: var(--size-10);
  181. }
  182. }
  183. // 表格分页样式
  184. .table-pagination {
  185. display: flex;
  186. justify-content: center;
  187. margin-top: var(--size-50);
  188. padding-bottom: var(--size-20);
  189. }