You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							380 lines
						
					
					
						
							7.7 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							380 lines
						
					
					
						
							7.7 KiB
						
					
					
				| .div_top { | |
|   margin-left: 10px; | |
|   height: 35px; | |
|   .router_line { | |
|     width: 212px; | |
|     height: 1px; | |
|     border: 1px solid #ffffff; | |
|     opacity: 0.09; | |
|     /* opacity: 0.09; */ | |
|   } | |
|   .div_router { | |
|     margin-top: 5px; | |
|     font-size: 16px; | |
| 
 | |
|     .router_parents { | |
|       color: #a0c3d9; | |
| 
 | |
|       .arrow { | |
|         padding: 0 5px; | |
|       } | |
|     } | |
|     .router_parents:hover { | |
|       cursor: pointer; | |
|     } | |
| 
 | |
|     .router_child { | |
|       color: #ffffff; | |
|     } | |
|   } | |
| } | |
| 
 | |
| .div_content { | |
|   display: flex; | |
| 
 | |
|   .div_map { | |
|     box-sizing: border-box; | |
|     width: 100%; | |
|     // padding: 10px 5px 13px; | |
|     // margin-top: 8px; | |
|     height: calc(88vh); | |
|     color: #fff; | |
|     // background: url('../../../img/modules/visual/warning-box.png') no-repeat | |
|     //   center; | |
|     // background-size: 100% 100%; | |
|   } | |
| 
 | |
|   .div_data { | |
|     flex: 0 0 562px; | |
|     margin-left: 12px; | |
| 
 | |
|     .div_search { | |
|       width: 100%; | |
|       height: 56px; | |
|       text-align: center; | |
|       background-color: #011168; | |
|       border-radius: 4px 0 0 4px; | |
|       border: none; | |
|       box-shadow: 0 0 10px inset #1a5afd; | |
|       font-size: 18px; | |
|       font-family: PingFang SC; | |
|       font-weight: 400; | |
|       color: #ffffff; | |
|       opacity: 0.7; | |
|       display: flex; | |
|       justify-content: space-between; | |
|       .div_search_left { | |
|         display: flex; | |
|         justify-content: flex-start; | |
|         .icon { | |
|           display: flex; | |
|           align-items: center; | |
|           margin-left: 29px; | |
| 
 | |
|           > img { | |
|             width: 24px; | |
|             height: 24px; | |
|           } | |
|         } | |
| 
 | |
|         > span { | |
|           line-height: 56px; | |
|           margin-left: 10px; | |
|         } | |
|       } | |
| 
 | |
|       .btn { | |
|         text-align: center; | |
|         flex: 0 0 113px; | |
|         height: 56px; | |
|         background: linear-gradient(90deg, #1a5afd, #26c4ff); | |
|         font-size: 20px; | |
|         font-family: PingFang SC; | |
|         font-weight: 400; | |
|         color: #ffffff; | |
|         line-height: 56px; | |
|         border-radius: 0 4px 4px 0; | |
|       } | |
|     } | |
| 
 | |
|     .div_search:hover { | |
|       cursor: pointer; | |
|     } | |
| 
 | |
|     .div_info { | |
|       box-sizing: border-box; | |
|       width: 100%; | |
|       margin-top: 21px; | |
|       height: calc(88vh - 77px); | |
|       color: #fff; | |
|       background: url('../../../img/modules/visual/warning-box.png') no-repeat | |
|         center; | |
|       background-size: 100% 100%; | |
|       // padding: 45px 21px 35px 24px; | |
|  | |
|       .info_tip { | |
|         padding: 31px 0 0 19px; | |
|         display: flex; | |
|         > img { | |
|           height: 34px; | |
|           width: 46px; | |
|         } | |
| 
 | |
|         .tip_title { | |
|           line-height: 34px; | |
|           margin-left: 7px; | |
|           font-size: 22px; | |
|           font-family: PingFang SC; | |
|           font-weight: 800; | |
|           color: #ffffff; | |
|         } | |
|       } | |
| 
 | |
|       .info_list { | |
|         margin-top: 9px; | |
| 
 | |
|         .item { | |
|           .item_line { | |
|             margin-top: 13px; | |
|             margin-left: 24px; | |
|             width: 517px; | |
|             height: 0px; | |
|             border: 1px dotted #1797ff31; | |
|             border-width: 0.5px; | |
|           } | |
|           .last_line { | |
|             border: 1px dotted #1797ff00; | |
|           } | |
|           .list_item { | |
|             display: flex; | |
|             padding: 18px 59px 0; | |
|             justify-content: space-between; | |
| 
 | |
|             .list_item_col { | |
|               flex: 0 0 240px; | |
|               display: flex; | |
| 
 | |
|               > img { | |
|                 height: 76px; | |
|                 width: 76px; | |
|               } | |
| 
 | |
|               .item_content { | |
|                 margin-left: 10px; | |
|                 height: 76px; | |
|                 display: flex; | |
|                 flex-direction: column; | |
|                 justify-content: center; | |
| 
 | |
|                 .item_label { | |
|                   font-size: 18px; | |
|                   font-family: PingFang SC; | |
|                   font-weight: 400; | |
|                   color: #ffffff; | |
|                 } | |
|                 .item_count { | |
|                   margin-top: 10px; | |
|                   font-size: 28px; | |
|                   font-family: PingFang SC; | |
|                   font-weight: bold; | |
|                   color: #00fffc; | |
|                 } | |
|               } | |
|             } | |
|           } | |
|         } | |
|       } | |
|     } | |
|   } | |
| } | |
| 
 | |
| .div_community_info { | |
|   box-sizing: border-box; | |
|   flex: 0 0 calc(100vw - 620px); | |
|   // width: calc(100vw - 560px); | |
|  | |
|   height: calc(88vh); | |
|   color: #fff; | |
|   background: url('../../../img/modules/visual/warning-box.png') no-repeat | |
|     center; | |
|   background-size: 100% 100%; | |
| 
 | |
|   .div_select { | |
|     margin-top: 28px; | |
|     margin-left: 24px; | |
|     display: flex; | |
|     .customer_select { | |
|       display: flex; | |
|       justify-content: flex-start; | |
| 
 | |
|       > span { | |
|         width: auto; | |
|         font-size: 22px; | |
|         font-family: PingFang SC; | |
|         font-weight: 800; | |
|         color: #ffffff; | |
|         line-height: 34px; | |
|       } | |
|     } | |
|     > img { | |
|       height: 34px; | |
|       width: 46px; | |
|     } | |
| 
 | |
|     .tip_title { | |
|       line-height: 34px; | |
|       margin-left: 12px; | |
|       font-size: 22px; | |
|       font-family: PingFang SC; | |
|       font-weight: 800; | |
|       color: #ffffff; | |
|     } | |
|   } | |
| 
 | |
|   .div_room_bar { | |
|     box-sizing: border-box; | |
| 
 | |
|     margin-top: 9px; | |
|     height: calc(88vh - 120px); | |
|   } | |
| 
 | |
|   .div_room { | |
|     // height: calc(88vh - 40px); | |
|     // margin-top: 9px; | |
|     display: flex; | |
|     flex-wrap: wrap; | |
|     justify-content: flex-start; | |
|     margin: 0 21px 0 21px; | |
| 
 | |
|     .item:hover { | |
|       cursor: pointer; | |
|     } | |
|     .item_sel { | |
|       box-shadow: 0 0 10px inset #1a5afd; | |
|     } | |
|     .item { | |
|       background-color: #011168; | |
|       margin-top: 12px; | |
|       width: 244px; | |
|       height: 190px; | |
|       border: 1px solid #037ddc; | |
|       border-radius: 8px; | |
|       text-align: center; | |
|       margin-left: 11px; | |
|       position: relative; | |
| 
 | |
|       // &:first-child { | |
|       //   margin-left: 0; | |
|       // } | |
|  | |
|       > span { | |
|         font-size: 24px; | |
|         font-family: PingFang SC; | |
|         font-weight: 500; | |
|         color: #ffffff; | |
|         line-height: 18px; | |
|         line-height: 190px; | |
|       } | |
| 
 | |
|       .icon_party { | |
|         position: absolute; | |
|         top: 13px; | |
|         left: 18px; | |
|       } | |
| 
 | |
|       .icon_category { | |
|         position: absolute; | |
|         bottom: 14px; | |
|         left: 9px; | |
|         // margin-left: 7px; | |
|  | |
|         > img { | |
|           margin-left: 5px; | |
|           width: 21px; | |
|           height: 20px; | |
|         } | |
|       } | |
|       .div_user:hover { | |
|         cursor: pointer; | |
|       } | |
| 
 | |
|       .div_user { | |
|         position: absolute; | |
|         bottom: 10px; | |
|         right: 11px; | |
|         width: 88px; | |
|         height: 30px; | |
|         background: #073082; | |
|         border-radius: 15px; | |
| 
 | |
|         > img { | |
|           width: 10px; | |
|           height: 6px; | |
|           margin-left: 4px; | |
|         } | |
| 
 | |
|         > span { | |
|           font-size: 14px; | |
|           font-family: PingFang SC; | |
|           font-weight: 400; | |
|           color: #ffffff; | |
|           line-height: 30px; | |
|         } | |
| 
 | |
|         .user_list { | |
|           margin-top: 2px; | |
|           position: relative; | |
|           z-index: 10; | |
| 
 | |
|           background: #020340; | |
|           border: 1px solid #0a359b; | |
|           border-radius: 4px; | |
|           box-shadow: 0 0 10px inset #1a5afd; | |
| 
 | |
|           .user_item { | |
|             padding: 13px 8px 0 14px; | |
|             font-size: 16px; | |
|             font-family: PingFang SC; | |
|             font-weight: 400; | |
|             color: #ffffff; | |
| 
 | |
|             .user_item_content { | |
|               display: flex; | |
|               // justify-content: space-between; | |
|               align-items: center; | |
| 
 | |
|               .name { | |
|                 max-width: 80%; | |
|                 text-align: left; | |
|               } | |
| 
 | |
|               > img { | |
|                 margin-left: auto; | |
| 
 | |
|                 margin-top: 4px; | |
|                 width: 8px; | |
|                 height: 12px; | |
|               } | |
|             } | |
| 
 | |
|             .item_line { | |
|               margin-top: 9px; | |
|               width: 70px; | |
|               height: 0px; | |
|               border: 1px dotted #1797ff31; | |
|               border-width: 0.5px; | |
|             } | |
|             .last_line { | |
|               border: 1px dotted #1797ff00; | |
|             } | |
|           } | |
|         } | |
|       } | |
|     } | |
|   } | |
| 
 | |
|   .div_room::after { | |
|     content: ''; | |
|     flex: 1; | |
|   } | |
| }
 | |
| 
 |