index.vue 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. <template>
  2. <div id="app">
  3. 测试测试
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. data() {
  9. return {
  10. }
  11. },
  12. mounted() {
  13. }
  14. }
  15. </script>
  16. <style scoped>
  17. html, body, #app {
  18. height: 100% !important;
  19. /*-moz-user-select: none; /*火狐 firefox*/
  20. /*-webkit-user-select: none;/ /*webkit浏览器*/
  21. /*-ms-user-select: none;*/ /*IE10+*/
  22. /*user-select: none;*/
  23. }
  24. .main-content {
  25. position: relative;
  26. width: 100%;
  27. min-width: 1200px;
  28. min-height: 768px;
  29. background: url("http://chq.dygl.pujiaoyun.cn/static/img/banner.071530a.jpg") center 100% no-repeat;
  30. height: 100%;
  31. display: flex;
  32. flex-direction: column;
  33. align-items: center;
  34. padding-top: 50px;
  35. }
  36. .center {
  37. display: flex;
  38. flex-direction: row;
  39. justify-content: center;
  40. align-items: center;
  41. }
  42. .centerCol {
  43. display: flex;
  44. flex-direction: column;
  45. justify-content: center;
  46. align-items: center;
  47. }
  48. .overlay-wrap {
  49. padding: 20px 10px;
  50. background-color: rgba(218, 218, 218, 0.08);
  51. margin-top: 50px;
  52. }
  53. .logo {
  54. width: 200px;
  55. height: 200px;
  56. margin-bottom: 50px;
  57. }
  58. .btn-login {
  59. width: 150px;
  60. margin-top: 15px;
  61. background-color: rgba(204,204,204,.37) !important;
  62. border-color: #87888a !important;
  63. }
  64. .suc-text {
  65. color: #fff;
  66. font-size: 14px;
  67. font-weight: 200;
  68. }
  69. .user-wrap {
  70. position: absolute;
  71. right: 50px;
  72. top: 50px;
  73. color: white;
  74. font-size: 14px;
  75. font-weight: 200;
  76. }
  77. .ivu-avatar {
  78. background-color: #30a6e1 !important;
  79. margin-right: 10px;
  80. }
  81. .btn-exit {
  82. font-size: 12px;
  83. cursor: pointer;
  84. margin-left: 15px;
  85. }
  86. .select-role {
  87. margin-top: 15px;
  88. }
  89. .select-role /deep/ .ivu-select {
  90. color: #000 !important;
  91. width: 150px !important;
  92. }
  93. .select-role .ivu-select-selection {
  94. background-color: rgba(255,255,255,.18) !important;
  95. border-color: #373737 !important;
  96. }
  97. .select-role-wrap {
  98. background-color: rgba(218, 218, 218, 0.08);
  99. padding: 5px;
  100. justify-content: normal;
  101. flex-wrap: wrap;
  102. max-width: 930px;
  103. }
  104. .role-item {
  105. width: 210px;
  106. height: 210px;
  107. background-color: rgba(179,179,179,.15);
  108. margin: 10px;
  109. color: #c5c5c5;
  110. font-size: 14px;
  111. font-weight: 200;
  112. cursor: pointer;
  113. }
  114. .role-item:hover {
  115. background: rgba(179,179,179,.42);
  116. color: #fff;
  117. }
  118. .title {
  119. font-size: 26px;
  120. font-weight: 200;
  121. color: #fff;
  122. margin-bottom: 20px;
  123. }
  124. .role-name {
  125. margin-top: 10px;
  126. }
  127. </style>