BasicLayout.less 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. @import "~antd/lib/style/themes/default.less";
  2. .header {
  3. padding: 0 16px 0 0;
  4. background: #fff;
  5. box-shadow: 0 1px 4px rgba(0, 21, 41, .12);
  6. position: relative;
  7. }
  8. .logo {
  9. height: 64px;
  10. position: relative;
  11. line-height: 64px;
  12. padding-left: 32px;
  13. transition: all .3s;
  14. background: #00284d;
  15. overflow: hidden;
  16. img {
  17. display: inline-block;
  18. vertical-align: middle;
  19. height: 32px;
  20. }
  21. h1 {
  22. color: #fff;
  23. display: inline-block;
  24. vertical-align: middle;
  25. font-size: 22px;
  26. margin-left: 12px;
  27. font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  28. margin-top: -2px;
  29. }
  30. }
  31. :global(.ant-layout-sider-collapsed) .logo {
  32. padding-left: 24px;
  33. > a {
  34. width: 32px;
  35. }
  36. }
  37. .trigger {
  38. font-size: 20px;
  39. line-height: 64px;
  40. cursor: pointer;
  41. transition: all .3s;
  42. padding: 0 28px;
  43. &:hover {
  44. background: rgba(0, 0, 0, .04);
  45. }
  46. }
  47. .right {
  48. float: right;
  49. height: 100%;
  50. .action {
  51. cursor: pointer;
  52. padding: 0 12px;
  53. display: inline-block;
  54. transition: all .3s;
  55. height: 100%;
  56. > i {
  57. font-size: 16px;
  58. vertical-align: middle;
  59. }
  60. &:global(.ant-popover-open),
  61. &:hover {
  62. background: rgba(0, 0, 0, .04);
  63. }
  64. }
  65. .search {
  66. padding: 0;
  67. margin: 0 12px;
  68. &:hover {
  69. background: transparent;
  70. }
  71. }
  72. .account {
  73. .avatar {
  74. margin: 20px 8px 20px 0;
  75. color: @primary-color;
  76. background: rgba(255, 255, 255, .85);
  77. vertical-align: middle;
  78. }
  79. }
  80. }
  81. .menu {
  82. :global(.anticon) {
  83. margin-right: 8px;
  84. }
  85. :global(.ant-dropdown-menu-item) {
  86. padding-left: 16px;
  87. padding-right: 16px;
  88. width: 190px;
  89. }
  90. }
  91. :global {
  92. .ant-layout {
  93. overflow-x: hidden;
  94. }
  95. }