main.css 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. body {
  2. background-color: #fcfcfc;
  3. }
  4. .btn {
  5. display: inline-block;
  6. padding: 6px 12px;
  7. margin-bottom: 0;
  8. font-size: 14px;
  9. font-weight: 400;
  10. line-height: 1.42857143;
  11. text-align: center;
  12. white-space: nowrap;
  13. vertical-align: middle;
  14. -ms-touch-action: manipulation;
  15. touch-action: manipulation;
  16. cursor: pointer;
  17. -webkit-user-select: none;
  18. -moz-user-select: none;
  19. -ms-user-select: none;
  20. user-select: none;
  21. background-image: none;
  22. border: 1px solid transparent;
  23. border-radius: 4px;
  24. }
  25. .btn-primary {
  26. color: #fff;
  27. background-color: #337ab7;
  28. border-color: #2e6da4;
  29. }
  30. .btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
  31. border-top-right-radius: 0;
  32. border-bottom-right-radius: 0;
  33. }
  34. .btn-group>.btn:first-child {
  35. margin-left: 0;
  36. }
  37. .btn-group-vertical>.btn.active, .btn-group-vertical>.btn:active, .btn-group-vertical>.btn:focus, .btn-group-vertical>.btn:hover, .btn-group>.btn.active, .btn-group>.btn:active, .btn-group>.btn:focus, .btn-group>.btn:hover {
  38. z-index: 2;
  39. }
  40. .btn-group-vertical>.btn, .btn-group>.btn {
  41. position: relative;
  42. float: left;
  43. }
  44. .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open>.dropdown-toggle.btn-primary {
  45. color: #fff;
  46. background-color: #286090;
  47. border-color: #204d74;
  48. }
  49. .btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  50. border-radius: 0;
  51. }
  52. .btn-group .btn+.btn, .btn-group .btn+.btn-group, .btn-group .btn-group+.btn, .btn-group .btn-group+.btn-group {
  53. margin-left: -1px;
  54. }
  55. .btn-group>.btn:last-child:not(:first-child), .btn-group>.dropdown-toggle:not(:first-child) {
  56. border-top-left-radius: 0;
  57. border-bottom-left-radius: 0;
  58. }
  59. .btn-block {
  60. display: block;
  61. width: 100%;
  62. }
  63. .avatar-row-l{
  64. width:75%;
  65. float:left;
  66. }
  67. .avatar-row-r{
  68. width:20%;
  69. float:left;
  70. margin-left:3%;
  71. }
  72. .avatar-view {
  73. display: block;
  74. margin: 0 auto;
  75. height: 220px;
  76. width: 220px;
  77. border: 3px solid #fff;
  78. border-radius: 5px;
  79. box-shadow: 0 0 5px rgba(0,0,0,.15);
  80. cursor: pointer;
  81. overflow: hidden;
  82. }
  83. .avatar-view img {
  84. width: 100%;
  85. }
  86. .avatar-upload {
  87. overflow: hidden;
  88. }
  89. .avatar-upload label {
  90. display: block;
  91. float: left;
  92. clear: left;
  93. width: 100px;
  94. }
  95. .avatar-upload input {
  96. display: block;
  97. }
  98. .avater-alert {
  99. margin-top: 10px;
  100. margin-bottom: 10px;
  101. }
  102. .avatar-wrapper {
  103. height: 364px;
  104. width: 100%;
  105. margin-top: 15px;
  106. box-shadow: inset 0 0 5px rgba(0,0,0,.25);
  107. background-color: #fcfcfc;
  108. overflow: hidden;
  109. }
  110. .avatar-wrapper img {
  111. display: block;
  112. height: auto;
  113. max-width: 100%;
  114. }
  115. .avatar-preview {
  116. float: left;
  117. margin-top: 15px;
  118. margin-right: 15px;
  119. border: 1px solid #eee;
  120. border-radius: 4px;
  121. background-color: #fff;
  122. overflow: hidden;
  123. }
  124. .avatar-preview:hover {
  125. border-color: #ccf;
  126. box-shadow: 0 0 5px rgba(0,0,0,.15);
  127. }
  128. .avatar-preview img {
  129. width: 100%;
  130. }
  131. .preview-lg {
  132. height: 184px;
  133. width: 184px;
  134. margin-top: 15px;
  135. }
  136. .preview-md {
  137. height: 100px;
  138. width: 100px;
  139. }
  140. .preview-sm {
  141. height: 50px;
  142. width: 50px;
  143. }
  144. @media (min-width: 992px) {
  145. .avatar-preview {
  146. float: none;
  147. }
  148. }
  149. .avatar-btns {
  150. margin-top: 30px;
  151. margin-bottom: 15px;
  152. }
  153. .avatar-btns .btn-group {
  154. margin-right: 5px;
  155. float:left;
  156. }