gcb_zc/assets/new.scss

@charset "utf-8";
//font 

$bg-color:#f8f9fa;  // 全局背景色
$tag-bg:#f2f2fa;  // 标签背景色
$highlight-color: #f0f0f0;  // 弱线分割
$grey-color: #efefef;  // 列表分隔
$grey-border-bottom: 1px solid $highlight-color;  // 列表底部分隔线
$red:#ff5c5c;  // 品牌色
$black202020:#202020;  // 大黑
$black7a7a7a:#7a7a7a;  // 中黑
$blackafafaf:#afafaf;  // 灰
$efefef:#efefef;
$f0f0f0:#f0f0f0;



// 我的界面嵌套样式css

// 头部个人消息
.top_info{
    width: 100%;
    background-color: #fff;
    background-image: url('../static/img/bg-me.png');
    
    background-repeat: no-repeat;
    background-size: 100%;
    margin-bottom: 1rem;
    height: auto;
    .user_info{
      padding: 1rem 0.5rem;
      padding-left: 2rem;
      padding-top: 6rem;
      h2{
          width: 6rem;
          height: 6rem;
          border-radius: 50%;
          float: left;
          margin-right: 1rem;
          display:flex;
          align-items:center;
      }
      h2 img{
          width: 100%;
      }
      div{
          float: left;
        //   display:flex;
          align-items:center;
          p{
              display: block;
              color: #fff;
          }
      }
    }
    // end：头像姓名结束

    // 会员尊享
    .verify{
        border-radius: 0.8rem;
        padding:0 1rem;
        margin: 0 1.5rem;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        background-color: #fff;
        height: 6rem;
        line-height: 6rem;
        position: relative;
        margin-top: 1rem;
        p{
            color: #d4ae5b;
            font-size: 1.8rem;
            font-weight: bold;
            padding-left: 3rem;
            &::after{
                content: '';
                display: block;
                position: absolute;
                width: 2.2rem;
                height: 2.2rem;
                left: 1rem;
                top: 50%;
                margin-top: -1.1rem;
                background-image: url('../static/img/icon_V.png');
                background-repeat: no-repeat;
                background-size: 100%;
            }
        }
        a{
            padding: 0 0.8rem;
            border-radius: 0.5rem;
            color: #fff;
            font-weight: bold;
            height: 3rem;
            line-height: 3rem;
            position: absolute;
            top: 50%;
            right: 2rem;
            margin-top: -1.5rem;
            font-size: 1.5rem;
        }
       
    }
    // end：会员尊享结束

    .real_name{
        padding-left: 1.5rem;
        background-color: #fff;
    }
  }

//   菜单列表
.menu-list{
    margin-bottom: 1rem;
    background-color: #fff;
    li{
        position: relative;
        height: 5.5rem;
        line-height: 5.5rem;
        z-index: 99;
        padding-left: 1.5rem;
        &:last-child::after{
            height: 0;
        }
        &::after{
            content: '';
            display: block;
            background-color: $efefef;
            position: relative;
            height: 0.05rem;
            left: 0;
            right: 0;
        }
        img{
            width: 2.2rem;
            height: 2.2rem;
            position: absolute;
            top: 50%;
            margin-top: -1.1rem;
        }
        a{
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba($color: #000000, $alpha: 0);
            z-index: 100;
        }
        p{
            padding-left: 3rem;
            // &::before{
            //     content: '';
            //     display: block;
            //     background-color: pink;
            //     position: absolute;
            //     width: 2.2rem;
            //     height: 2.2rem;
            //     left: 0;
            //     top: 50%;
            //     margin-top: -1.1rem;
            // }
            &::after{
                content: '';
                display: block;
                position: absolute;
                width: 0.6rem;
                height: 1.2rem;
                right: 1.5rem;
                top: 50%;
                margin-top: -0.6px;
                background-image: url('../static/img/arr_back_next.png');
                background-repeat: no-repeat;
                background-size: 100%;

            }
        }
    }
}