dashboard.css 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. @media screen and (min-width:768px) {
  2. .crumbs{color: #22272e;font-size: 16px;}
  3. .pageContent {background: #FFF;padding: 16px}
  4. .pageContent form {width: 498px;margin: 0 auto;padding: 50px 0;}
  5. /**/
  6. #dashboard li {list-style: none;}
  7. .information {background: #fff;padding: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
  8. .head {width: 112px;height: 80px;border-radius: 2px;border: solid 1px #f5f5f5;margin-right: 10px;position: relative;cursor: pointer;display: inline-block;vertical-align: top;}
  9. .zhuti {font-size: 16px;color: #22272e;padding: 25px 236px 10px}
  10. .info_main h3{display: inline-block;}
  11. .icon.Promotion:before{width: 20px;height: 20px;background-position: -90px 3px;position: absolute;}
  12. .icon.Image:before {width: 120px;height: 80px;background-position: 10px -521px}
  13. .head img {width: 100%;height: 100%;}
  14. .info_main {display: inline-block;}
  15. .activityBox{top: 25px;}
  16. .activepro{width: 312px;overflow: hidden;cursor: pointer;}
  17. .Boxtext{text-align: left;line-height: 25px;color: #333333;padding-bottom: 5px;}
  18. .activeimg{width: 68px;height: 68px;float: left;line-height: 68px}
  19. .activeright p{text-align: left;line-height: 20px;font-size: 12px}
  20. .activeimg img{width: 100%;height: 100%}
  21. .username {color: #627386;font-size: 12px;margin: 10px 0;}
  22. .perfect {width: 64px;height: 22px;background-color: #627386;border-radius: 2px;color: #ffffff;font-size: 12px;line-height: 22px;text-align: center;display: inline-block;cursor: pointer}
  23. .ziliao {font-size: 14px;color: #22272e;}
  24. .ziliao span {color: #f94b4b;}
  25. .message {float: right;width: 30px;height: 30px;cursor: pointer;margin-right: 10px}
  26. .msg_num {width: 20px;height: 20px;line-height: 20px;display: block;background: red;border-radius: 50%;color: #fff;font-size: 10px;text-align: center;position: relative;top: 10px;right: -15px;}
  27. .icon.msg:before {width: 25px;height: 25px;background-position: -240px -371px}
  28. .product {margin: 20px 0;}
  29. .product p {font-size: 16px;font-weight: normal;font-stretch: normal;line-height: 21px;letter-spacing: 0px;color: #22272e;padding: 10px 22px;}
  30. .product ul {height: 50px;line-height: 80px;background-color: #ffffff;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);padding: 15px;}
  31. .product li {display: inline-block;margin-right: 20px;width: 110px;text-align: center;color: #333333;position: relative;cursor: pointer;}
  32. .icon.confirm:before {width: 34px;height: 35px;background-position:-159px -414px;position: absolute;right: 53px;}
  33. .icon.other:before {background-position: -197px -414px;}
  34. .icon.down:before{background-position: -234px -414px;}
  35. .rank_top p {font-size: 16px;color: #22272e;display: inline-block;}
  36. .rank_top span {color: #627386;font-size: 16px;}
  37. .sales-ranke ul li {display: inline-block;width: 10%;}
  38. .sales-ranke ul li:nth-child(2) {width: 79%;}
  39. .sales-ranke {background: #fff;color: #627386;padding: 10px 22px}
  40. .sales-ranke ul {padding: 10px 0;border-bottom: 1px solid #e2e7ef}
  41. .rank_top {padding: 10px 22px;}
  42. .file_img {width: 118px;height: 80px;font-size: 999px;opacity: 0;top: 0px;left: 0px;position: absolute}
  43. .shop-ranke {background: #fff;padding-bottom: 20px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
  44. .shop-ranke ul li {float: left;height: 70px;width: 10%;color: #e15616;line-height: 70px}
  45. .shop-ranke ul {padding: 5px 15px;overflow: hidden;}
  46. .shop-ranke ul li:nth-child(2) {width: 79%;}
  47. .shop-ranke ul li .shop-img {display: inline-block;vertical-align: top;margin-left: 10px;}
  48. .shop-ranke ul li .shop-img img {width: 70px;height: 70px;display: inline-block;}
  49. .shop-ranke ul li p {width: 350px;font-size: 14px;height: 60px;line-height: 60px;color: #333;padding-left: 16px;display: inline-block;overflow: hidden;text-overflow: ellipsis;}
  50. .icon.rank0:before {background-position: 0px -453px}
  51. .icon.rank1:before {background-position: -62px -453px}
  52. .icon.rank2:before {background-position: -124px -453px}
  53. .icon.rank3:before {background-position: -186px -453px}
  54. .icon.rank4:before {background-position: -248px -453px}
  55. .icon.rank:before {position: absolute;width: 60px;height: 60px;}
  56. .confirm span {color: #e15616;padding: 5px}
  57. .Statistics {margin-top: 20px;}
  58. .Stati_top p {font-size: 16px;color: #333333;display: inline-block;}
  59. .Stati_top span {font-size: 12px;color: #999999;}
  60. #StatisticsEacths {width: 968px;height: 440px;box-sizing: border-box;background: #FFF;padding:20px 0;margin-top: 10px;box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.07);}
  61. .Statistics .Stati_top{padding: 0 22px}
  62. .mainContent p{ display: inline-block;margin-right: 10px;}
  63. }
  64. /*移动端*/
  65. @media screen and (max-width:768px){
  66. #dashboard{width: 100%;overflow: hidden;}
  67. #dashboard li {list-style: none;}
  68. .wrap_tittle{height: 10.6vw;line-height: 10.6vw;background: #fff;padding: 0 2.7vw;font-size: 3.4vw;color: #22272e;border-bottom: solid .27vw #e2e7ef;}
  69. .mIcon.wrap_tittle:before{width: 6.7vw;height: 6.7vw;background-position: -50.7vw -51.5vw;position: absolute;top: 28vw;}
  70. .mIcon.open:before{width: 10.6vw;height: 11.2vw;float: right;background-position: -48.8vw 2.7vw;}
  71. .information {background: #fff;padding: 3.3vw 2.7vw 5vw;box-shadow: 0px .8vw 1.6vw 0px rgba(0, 0, 0, 0.07); /*height: 33.9vw;*/}
  72. .head {width: 29.9vw;height: 21.3vw;border-radius: .53vw;border: solid .27vw #f5f5f5;display: inline-block;margin-right: 2.7vw;position: relative;cursor: pointer;}
  73. .mIcon.Image:before {width: 120px;height: 80px;background-position: 10px -521px}
  74. .head img {width: 100%;height: 100%;}
  75. .info_main {display: inline-block;width: 60%;}
  76. .username {color: #9aa5b5;font-size: 3.2vw;margin: 2.7vw 0;}
  77. .mainContent>p{ color: #22272e;font-size: 3.7vw;}
  78. .perfect {width: 15.5vw;height:5.3vw;background-color: #627386;border-radius:.53vw;color: #ffffff;font-size: 3vw;line-height: 5.3vw;text-align: center;display: inline-block;float: right;}
  79. .ziliao {font-size: 3.2vw;color: rgb(154,165,181);float: left;}
  80. .ziliao span {color: #f94b4b;}
  81. .message {width: 8vw;height: 8vw;cursor: pointer;position: relative;top: -27vw;right: -88vw;}
  82. .msg_num {width: 4vw;height: 4vw;line-height: 4vw;display: block;background: red;border-radius: 50%;color: #fff;font-size: 2.7vw;text-align: center;position: relative;top: 3.7vw;right: 3.2vw;z-index: 1;}
  83. .mIcon.msg:before {width: 4vw;height: 4vw;background-position: -18.4vw -62vw;position: absolute;right:5.87vw;top: 5.87vw;}
  84. .product {margin: 1.3vw 0;background: #fff;height: 29.8vw;}
  85. .product p {font-size: 3.4vw;font-weight: normal;font-stretch: normal;line-height: 5.6vw;letter-spacing: 0px;color: #22272e;padding: 2.7vw 3.3vw;}
  86. .product ul {height:10.6vw;line-height:17vw;background-color: #ffffff;padding: 4vw;}
  87. .product li {display: inline-block;width: 32%;text-align: center;color: #333333;position: relative;cursor: pointer;}
  88. .mIcon.confirm:before {width: 9vw;height: 9vw;background-position: -66.7vw -60vw;right: 13.9vw;top: -2.53vw;position: absolute}
  89. .mIcon.other:before {background-position: -74vw -60vw;}
  90. .mIcon.down:before {background-position: -83vw -60vw;}
  91. .rank_top p {font-size: 3.4vw;color: #22272e;display: inline-block;}
  92. .rank_top span {color: #627386;font-size: 2.6vw;}
  93. .sales-ranke ul li {display: inline-block;width: 15%;}
  94. .sales-ranke ul li:nth-child(2) {width: 62%;padding-left:4vw;}
  95. .sales-ranke {background: #fff;color: #627386;padding:2.7vw 3.3vw}
  96. .sales-ranke ul {padding: 2.7vw 0;border-bottom: .27vw solid #e2e7ef}
  97. .rank_top {padding: 2.7vw 3.3vw;background: #fff;}
  98. .file_img {width: 29.9vw;height: 21.3vw;opacity: 0;top: 0px;left: 0px;position: absolute}
  99. .shop-ranke {background: #fff;padding-bottom: 5.3vw;box-shadow: 0px .8vw 1.6vw 0px rgba(0, 0, 0, 0.07);}
  100. .shop-ranke ul li {float: left;height: 12vw;width: 15%;color: #e15616;line-height: 12vw;position: relative;font-size: 3.1vw;}
  101. .shop-ranke ul {padding: 1.3vw 3.3vw;overflow: hidden;}
  102. .shop-ranke ul li:nth-child(2) {width: 68%;}
  103. .shop-ranke ul li .shop-img {display: inline-block;vertical-align: top;margin-left: 2.7vw;}
  104. .shop-ranke ul li .shop-img img {width: 9.3vw;height: 9.3vw;display: inline-block;}
  105. .shop-ranke ul li p {width: 42.7vw;font-size: 3.1vw;height: 16vw;color: #333;padding-left: 2.7vw;display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
  106. .mIcon.rank0:before {background-position: -25.3vw -60.3vw;}
  107. .mIcon.rank1:before {background-position: -33.9vw -60.3vw;}
  108. .mIcon.rank2:before {background-position: -42.1vw -60.3vw;}
  109. .mIcon.rank3:before {background-position: -50.1vw -60.3vw;}
  110. .mIcon.rank4:before {background-position: -58.7vw -60.3vw;}
  111. .mIcon.rank:before {position: absolute;width: 8vw;height: 8vw;top: 1.69vw;left: 0;}
  112. .confirm span {padding: 1.3vw;width: 3vw;height: 3vw;line-height: 3vw;display: inline-block;background: #f55c5c;border-radius: 50%;color: #fff;font-size: 3vw;text-align: center;position: relative;top: -8.8vw;right: 6.7vw}
  113. .confirm.other span {right: 3.5vw}
  114. .confirm.down span {right: 4vw}
  115. .Statistics {margin-top: 1.3vw;background: #fff;}
  116. .Stati_top p {font-size: 3.4vw;color: #333333;display: inline-block;}
  117. .Stati_top span {font-size: 2.6vw;color: #999999;}
  118. #StatisticsEacths {padding: 2.7vw;height:60.3vw;background: #FFF;margin-top: 2.7vw;box-shadow: 0px .8vw 1.6vw 0px rgba(0, 0, 0, 0.07);}
  119. .priceTag{position: absolute;bottom: -26vw;left: -32.5vw;}
  120. .mainContent{position: relative}
  121. .priceTag .tag{padding: 0 3vw}
  122. .Stati_top{padding: 2.7vw 3.3vw}
  123. }