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

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

.jimu_driver {
  background: @fill-base;
  padding:20px;
  position: relative;
  margin-bottom: 1rem;
  display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  font-size: @font-size-caption-sm;
  .brd {
    border-top: 1px solid @fill-href-active;
    margin: 1rem 0 0;
    padding-top: 1rem;
  }
  .jimu_driver_info {
    margin-top: 5px;
    -webkit-box-flex: 1;-webkit-flex: 1;flex: 1;box-flex:1;flex:1; 
    p {
      margin-bottom: 11px;
    }span {
    margin-left: 5px;
  }
  }
  
  .jimu_driver_avatar {
    margin-right: 10px;
    img {
      border-radius:40px;
    }
  }
  .jimu_driver_icon{
    display: block;margin-top: 10px;
    
    .jimu_driver_telphone,.jimu_driver_message{
      display: inline-block;width: 24px;height: 24px;margin-left: 16px;position: relative;
      .trip_icon_phone,.trip_icon_message{display: inline-block;width: 24px;height: 24px;}
      .trip_icon_phone{background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAWlBMVEUAAAB7gZV8gJZ8gZZ8gZZ8gJV8gZZ8gZZ+hJmAhpd8gZZ7gZZ8gpd9gpeAlKh8gJV8gZaIiJmAmZl8gJV8gJV8gZd9gpd7gZd+gZZ9gph8g5mAjpx8gJZ7gJXBR5/hAAAAHXRSTlMA9vPaeseYkigevs5bMgzqiQ8KtalxYldLOSMSsz7XiJwAAADiSURBVEjH7ZTJDoMwDETjBAJhKdB9m///zaoNNG2pwnDjwDuBxJNxPI5aWRqu0OVF8WwMAJ3zQoYnqWLpBC8SVqjgkZoULHrMlhNKDFhOaPCmogQJgr7NFEANw4QCR8VQoKdwiqLtx3BQJGcvZHz2dMjSrFHXtJB7wXS0sffGjhaczO07wWgl8nhK0l/jCB1N4lXj66/c893G9uOEnl0X4mLqqTaGrw7wSBK9OwbSTMJzHq8xRl8ifeh/Rhk7q/RfifgEZSTcJ1KyxzfGTWbXflRp2g2zUee2MCJNaautWlkaD0i6JqMjKCubAAAAAElFTkSuQmCC) ;background-size: cover;}
      .trip_icon_message{background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAXVBMVEUAAAB7gJZ7gZV8gJZ8gZZ7gJWBh5p7gZZ7gpZ9gpaFvb1+hZh7gZZ8gJZ8gZZ7gZZ7gJV7gZZ8gJZ8gZZ9gpd8gJV8gJZ8g5d8gZd+gZV9gpmAhJeAkqSSkrZ7gJUDYe1VAAAAHnRSTlMAmlf5dM0a5XxjAyPwvGzY0beziUrBrUKPQTc2DgcfJC25AAAA6klEQVRIx+3TS3KDMBAE0AaBFBB/MPiT9P2PmQUuKFOjAeyt375LmlELX+959GVdFHXZP3BAXjkuXJVjx1TzRT1BVRlumAqKnoIeQRlFGQLuhiJzhyxlQApRzKAYkoZBDQSeCi8EEioSIdDxKYpXEWedtiOLlVX25JYJo1XDmRMChgojnqBw2gzlz6zceetxO7TlatSq2iazdqewlgoLwYVBF0gmBt2AU0e0kPmCosIjYKDEDAjKpH5UUAxG+Aoq323uk2HP0BkuihsOsNn1WQvncVA+d9TiVKD8xanA+IdTgSjHGekVXx/4B+BETvLgoM3aAAAAAElFTkSuQmCC) ;background-size: cover;}
      .new-message{position: absolute;top:0;right:0;width: 4px;height: 4px;border-radius: 4px;background: red;}
    }
  }
  .jimu_driver_icon div:first-child{
    margin-left: 10px;
  }
  .jimu_driver_info_name {
    font-weight: 900;color: @color-text-light;
  }
  .jimu_driver_info_platenumber {
    font-size: @font-size-base;
    overflow: hidden;text-overflow: ellipsis;
    line-height: 25px;
    span{margin: 0}
    .jimu-driver-platenumber{opacity: 0.9;background: @fill-highlight;border-radius: 1px;color: @fill-base;margin-right: 5px;padding: 2px 5px;margin-left: 0;border-radius: 1px;font-size: @font-size-caption-sm}
    .jimu-car-color {padding-right: 5px;margin-right: 5px;position: relative;}
    .jimu-car-color:after{content: "";position: absolute;overflow: hidden;height: 3px;width: 3px;border-radius: 10px;background: @color-text-base;right:-3px;top:8px;}
  }
  .jimu_driver_star{margin-left: 5px;
    .icon-trip_icon_star{color:@color-icon-base-type1;}
  }
  .jimu_driver_info_autobrand {
    margin:0 !important;
    span {
      margin: 0;
    }
  }
  .jimu_driver_info_name span:first-child{margin-left: 0}
  .jimu_driver_info_autobrand span{
    margin: 0;
  }
  .jimu_driver_info_autobrand>span::after {
    content:" • "
  }
}