Navigator.less 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. @import "~assets/less/variable";
  2. .header {
  3. height: 64px;
  4. background-color: @body-background;
  5. box-shadow: @header-box-shadow;
  6. flex-shrink: 0;
  7. z-index: @header-index;
  8. display: flex;
  9. flex-direction: row;
  10. justify-content: space-between;
  11. align-items: center;
  12. &.hide {
  13. display: none;
  14. }
  15. }
  16. .logo {
  17. width: 200px;
  18. height: 64px;
  19. display: flex;
  20. flex-direction: column;
  21. justify-content: center;
  22. align-items: center;
  23. a {
  24. line-height: 0;
  25. }
  26. img {
  27. width: 160px;
  28. height: 32px;
  29. }
  30. }
  31. @media (min-width: 768px) {
  32. .logoPc {
  33. display: block;
  34. }
  35. .logoMobile {
  36. display: none;
  37. }
  38. }
  39. @media (max-width: 768px) {
  40. .logoPc {
  41. display: none;
  42. }
  43. .logoMobile {
  44. display: block;
  45. img {
  46. margin-left: -142px;
  47. }
  48. }
  49. }
  50. .tools {
  51. margin-right: 16px;
  52. display: flex;
  53. flex-direction: row;
  54. li {
  55. width: 50px;
  56. height: 50px;
  57. display: flex;
  58. flex-direction: column;
  59. justify-content: center;
  60. align-items: center;
  61. i {
  62. font-size: 24px;
  63. cursor: pointer;
  64. }
  65. }
  66. }