index.less 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. .app-header {
  2. display: flex;
  3. justify-content: space-between;
  4. align-items: center;
  5. min-height: var(--statusbar-height);
  6. color: #fff;
  7. background-color: var(--header-bg);
  8. //background-color: #2c875f;
  9. //border-bottom: 1px solid #f2f2f2;
  10. padding: 0 20px;
  11. &__left {
  12. display: flex;
  13. align-items: center;
  14. /deep/ .el-breadcrumb__inner {
  15. color: #fff;
  16. &.is-link {
  17. color: inherit;
  18. }
  19. }
  20. }
  21. &__right {
  22. display: flex;
  23. align-items: center;
  24. .iconbar {
  25. display: flex;
  26. align-items: center;
  27. gap: 20px;
  28. [class^='g-icon'] {
  29. cursor: pointer;
  30. &:before {
  31. font-size: 22px;
  32. }
  33. }
  34. .g-icon {
  35. &--notice::before {
  36. content: var(--icon-notice);
  37. }
  38. &--message::before {
  39. content: var(--icon-message);
  40. }
  41. &--counter::before {
  42. content: var(--icon-counter);
  43. }
  44. &--certificate::before {
  45. content: var(--icon-certificate);
  46. }
  47. &--minimize::before {
  48. content: var(--icon-minimize);
  49. }
  50. &--maximize::before {
  51. content: var(--icon-maximize);
  52. }
  53. }
  54. }
  55. .user-dropdown {
  56. color: #fff;
  57. margin-left: 20px;
  58. &__link {
  59. display: flex;
  60. align-items: center;
  61. font-weight: bold;
  62. cursor: pointer;
  63. }
  64. .g-image--avatar {
  65. width: 32px;
  66. height: 32px;
  67. border-radius: 50%;
  68. font-size: 0;
  69. margin-right: 4px;
  70. }
  71. }
  72. }
  73. }