navigator.less 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. .navigator {
  2. display: flex;
  3. justify-content: space-between;
  4. background: white;
  5. height: 100%;
  6. padding: 0 20px;
  7. .navigator-menu {
  8. border-bottom: none;
  9. .nav-page {
  10. font-size: 16px;
  11. border-bottom: none !important;
  12. .hover {
  13. ::after {
  14. z-index: 1;
  15. width: calc(~"100% - 8px");
  16. }
  17. }
  18. ::after {
  19. content: ' ';
  20. display: block;
  21. position: absolute;
  22. left: 0;
  23. right: 0;
  24. bottom: 0;
  25. width: 0;
  26. height: 2px;
  27. margin: -2px auto;
  28. box-shadow: inset 0 2px #1890ff;
  29. transition: width .25s cubic-bezier(0.31, 0.93, 1, 1);
  30. }
  31. }
  32. .ant-menu-item-selected {
  33. ::after {
  34. z-index: 1;
  35. width: calc(~"100% - 8px");
  36. box-shadow: inset 0 2px #1890ff;
  37. }
  38. }
  39. .ant-menu-item-active {
  40. ::after {
  41. width: calc(100% - 8px);
  42. }
  43. }
  44. }
  45. .navigator-right {
  46. .user-icon {
  47. margin: 0 5px 2px;
  48. }
  49. .user-name {
  50. cursor: pointer;
  51. }
  52. }
  53. }