ypg-xcx/pages/index/index.wxss

@import "../../template/template.wxss";
/**index.wxss**/
page{
  background: #f1f1f1;
}
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}
.userinfo-nickname {
  color: #aaa;
}
.usermotto {
  margin-top: 200rpx;
}
/*banner*/
.banner-box{
  width: 100%;
}
.banner-box .banner-weiper{
  height: 300rpx;
}
.select-banner{
  height: 100%;
}
.banner-1{
  background: #1AAD19;
}
.banner-2{
  background: #2782D7;
}
.banner-3{
  background: #fb752c;
}
/* 导航 */
.nav-box{
  width: 100%;
  background: #fff;
  margin-bottom: 1rpx;
}
.nav-box .nav-selse-navigator{
  text-align: center;
  border-bottom: 5px solid #f1f1f1;
}
.nav-box .nav-selse-navigator:after{
  content: "";
  display: block;
  clear: both;
}
.nav-box .nav-selse-navigator navigator{
  float: left;
  width: 25%;
  padding: 20rpx 0;
}
.nav-box .nav-selse-navigator navigator image{
  width: 70rpx;
  height: 70rpx;
  margin-bottom: 10rpx;
}
.nav-box .nav-selse-navigator navigator .nav-text{
  font-size: 24rpx;
  color: #666;
}
/* 导航下的公告 */
.nav-box .nav-notice{
  padding: 10rpx 0;
  border-bottom: 10rpx solid #f1f1f1;
}
.nav-box .nav-notice::after{
  content: "";
  display: block;
  clear: both;
}
.nav-box .nav-notice image{
  width: 50rpx;
  height:50rpx;
  float: left;
  margin-left: 10rpx;
  margin-right: 10rpx;
}
.nav-box .nav-notice text{
  display: block;
  height:100%;
  font-size: 24rpx;
  line-height: 50rpx;
}
.nav-box .nav-notice .notice-swiper{
  height: 50rpx;
  width: 85%;
  float: left;
}
.nav-box .nav-notice .notice-swiper swiper-item{
  height: 100%;
}
.nav-box .nav-notice .notice-swiper swiper-item text{
  float: left;
}
.nav-box .nav-notice .notice-swiper swiper-item .notice-data-style{
  color: #2782D7;
}
.notice-data-goods{
  width: 350rpx;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
/* 商品分类推荐展示窗口 */
.listgoods-box{
  width: 100%;
}
.listgoods-box .classify{
  background: #fff;
  margin-bottom: 25rpx;
  height: 92rpx;
}
.listgoods-box .classify .classify-position:after{
  content: "";
  display: block;
  clear:both;
}
.listgoods-box .classify .classify-position{
  background: #fff;
  width: 100%;
  z-index: 999;
}
.listgoods-box .classify .classify-fixed{
  position: fixed;
  top: 0;
}
.listgoods-box .classify .classify-position view{
  float: left;
  width: 33.33333%;
}
.listgoods-box .classify view text{
  display: block;
  text-align: center;
  font-size: 30rpx;
  color: #333;
  width: 60%;
  margin: 0 auto;
  line-height: 90rpx;
  
}
.listgoods-box .classify view .classify-select{
  border-bottom: 6rpx solid #fb752c;
  color: #fb752c;
}
.listgoods-box .container-box:after{
  content: "";
  display: block;
  clear: both;
}
image{
  width: 100%;
  height: 100%;
}
.red-packet{
  background: rgba(0, 0, 0, 0.3);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.red-packet image{
  position: absolute;
  width: 524rpx;
  height: 632rpx;
  top: 50%;
  left: 50%;
  margin-left: -262rpx;
  margin-top: -316rpx;  
}
.red-packet .close{
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -310rpx;
  margin-left: 210rpx;
  z-index: 10;
}
.red-packet .btn{
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 190rpx;
  margin-left: -254rpx; 
  width: 600rpx;
}
.red-packet .btn::after{
  content: '';
  display: block;
  clear: both;
}
.red-packet .btn button::before{
  border: none;
}
.red-packet .btn button {
  width: 200rpx;
  height: 80rpx;
  float: left;
  margin-left: 30rpx;
  background: #fff;
  border-radius: 40rpx;
  font-size: 30rpx;
  color: #f8c323;
}
.red-packet text{
  width: 100%;
  position: absolute;
  top: 50%;
  margin-top: -110rpx;
  text-align: center;
  color: #e12e2e;
  font-weight: 600;
  font-size: 42rpx;
}
.ad {
  width: 100%;
  height: 140rpx;
  margin-bottom: 10rpx;
  background: #ccc;
}
.ad navigator{
  height: 100%;
}
.ad navigator image {
  height: 100%;
}