123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121 |
- .container {
- width: 334px;
- .head{
- height: 42px;
- position: relative;
- .headTit{
- position: absolute;
- bottom: 0;
- left: 50%;
- transform: translateX(-50%);
- width: 157px;
- height: 32px;
- }
- .closeImg{
- position: absolute;
- top: 0;
- right: -38px;
- width: 32px;
- height: 32px;
- cursor: pointer;
- }
- }
- .pickerCon{
- margin-top: -26px;
- height: 290px;
- background: #FFFFFF;
- border-radius: 16px;
- padding: 36px 20px 12px 20px;
- .pickerBox{
- width: 100%;
- height: calc(100% - 40px);
- display: flex;
- flex-direction: column;
- overflow: hidden;
- .titCon{
- display: flex;
- align-items: center;
- margin-top: 10px;
- &:first-child{
- margin-top: 0;
- }
- .tit{
- font-weight: 600;
- font-size: 15px;
- color: #131415;
- line-height: 21px;
- }
- .tips{
- margin-left: 6px;
- font-weight: 400;
- font-size: 13px;
- color: #777777;
- line-height: 1;
- }
- }
- .content{
- margin-top: 10px;
- &.sheetCon{
- flex-grow: 1;
- overflow: hidden;
- position: relative;
- /* 解决iphonex 不能滚动 */
- .boxCon{
- position: absolute;
- left: 0;
- top: 0;
- bottom: 0;
- right: 0;
- overflow: hidden;
- }
- .con{
- width: 100%;
- height: calc(100% - 4px);
- overflow-y: auto;
- &::-webkit-scrollbar {
- width: 0;
- display: none;
- }
- }
- }
- .selBtn{
- width: 100%;
- height: 34px;
- line-height: 34px;
- background: #F6F6F6;
- border-radius: 6px;
- font-weight: 400;
- font-size: 14px;
- color: #333333;
- text-align: center;
- cursor: pointer;
- border:1px solid transparent;
- margin-top: 10px;
- &:first-child{
- margin-top: 0;
- }
- &.active{
- background: #F2FFFC;
- border-color: #01C1B5;
- color: #00B2A7;
- }
- }
- }
- }
- .btnCon{
- display: flex;
- justify-content: center;
- .btn{
- width: 118px;
- height: 39px;
- cursor: pointer;
- &:active,&:hover{
- opacity: 0.8;
- }
- & + img{
- margin-left: 20px;
- }
- }
- }
- }
- }
|