jimu-mobile/src/styles/jimu-city.less

积木组件库助力移动端开发

#rootContent{
  height: 100%
}
.selectCity，.selectCity *{
  box-sizing: border-box;
}
.selectCity{
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height: 100%;
  overflow: scroll;
  background: @fill-base;
  -webkit-overflow-scrolling : touch;
  .max_char{
    position: absolute;
    z-index: 22;
    top:50%;
    left:50%;
    color:@color-text-default;
    margin-left:-2.5rem;
    margin-top:-2.5rem;
    font-size: @city-max-char-font-size;
  }
  .selectTitle{
    padding-left: 10px;
    height: 42px;
    line-height: 42px;
    color:@color-text-light;
    font-size: @font-size-base;
    background-color: @fill-body;
  }
  .positionAddr{
    height: 50px;
    line-height: 50px;
    .icon{
      font-size: @font-size-caption-sm;
      margin-left:16px;
      display: none;
    }
    .icon-addr:before{
      color:@color-text-disabled;
    }
    .positionCityName{
      font-size: @font-size-caption;
      margin-left:10px;
    }
  }
}
.selectCon {
  padding-bottom: 10px;
  padding-left: 16px;
  max-height: 94px;
  overflow: scroll;
  .list {
    height: 32px;
    line-height: 32px;
    padding: 0 10px;
    margin: 10px 16px 0 0px;
    display: inline-block;
    background-color: @fill-body;
    border-radius: @radius-xm;
    box-sizing: border-box;
    .icon-addr {
      &::before{
        color:@color-text-disabled;
      }
      margin-right: 6px;
    }
    .icon-close:before {
      margin-left: 5px;
      color: @color-text-disabled;
      font-size: @font-size-caption-sm;
    }
    span {
      font-size: @font-size-base;
      color: @color-text-default;
      letter-spacing: 0;
      line-height: 16px;
      vertical-align: middle;
    }
  }
}
._cityCon{
  height:100%;
  overflow: scroll;

}
.cityCon {
  .first_char {
    height: 25px;
    line-height: 25px;
    display: block;
    padding-left: 15px;
    color:@color-text-base;
    font-size: @font-size-caption-sm;
    background-color: @fill-body;
  }
  .list {
    display: block;
    height: 50px;
    padding-top: 16px;
    border-bottom: 1px solid rgba(242, 242, 242, 1);
    box-sizing: border-box;
    .check {
      width: 16px;
      height: 16px;
      display: inline-block;
      margin-left: 16px;
      border-radius: @radius-xm;
      border: 1px solid @border-color-disable;
      vertical-align: top;
      .icon {
        display: none;
      }
    }
    .cityName {
      font-size:@font-size-caption;
      color: @color-text-base;
      margin-left: 10px;
    }
  }
  /*当城市选中的时候样式*/
  .list.select {
    .check {
      width: 16px;
      height: 16px;
      border: none;
      background:@color-icon-base;
      .icon {
        display: block;
      }
      .icon-popup_right:before{
        color:@color-text-base-inverse;
        font-size:@font-size-caption-sm;
        position:relative;
        top:2px;
        left:2px;

      }
    }
  }
}
.fast_char{
  position: fixed;
  top:50%;
  right: 0px;
  margin-top: -208px;
  text-align: center;
  width:50px;
  a{
    height: 16px;
    line-height: 16px;
    display: block;
    font-size: @font-size-caption-sm;
  }
}