weui-cell.less 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. @import "../../base/fn.less";
  2. .weui-cells {
  3. position: relative;
  4. margin-top: @weuiCellsMarginTop;
  5. background-color: @weuiCellBg;
  6. line-height: @weuiCellLineHeight;
  7. font-size: @weuiCellFontSize; //cell中间有效高度23px,跟客户端默认图标尺寸一致
  8. &:before {
  9. .setTopLine(@weuiCellBorderColor);
  10. }
  11. &:after {
  12. .setBottomLine(@weuiCellBorderColor);
  13. }
  14. }
  15. .weui-cells__title {
  16. margin-top: .77em; // 15px - 行高
  17. margin-bottom: .3em; // 8px - 行高
  18. padding-left: @weuiCellGapH;
  19. padding-right: @weuiCellGapH;
  20. color: @weuiTextColorGray;
  21. font-size: @weuiCellTipsFontSize;
  22. }
  23. .weui-cells_after-title{
  24. margin-top: 0;
  25. }
  26. .weui-cells__tips {
  27. margin-top: .3em; // 8px - 行高
  28. color: @weuiTextColorGray;
  29. padding-left: @weuiCellGapH;
  30. padding-right: @weuiCellGapH;
  31. font-size: @weuiCellTipsFontSize;
  32. }
  33. .weui-cell {
  34. padding: @weuiCellGapV @weuiCellGapH;
  35. position: relative; //这个是为了兼容cells容器onepx方案被before挡住而做的
  36. display: flex;
  37. align-items: center;
  38. &:before {
  39. .setTopLine(@weuiCellBorderColor);
  40. left: @weuiCellGapH;
  41. }
  42. &:first-child {
  43. &:before {
  44. display: none;
  45. }
  46. }
  47. }
  48. .weui-cell_active {
  49. background-color: @weuiCellActiveBg;
  50. }
  51. .weui-cell_primary{
  52. align-items: flex-start;
  53. }
  54. .weui-cell__bd{
  55. flex: 1;
  56. }
  57. .weui-cell__ft {
  58. text-align: right;
  59. color: @weuiTextColorGray;
  60. }