user.index.css

/**
 * 用户中心
 */
.user-base, ul.order-base{overflow: hidden;}
.user-base{-webkit-animation: changeBg 20s infinite; -moz-animation: changeBg 20s infinite; animation: changeBg 20s infinite; background-color: #ED5564; background-image: url(../images/user-member_top_bg.png); background-size: cover; width: 100%; position: relative; padding: 20px 10px;}
.user-base p, .user-base span, .user-base a{color: #fff;}
.user-base a, .order-base a, .order-nav a{text-decoration: none;}
.user-avatar{text-align: center;}
.user-avatar .user-name{font-weight: 500;}
.user-avatar img.avatar {width: 80px; height: 80px; border-radius: 100%;}
.user-avatar .user-name{margin-top: 5px;}
.user-base-left .items a{color: #f8f8f8;}
.user-base-right a:not(:last-child){margin-right: 15px;}
ul.user-base-icon{background: rgba(0,0,0,0.1); position: absolute;}
.order-nav{padding: 10px 5px; border-bottom: 1px solid #f1f1f1;}
.order-nav i{width: 20px; height: 20px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 70%; display: inline-block; vertical-align: bottom;}
.order-nav .nav-name i.order-icon{background-image: url(../images/user-index-nav-order-icon.png);}
.order-nav .icon-tips, .order-base a{color: #888;}
.order-nav .icon-tips i{padding-left: 5px;}
ul.order-base{margin-bottom: 10px; border-bottom: 1px solid #f1f1f1; padding: 13px 0 5px 0;}
ul.order-base li{float: left; width: 25%; text-align: center; position: relative;}
ul.order-base li i{width: 20px; height: 20px; background-repeat: no-repeat; display: inline-block; vertical-align: bottom; opacity: 0.5; background-size: cover; margin-bottom: 2px;}
ul.order-base i.icon-1{background-image: url(../images/user-index-nav-order-icon-1.png);}
ul.order-base i.icon-2{background-image: url(../images/user-index-nav-order-icon-2.png);}
ul.order-base i.icon-3{background-image: url(../images/user-index-nav-order-icon-3.png);}
ul.order-base i.icon-100{background-image: url(../images/user-index-nav-order-icon-100.png);}
ul.order-base li span.am-badge{position: absolute; top: -7px; left: 55%;}

/**
 * PC
 */
@media only screen and (min-width: 641px) {
    .user-base-left, .user-avatar, .user-base-left .items{float: left;}
    .user-base-right{float: right;}
    .user-base-left .items{margin-left: 15px;}
    .user-base-left .items a{display: block; line-height: 28px;}
    ul.user-base-icon{bottom: 20px; right: 10px;}
    ul.user-base-icon li{float: left; padding: 5px 20px; text-align: center;}
    ul.user-base-icon li p{font-weight: 500;}
}

/**
 * 手机
 */
@media only screen and (max-width:640px) {
    .am-footer{padding-bottom: 55px;}
    .nav-search{display: none;} .user-main{padding-top: 0;}
    .user-content-body{padding: 0;}
    .user-base{text-align: center; height: 210px;}
    .user-avatar{margin-bottom: 10px; }
    .user-base-left .items a:not(:last-child){margin-right: 20px;}
    .user-base-right{position: absolute; right: 10px; top: 10px;}
    ul.user-base-icon{left: 0; bottom: 0; width: 100%; padding: 5px 0;}
    ul.user-base-icon li{float: left; width: 25%;}
}


/**
 * 聚合内容
 */
.various .am-panel{margin-bottom: 10px; box-shadow: none;}
.various .am-panel-default{border-color: #f1f1f1;}
.various .am-panel-default > .am-panel-hd i{border-left: 3px solid #ed636d; margin-right: 5px;}
.various .am-panel-default > .am-panel-hd{padding: 5px;}
.various i.am-icon-lg{color: #e8e8e8; font-size: 18px;}
.various .tips-name{font-size: 16px; font-weight: 500; color: #b9b7b7;}
.various .tips-msg{color: #ccc;}
.various .order-list, .various .cart-list{padding: 0 5px;}
.various .am-panel .more-tips{color: #666;}
.various .goods-favor-list, .various .goods-browse-list, .various .am-gallery{padding: 0;}
.various .am-gallery-item{overflow: hidden; text-align: center;}
.various .line-price{color: #d2364c; font-weight: 700; font-family: Verdana,Tahoma,arial; }
.various .goods-browse-list .am-gallery-item img {width: 80%;}
.various .am-gallery-overlay .am-gallery-desc{display: block; position: absolute; right: 0; top: 0; background-color: #d2364c; color: #fff; padding: 0 5px;}

/**
 * PC
 */
@media only screen and (min-width: 641px) {
    .various .am-u-md-8{padding-left: 0; padding-right: 10px;}
    .various .am-u-md-4{padding: 0;}
    .various .am-panel-default:hover{border-color: #ed636d;}
    .various .am-panel-default > .am-panel-hd{border-bottom: 0;}
    .various .order-list, .various .cart-list{height: 210px;}
    .various .am-gallery-item{height: 80px;}
    .various .goods-favor-list, .various .goods-browse-list{height: 180px;}
    .various .am-gallery:hover img {opacity: 0.5;}
    .various .am-gallery li:hover img { opacity: 1; }
}
@media only screen and (min-width:1025px) {
    .various .am-gallery-item{height: 120px;}
    .various .goods-favor-list, .various .goods-browse-list{height: 260px;}
}
/**
 * 手机
 */
@media only screen and (max-width:640px) {
    .various .am-u-md-8, .various .am-u-md-4{padding: 0;}
    .various .am-panel{border: 0;}
    .various .am-panel-default > .am-panel-hd{background-color: #fff; border-bottom: 1px solid #f1f1f1;}
}

/**
 * 商品列表
 */
.various .goods-detail { position: relative; padding: 5px 0; height: 70px; }
.various .goods-detail:not(:last-child) { border-bottom: 1px solid #f5f5f5; }
.various .goods-detail img { width: 60px; height: 60px; }
.various .goods-title { display: block; max-height: 36px; overflow: hidden; text-overflow: ellipsis; font-weight: 500; }
.various .goods-title:hover { text-decoration: underline; }
.various .goods-base { position: absolute; top: 5px; left: 65px; width: calc(100% - 65px); }
.various .goods-base ul li span:not(:first-child) { margin-left: 10px; }
.various .goods-base ul li { color: #777; }
.various .goods-detail .order-submit { margin-top: 16px; }
.various .order-list .goods-base { width: calc(100% - 120px); }