index.less 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. @import "../styles/mixins/index.less";
  2. @import "../styles/themes/index.less";
  3. .@{wux-prefix}-cell {
  4. .button-reset();
  5. padding: @cell-padding;
  6. position: relative;
  7. display: flex;
  8. align-items: center;
  9. background: @cell-bg;
  10. &--align-flex-start {
  11. align-items: flex-start;
  12. }
  13. &--align-center {
  14. align-items: center;
  15. }
  16. &--has-line&::after {
  17. .setBottomLine(@border-color-split);
  18. left: 15px;
  19. }
  20. &--has-line&--last::after {
  21. display: none;
  22. }
  23. &--hover {
  24. background-color: @active-state-bg !important;
  25. }
  26. &--disabled {
  27. opacity: @disabled-opacity;
  28. }
  29. &__thumb {
  30. .square(@cell-icon-size);
  31. display: block;
  32. margin-right: @margin-component-base;
  33. }
  34. &__bd {
  35. flex: 1;
  36. }
  37. &__text {
  38. text-align: left;
  39. }
  40. &__desc {
  41. text-align: left;
  42. line-height: 1.2;
  43. font-size: @font-size-sm;
  44. color: @text-color-secondary;
  45. }
  46. &__ft {
  47. display: flex;
  48. align-self: center;
  49. text-align: right;
  50. color: @text-color-secondary;
  51. }
  52. &__arrow:not(:empty) {
  53. flex: none;
  54. display: flex;
  55. align-items: center;
  56. margin-left: @margin-component-base;
  57. }
  58. &--access > &__ft {
  59. padding-right: 19px;
  60. position: relative;
  61. &::after {
  62. content: " ";
  63. .setArrow(right);
  64. transform: rotate(0) translateY(-50%);
  65. position: absolute;
  66. top: 50%;
  67. right: 0;
  68. }
  69. }
  70. }