index.less 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. @import './reset.less';
  2. @headerHt:50px;
  3. @menuLiHt:40px;
  4. @menuWt:300px;
  5. @activeColor:#5A8EEE;
  6. @activeBg:#EEF4FF;
  7. .container{
  8. height: 100%;
  9. }
  10. .header{
  11. position: fixed;
  12. width: 100%;
  13. height:@headerHt;
  14. line-height: @headerHt;
  15. top:0;
  16. background:linear-gradient(123deg,rgba(90,142,238,1) 0%,rgba(126,171,255,1) 100%);;
  17. text-indent: 20px;
  18. color: #fff;
  19. font-size: 16px;
  20. .login{
  21. margin-right: 20px;
  22. height: @headerHt;
  23. line-height: @headerHt;
  24. position: relative;
  25. &:after{
  26. content: " ";
  27. display: inline-block;
  28. position: absolute;
  29. right: 0;
  30. top:22px;
  31. width: 10px;
  32. height: 6px;
  33. background: url("../images/icon_wdown.png") no-repeat;
  34. }
  35. //设置
  36. .userAction {
  37. background-color: #fff;
  38. border-radius: 2px;
  39. display: none;
  40. text-indent: 0;
  41. width: 100px;
  42. position: absolute;
  43. right: 0;
  44. top:42px;
  45. box-shadow:0px 4px 20px -3px rgba(59,89,126,0.3);
  46. li {
  47. line-height: 36px;
  48. text-align: center;
  49. cursor: pointer;
  50. color: #777777;
  51. a{
  52. color: #777777;
  53. }
  54. &:hover,a:hover{
  55. color: @activeColor;
  56. }
  57. }
  58. }
  59. }
  60. .setting{
  61. display: inline-block;
  62. height:26px;
  63. line-height: 26px;
  64. margin: 12px 0 0 0;
  65. background: url("../images/head.png") no-repeat;
  66. padding:0 22px 0 15px;
  67. color: #fff;
  68. text-decoration: none;
  69. }
  70. img{
  71. vertical-align: middle;
  72. margin-right: 10px;
  73. }
  74. .title span{
  75. display: inline-block;
  76. border-left: 1px #fff solid;
  77. height: 20px;
  78. line-height: 20px;
  79. color: #fff;
  80. }
  81. }
  82. .main-body{
  83. height: 100%;
  84. margin-top:@headerHt+20px;
  85. }
  86. .menu{
  87. width: @menuWt;
  88. height: 100%;
  89. .active{
  90. color: @activeColor;
  91. background: @activeBg;
  92. border-right: 3px @activeColor solid;
  93. }
  94. .slide-up{
  95. color: @activeColor;
  96. }
  97. .list-1{
  98. position: relative;
  99. &:after{
  100. content: " ";
  101. display: inline-block;
  102. position: absolute;
  103. left: 270px;
  104. top:18px;
  105. width: 10px;
  106. height: 6px;
  107. background: url("../images/icon_down.png") no-repeat;
  108. }
  109. &.slide-up:after{
  110. transform: rotate(180deg);
  111. -webkit-transform: rotate(180deg);
  112. }
  113. ul{
  114. display: none;
  115. li.page{
  116. text-indent: 30px;
  117. }
  118. }
  119. }
  120. li{
  121. line-height: @menuLiHt;
  122. text-indent: 15px;
  123. cursor: pointer;
  124. }
  125. }
  126. .main{
  127. margin-left:@menuWt;
  128. height: 100%;
  129. iframe{
  130. width: 100%;
  131. height: 100%;
  132. }
  133. }
  134. //修改密码
  135. .modalAction {
  136. // padding: 20px;
  137. input {
  138. border: 1px solid #E2E5EF;
  139. width: 300px;
  140. height: 40px;
  141. line-height: 40px;
  142. border-radius: 3px;
  143. margin-bottom: 15px;
  144. padding: 0 10px;
  145. box-sizing: border-box;
  146. }
  147. p span {
  148. width: 90px;
  149. display: inline-block;
  150. text-align: right;
  151. }
  152. .waring {
  153. text-align: left;
  154. i {
  155. margin-left: 15px;
  156. color: #FF4D4F;
  157. }
  158. }
  159. }