5 changed files with 353 additions and 253 deletions
			
			
		| @ -0,0 +1,118 @@ | |||||
|  | @import "c/config"; | ||||
|  | @import "c/function"; | ||||
|  | 
 | ||||
|  | .m-pop { | ||||
|  |     @include shield; | ||||
|  |     background-color: rgba(#000, 0.5); | ||||
|  |     overflow-y: auto; | ||||
|  | 
 | ||||
|  |     .wrap { | ||||
|  |         position: relative; | ||||
|  |         margin: 120px auto; | ||||
|  |         padding: 20px; | ||||
|  |         width: 1000px; | ||||
|  |         background-color: #fff; | ||||
|  | 
 | ||||
|  |         .title { | ||||
|  |             padding: 10px; | ||||
|  |             font-size: 22px; | ||||
|  |             font-family: PingFang SC; | ||||
|  |             font-weight: 800; | ||||
|  |             color: #333; | ||||
|  |             display: flex; | ||||
|  |             align-items: center; | ||||
|  | 
 | ||||
|  |             img { | ||||
|  |                 display: block; | ||||
|  |                 margin-right: 5px; | ||||
|  |             } | ||||
|  |             span { | ||||
|  |                 display: block; | ||||
|  |             } | ||||
|  |         } | ||||
|  | 
 | ||||
|  |         .btn-close { | ||||
|  |             position: absolute; | ||||
|  |             top: -30px; | ||||
|  |             right: -30px; | ||||
|  |             cursor: pointer; | ||||
|  |         } | ||||
|  | 
 | ||||
|  |         .list { | ||||
|  |             display: flex; | ||||
|  |             flex-wrap: wrap; | ||||
|  |             padding: 10px 30px; | ||||
|  | 
 | ||||
|  |             .item { | ||||
|  |                 position: relative; | ||||
|  |                 box-sizing: border-box; | ||||
|  |                 padding: 0 15px; | ||||
|  |                 width: 33%; | ||||
|  |                 color: #fff; | ||||
|  |                 font-size: 18px; | ||||
|  |                 font-family: PingFang SC; | ||||
|  |                 font-weight: 400; | ||||
|  |                 color: #333; | ||||
|  |                 line-height: 24px; | ||||
|  |                 margin: 20px 0; | ||||
|  | 
 | ||||
|  |                 &::before { | ||||
|  |                     position: absolute; | ||||
|  |                     left: 0; | ||||
|  |                     top: 9px; | ||||
|  |                     content: ""; | ||||
|  |                     display: block; | ||||
|  |                     width: 7px; | ||||
|  |                     height: 7px; | ||||
|  |                     background: #ddd; | ||||
|  |                     border-radius: 3px; | ||||
|  |                 } | ||||
|  |             } | ||||
|  |         } | ||||
|  | 
 | ||||
|  |         .line { | ||||
|  |             margin: 20px auto; | ||||
|  |             width: 900px; | ||||
|  |             height: 1px; | ||||
|  |             border: 1px dashed #ddd; | ||||
|  |         } | ||||
|  | 
 | ||||
|  |         .tabs { | ||||
|  |             margin-top: 30px; | ||||
|  |             display: flex; | ||||
|  |             align-items: center; | ||||
|  |             padding-left: 20px; | ||||
|  | 
 | ||||
|  |             .tab-btn { | ||||
|  |                 width: 30px; | ||||
|  |                 text-align: center; | ||||
|  |                 cursor: pointer; | ||||
|  |             } | ||||
|  | 
 | ||||
|  |             .tab { | ||||
|  |                 margin: 0 5px; | ||||
|  |                 min-width: 76px; | ||||
|  |                 padding: 0 5px; | ||||
|  |                 height: 30px; | ||||
|  |                 background: #fff; | ||||
|  |                 border: 1px solid #eee; | ||||
|  |                 box-shadow: 0 0 10px 0 inset #ddd; | ||||
|  |                 border-radius: 2px; | ||||
|  |                 text-align: center; | ||||
|  |                 font-size: 14px; | ||||
|  |                 font-family: PingFang SC; | ||||
|  |                 font-weight: 400; | ||||
|  |                 color: #333; | ||||
|  |                 line-height: 30px; | ||||
|  |                 cursor: pointer; | ||||
|  |                 transition: all ease 0.1s; | ||||
|  |                 &.z-on { | ||||
|  |                     background: linear-gradient(90deg, #1a5afd, #009cff); | ||||
|  |                     box-shadow: none; | ||||
|  |                     color: #ffffff; | ||||
|  |                     border: 1px solid #1a5afd; | ||||
|  |                 } | ||||
|  |             } | ||||
|  |         } | ||||
|  |     } | ||||
|  | } | ||||
					Loading…
					
					
				
		Reference in new issue