hm-uniapp-news-detail/components/hm-news-detail/index.response.css

毫末uni-app新闻详情组件。支持H5/小程序(微信、支付宝、头条、百度、QQ)/App；组件可自适应各种屏幕大小的手机。

.hm-news-detail {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  background-color: #ffffff;
  width: 750rpx;
  height: 1228rpx;
}

.hd {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 52rpx;
  width: 748rpx;
}

.yunshu {
  width: 76rpx;
  height: 76rpx;
  filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.09));
}

.container {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin-left: 20rpx;
  height: 76rpx;
}

.outer {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 2rpx;
  width: 510rpx;
  height: 46rpx;
}

.author {
  max-width: 368rpx;
  height: 44rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 44rpx;
  white-space: nowrap;
  color: #000000;
  font-size: 32rpx;
  font-weight: 400;
}

.wrap {
  display: flex;
  align-items: flex-start;
  flex-direction: row;
  margin-top: 12rpx;
  height: 34rpx;
}

.like {
  opacity: 0.5;
  width: 38rpx;
  height: 34rpx;
}

.share {
  opacity: 0.5;
  margin-left: 52rpx;
  width: 30rpx;
  height: 30rpx;
}

.time {
  opacity: 0.6;
  max-width: 560rpx;
  height: 28rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 28rpx;
  white-space: pre;
  color: #000000;
  font-family: Helvetica;
  font-size: 24rpx;
  font-weight: normal;
}

.title {
  margin-top: 36rpx;
  margin-left: 68rpx;
  width: 512rpx;
  height: 100rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 50rpx;
  white-space: pre-wrap;
  color: #000000;
  font-size: 36rpx;
  font-weight: 400;
}

.main {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 16rpx;
  width: 748rpx;
}

.entryPicWrap {
  display: flex;
  position: relative;
  align-items: center;
  flex-direction: row;
  justify-content: center;
  width: 686rpx;
  height: 368rpx;
}

.img {
  position: relative;
  width: 686rpx;
  height: 368rpx;
  filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.05));
}

.ft {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 50rpx;
  width: 748rpx;
}

.content {
  width: 670rpx;
  height: 496rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 62rpx;
  letter-spacing: 0px;
  white-space: pre-wrap;
  color: #000000;
  font-size: 36rpx;
  font-weight: 400;
}