classic.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. #container{
  2. display: none;
  3. }
  4. .el-container {
  5. width: 100%;
  6. height: 100%;
  7. }
  8. .el-container .el-header {
  9. box-sizing: border-box;
  10. display: flex;
  11. align-items: center;
  12. justify-content: space-between;
  13. height: 55px;
  14. padding:0;
  15. background-color: var(--el-color-primary);
  16. border-bottom: 1px solid var(--el-border-color-light);
  17. }
  18. .dark .el-container .el-header {
  19. background-color: #141414;
  20. color: #bdbdc0;
  21. }
  22. .breadcrumb-box .el-breadcrumb .el-breadcrumb__item .el-breadcrumb__inner .breadcrumb-title {
  23. margin-top: 3px;
  24. color: #eaeaea;
  25. }
  26. .el-container .el-header .header-lf {
  27. display: flex;
  28. align-items: center;
  29. overflow: hidden;
  30. white-space: nowrap;
  31. }
  32. .el-container .el-header .header-lf .tool-bar-lf{
  33. margin-left: 15px;
  34. }
  35. .el-container .el-header .header-lf .logo {
  36. flex-shrink: 0;
  37. width: 195px;
  38. margin-right: 15px;
  39. display: flex;
  40. align-items: center;
  41. }
  42. .el-container .el-header .header-lf .logo .logo-img {
  43. width: 34px;
  44. object-fit: contain;
  45. margin-right: 5px;
  46. }
  47. .el-container .el-header .header-lf .logo .logo-text {
  48. font-size: 21.5px;
  49. font-weight: bold;
  50. color: #fff;
  51. white-space: nowrap;
  52. }
  53. .el-container .el-header .header-lf .tool-bar-lf .collapse-icon {
  54. color: #ffffff;
  55. }
  56. .el-container .el-header .header-lf .tool-bar-lf .el-breadcrumb__separator {
  57. color: #ffffff;
  58. }
  59. .el-container .el-header .header-lf .tool-bar-lf .el-breadcrumb__inner.is-link {
  60. color: #eaeaea;
  61. }
  62. .el-container .el-header .header-lf .tool-bar-lf .el-breadcrumb__inner.is-link:hover {
  63. color: #ffffff;
  64. }
  65. .el-container .el-header .header-lf .tool-bar-lf .el-breadcrumb__item:last-child .el-breadcrumb__inner,
  66. .el-container .el-header .header-lf .tool-bar-lf .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover {
  67. color: #eaeaea;
  68. }
  69. .el-container .el-header .header-ri .tool-bar-ri .toolBar-icon,
  70. .el-container .el-header .header-ri .tool-bar-ri .el-dropdown,
  71. .el-container .el-header .header-ri .tool-bar-ri .toolBar-dropdown,
  72. .el-container .el-header .header-ri .tool-bar-ri .username {
  73. color: #ffffff;
  74. outline:none;
  75. }
  76. .dark .el-container .el-header .header-ri .tool-bar-ri .toolBar-icon,
  77. .dark .el-container .el-header .header-ri .tool-bar-ri .el-dropdown,
  78. .dark .el-container .el-header .header-ri .tool-bar-ri .toolBar-dropdown,
  79. .dark .el-container .el-header .header-ri .tool-bar-ri .username {
  80. color: #bdbdc0;
  81. }
  82. .tool-bar-ri > .el-dropdown:hover,
  83. .tool-bar-ri > .toolBar-dropdown:hover,
  84. .tool-bar-ri > .toolBar-icon:hover,
  85. .tool-bar-ri > .toolBar-userinfo:hover{
  86. background: var(--el-color-primary-light-3);
  87. }
  88. .el-container .classic-content {
  89. display: flex;
  90. height: calc(100% - 55px);
  91. }
  92. .el-container .classic-content .el-aside {
  93. width: auto;
  94. background-color: var(--el-menu-bg-color);
  95. border-right: 1px solid var(--el-border-color-light);
  96. }
  97. .el-container .classic-content .el-aside .aside-box {
  98. display: flex;
  99. flex-direction: column;
  100. height: 100%;
  101. transition: width 0.3s ease;
  102. }
  103. .el-container .classic-content .el-aside .aside-box .el-menu {
  104. width: 100%;
  105. overflow-x: hidden;
  106. border-right: none;
  107. }
  108. .el-container .classic-content .classic-main {
  109. display: flex;
  110. flex-direction: column;
  111. }
  112. .tool-bar-ri .el-badge__content{
  113. border: 1px solid var(--el-color-danger);
  114. }