editormap.css 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238
  1. .padd0 {
  2. padding: 0;
  3. }
  4. .my-container {
  5. height: 100vh;
  6. box-sizing: border-box;
  7. padding-bottom: 30px;
  8. background: #fff;
  9. }
  10. .my-container>.row,
  11. .my-container>.row>div {
  12. height: 100%;
  13. }
  14. #myTab{
  15. margin-bottom: 0;
  16. }
  17. .right-map {
  18. height: 100%;
  19. display: flex;
  20. }
  21. .riskPointLevel{
  22. float: right;
  23. }
  24. .map-container {
  25. height: 100%;
  26. flex: 1;
  27. overflow: hidden;
  28. position: relative;
  29. border: 1px solid #ddd;
  30. }
  31. .my-marker-box>ul {
  32. display: flex;
  33. flex-direction: row;
  34. align-items: center;
  35. flex-wrap: wrap;
  36. list-style-type: none;
  37. padding: 10px 0 0 0;
  38. margin: 0;
  39. }
  40. .my-marker-box>ul>li {
  41. width: 100%;
  42. /*height: 100%;*/
  43. border: 1px solid #ddd;
  44. margin: 0 10px 16px 2px;
  45. position: relative;
  46. }
  47. .my-marker-box>ul>li>img {
  48. width: 25px;
  49. height: 25px;
  50. cursor:pointer;
  51. }
  52. .my-marker-box>ul>li>p {
  53. display: inline-block;
  54. }
  55. .my-marker-box>ul>li>span {
  56. display: block;
  57. width: 20px;
  58. height: 20px;
  59. position: absolute;
  60. right: -10px;
  61. top: -12px;
  62. background: #fff;
  63. color: red;
  64. border-radius: 50% !important;
  65. border: 1px solid #ddd;
  66. text-align: center;
  67. line-height: 14px;
  68. font-size: 20px;
  69. cursor: pointer;
  70. }
  71. .my-marker-box>ul>li>span:hover{
  72. background: red;
  73. color: #fff;
  74. }
  75. .form-box {
  76. display: none;
  77. width: 200px;
  78. height: 100%;
  79. background: yellow;
  80. }
  81. #jobIconList ,#facilityIconList{
  82. list-style-type: none;
  83. padding: 0;
  84. display: flex;
  85. flex-wrap: wrap;
  86. }
  87. #facilityIconList:before,
  88. #jobIconList:before {
  89. display: table;
  90. content: '';
  91. clear: both;
  92. }
  93. #facilityIconList:after,
  94. #jobIconList:after {
  95. display: table;
  96. content: '';
  97. clear: both;
  98. }
  99. #facilityIconList>li,
  100. #jobIconList>li {
  101. width: 100%;
  102. padding: 0 6px;
  103. position: relative;
  104. margin-bottom: 10px;
  105. }
  106. #facilityIconList>li>a,
  107. #jobIconList>li>a {
  108. display: inline-block;
  109. /*display: block;*/
  110. width: 25px;
  111. height: 25px;
  112. border-radius: 50%;
  113. }
  114. #facilityIconList>li>span,
  115. #jobIconList>li>span {
  116. font-size: 12px !important;
  117. }
  118. #facilityIconList>li>a>img,
  119. #jobIconList>li>a>img {
  120. width: 100%;
  121. height: 100%;
  122. }
  123. .iconCategory {
  124. float: none !important;
  125. padding: 10px 0;
  126. margin-bottom: 10px;
  127. width:100%;
  128. }
  129. .iconCategory_ {
  130. float: none !important;
  131. width: 100%;
  132. font-size: 16px;
  133. color: #00a198;
  134. }
  135. .tab-content {
  136. border: 1px solid #ddd;
  137. border-top: none;
  138. padding: 10px;
  139. }
  140. .icon-active {
  141. width: 40px;
  142. border: 2px solid #25afe5;
  143. height: 40px;
  144. }
  145. .icon-form-box {
  146. padding: 10px;
  147. margin: 0 6px;
  148. width: 100%;
  149. }
  150. .my-form-item {
  151. display: flex;
  152. flex-direction: row;
  153. align-items: center;
  154. margin-bottom: 10px;
  155. border-bottom: 1px solid #ddd;
  156. padding-bottom: 6px;
  157. }
  158. .my-form-item>label {
  159. margin: 0;
  160. }
  161. .marker-name{
  162. width:70px;
  163. }
  164. #riskPointName{
  165. border:none;
  166. overflow: hidden;
  167. }
  168. #my-marker {
  169. width: 40px;
  170. height: 40px;
  171. border: 1px solid #ddd;
  172. }
  173. #my-marker>img {
  174. width: 100%;
  175. height: 100%;
  176. }
  177. .riskp-detail{
  178. margin: 0 0 10px 0;
  179. font-size: 18px;
  180. }
  181. .popup-icon-box>ul{
  182. list-style-type: none;
  183. display: flex;
  184. flex-direction: row;
  185. align-items: center;
  186. flex-wrap: wrap;
  187. padding: 10px;
  188. }
  189. .popup-icon-box>ul>li{
  190. width: 100%;
  191. /*width:36px;*/
  192. height: 36px;
  193. margin-left: 5px;
  194. /*border-radius: 50%;*/
  195. position: relative;
  196. }
  197. .popup-icon-box>ul>li>img{
  198. width:100%;
  199. height: 100%;
  200. border-radius: 50%;
  201. cursor:pointer;
  202. }
  203. .danger-title{
  204. font-size: 16px;
  205. }
  206. .add-subIcon{
  207. width:36px;
  208. height: 36px;
  209. border:1px dashed #ddd !important;
  210. text-align: center;
  211. line-height: 32px;
  212. font-size: 50px;
  213. color: #ddd;
  214. }
  215. .my-btn-group{
  216. width:100%;
  217. }
  218. .my-btn-group>a{
  219. width:50%;
  220. }