wiki_enterprise_js/common/style/uni/list.scss

/* 列表 */
.uni-list {
  background-color: $white;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.uni-list:after {
  position: absolute;
  z-index: 10;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1upx;
  content: '';
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
  background-color: $greyLight;
}

.uni-list:before {
  position: absolute;
  z-index: 10;
  right: 0;
  top: 0;
  left: 0;
  height: 1upx;
  content: '';
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
  background-color: $greyLight;
}

.uni-list-cell {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.uni-list-cell-hover {
  background-color: #eee;
}

.uni-list-cell-pd {
  padding: 22upx 30upx;
}

.uni-list-cell-left {
  font-size: 28upx;
  padding: 0 30upx;
}

.uni-list-cell-db,
.uni-list-cell-right {
  flex: 1;
}

.uni-list-cell:after {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  left: 30upx;
  height: 1upx;
  content: '';
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
  background-color: $greyLight;
}

.uni-list .uni-list-cell:last-child:after {
  height: 0upx;
}

.uni-list-cell-last.uni-list-cell:after {
  height: 0upx;
}

.uni-list-cell-divider {
  position: relative;
  display: flex;
  color: $grey;
  background-color: $greyLight;
  padding: 15upx 20upx;
}

.uni-list-cell-divider:before {
  position: absolute;
  right: 0;
  top: 0;
  left: 0upx;
  height: 1upx;
  content: '';
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
  background-color: $greyLight;
}

.uni-list-cell-divider:after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0upx;
  height: 1upx;
  content: '';
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
  background-color: $greyLight;
}

.uni-list-cell-navigate {
  font-size: 30upx;
  padding: 22upx 30upx;
  line-height: 48upx;
  position: relative;
  display: flex;
  box-sizing: border-box;
  width: 100%;
  flex: 1;
  justify-content: space-between;
  align-items: center;
}

.uni-list-cell-navigate {
  padding-right: 36upx;
}

.uni-navigate-badge {
  padding-right: 50upx;
}

.uni-list-cell-navigate.uni-navigate-right:after {
  font-family: uniicons;
  content: '\e583';
  position: absolute;
  right: 24upx;
  top: 50%;
  color: #bbb;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.uni-list-cell-navigate.uni-navigate-bottom:after {
  font-family: uniicons;
  content: '\e581';
  position: absolute;
  right: 24upx;
  top: 50%;
  color: #bbb;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.uni-list-cell-navigate.uni-navigate-bottom.uni-active:after {
  font-family: uniicons;
  content: '\e580';
  position: absolute;
  right: 24upx;
  top: 50%;
  color: #bbb;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.uni-collapse.uni-list-cell {
  flex-direction: column;
}

.uni-list-cell-navigate.uni-active {
  background: #eee;
}

.uni-list.uni-collapse {
  box-sizing: border-box;
  height: 0;
  overflow: hidden;
}

.uni-collapse .uni-list-cell {
  padding-left: 20upx;
}

.uni-collapse .uni-list-cell:after {
  left: 52upx;
}

.uni-list.uni-active {
  height: auto;
}

/* 三行列表 */
.uni-triplex-row {
  display: flex;
  flex: 1;
  width: 100%;
  box-sizing: border-box;
  flex-direction: row;
  padding: 22upx 30upx;
}

.uni-triplex-right,
.uni-triplex-left {
  display: flex;
  flex-direction: column;
}

.uni-triplex-left {
  width: 84%;
}

.uni-triplex-left .uni-title {
  padding: 8upx 0;
}

.uni-triplex-left .uni-text,
.uni-triplex-left .uni-text-small {
  color: #999999;
}

.uni-triplex-right {
  width: 16%;
  text-align: right;
}

/* 图文列表 */
.uni-media-list {
  padding: 22upx 30upx;
  box-sizing: border-box;
  display: flex;
  width: 100%;
  flex-direction: row;
}

.uni-navigate-right.uni-media-list {
  padding-right: 74upx;
}

.uni-pull-right {
  flex-direction: row-reverse;
}

.uni-pull-right > .uni-media-list-logo {
  margin-right: 0upx;
  margin-left: 20upx;
}

.uni-media-list-logo {
  height: 84upx;
  width: 84upx;
  margin-right: 20upx;
}

.uni-media-list-logo image {
  height: 100%;
  width: 100%;
}

.uni-media-list-body {
  height: 84upx;
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  overflow: hidden;
}

.uni-media-list-text-top {
  width: 100%;
  line-height: 36upx;
  font-size: 30upx;
}

.uni-media-list-text-bottom {
  width: 100%;
  line-height: 30upx;
  font-size: 26upx;
  color: $grey;
}