123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- @themeColor: var(--themeColor);
- @textColor:hsl(0, 0%, calc((var(--perceived-lightness) - var(--threshold)) * -10000000%));
- @backgroundColor:rgb(var(--red), var(--green), var(--blue));
- page {
- --threshold: 0.5;
- --border-threshold: 0.8;
- --r: calc(var(--red) * 0.2126);
- --g: calc(var(--green) * 0.7152);
- --b: calc(var(--blue) * 0.0722);
- --sum: calc(var(--r) + var(--g) + var(--b));
- --perceived-lightness: calc(var(--sum) / 255);
- }
- .top_scrprell {
- position: sticky;
- width: 100%;
- z-index: 99;
- }
- .list {
- .li {
- width: 700rpx;
- margin: 20rpx auto;
- padding: 20rpx 10rpx;
- background: white;
- border-radius: 20rpx;
- box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(34, 34, 34, 0.1);
- .li-title {
- font-size: 32rpx;
- margin: 20rpx auto;
- }
- // #e73434
- .li-cont {
- display: flex;
- .li-cont-left {
- width: 160rpx;
- margin-right: 20rpx;
- .goods_image {
- width: 160rpx;
- height: 160rpx;
- }
- }
- .li-cont-rigth {
- flex: 1;
- display: flex;
- // justify-content: space-between;
- align-items: center;
- flex-direction: column;
- .li-row{
- display: flex;
- justify-content: space-between;
- width: 100%;
- margin-bottom: 10rpx;
- }
- .desc {
- overflow: hidden;
- display: -webkit-box;
- -webkit-line-clamp: 2;
- -webkit-box-orient: vertical;
- }
- .li-row-right{
- display: flex;
- justify-content: flex-end;
- width: 100%;
- }
- }
- }
- .date {
- color: black;
- }
- .li-footer {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-top: 10rpx;
- .footer-left {
- color: #949494;
- }
- .footer-right {
- flex: 1;
- display: flex;
- justify-content: flex-end;
- .btn-ov {
- padding: 4rpx 20rpx;
- border: 1rpx solid #949494;
- border-radius: 30rpx;
- margin-left: 10rpx;
- }
- .btn-end {
- padding: 4rpx 20rpx;
- border-radius: 30rpx;
- background: @backgroundColor;
- margin-left: 10rpx;
- // color: white;
- border: 1rpx solid #949494;
- }
- }
- }
- }
- }
- .logistics {
- height: 300rpx;
- overflow-y: auto;
- padding: 10rpx;
- }
|