header.less 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. .flexBase {
  2. display: flex;
  3. justify-content: center;
  4. align-items: center;
  5. background: #f9f9f9;
  6. }
  7. .table_header_wrapper {
  8. width: 100%;
  9. height: 60px;
  10. display: flex;
  11. border-top: 1px solid rgba(217, 218, 219, .8);
  12. .left:extend(.flexBase) {
  13. width: 73px;
  14. height: 100%;
  15. background: white;
  16. box-shadow: 0px 0px 0px 1px rgba(217, 218, 219, .8);
  17. }
  18. .right {
  19. width: calc(100% - 73px);
  20. height: 100%;
  21. .top {
  22. display: flex;
  23. width: 100%;
  24. height: 40px;
  25. .before:extend(.flexBase) {
  26. width: 50%;
  27. height: 100%;
  28. border-right: 1px solid rgba(217, 218, 219, .8);
  29. border-left: 1px solid rgba(217, 218, 219, .8);
  30. }
  31. .after :extend(.flexBase) {
  32. width: 50%;
  33. height: 100%;
  34. border-right: 1px solid rgba(217, 218, 219, .8);
  35. }
  36. }
  37. .foot {
  38. width: 100%;
  39. height: calc(100% - 40px);
  40. display: grid;
  41. grid-template-columns: repeat(24, 1fr);
  42. .ant-typography {
  43. &:extend(.flexBase);
  44. &:first-child {
  45. border-left: 1px solid rgba(217, 218, 219, .8);
  46. }
  47. height: 19px;
  48. border-bottom: 1px solid rgba(217, 218, 219, .8);
  49. border-top: 1px solid rgba(217, 218, 219, .8);
  50. border-right: 1px solid rgba(217, 218, 219, .8);
  51. }
  52. }
  53. }
  54. }