| 1 |
- :root{--van-nav-bar-height:46px;--van-nav-bar-background:var(--van-background-2);--van-nav-bar-arrow-size:16px;--van-nav-bar-icon-color:var(--van-primary-color);--van-nav-bar-text-color:var(--van-primary-color);--van-nav-bar-title-font-size:var(--van-font-size-lg);--van-nav-bar-title-text-color:var(--van-text-color);--van-nav-bar-z-index:1}.van-nav-bar{position:relative;z-index:var(--van-nav-bar-z-index);line-height:var(--van-line-height-lg);text-align:center;background:var(--van-nav-bar-background);-webkit-user-select:none;-moz-user-select:none;user-select:none}.van-nav-bar--fixed{position:fixed;top:0;left:0;width:100%}.van-nav-bar--safe-area-inset-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.van-nav-bar .van-icon{color:var(--van-nav-bar-icon-color)}.van-nav-bar__content{position:relative;display:flex;align-items:center;height:var(--van-nav-bar-height)}.van-nav-bar__arrow{margin-right:var(--van-padding-base);font-size:var(--van-nav-bar-arrow-size)}.van-nav-bar__title{max-width:60%;margin:0 auto;color:var(--van-nav-bar-title-text-color);font-weight:var(--van-font-bold);font-size:var(--van-nav-bar-title-font-size)}.van-nav-bar__left,.van-nav-bar__right{position:absolute;top:0;bottom:0;display:flex;align-items:center;padding:0 var(--van-padding-md);font-size:var(--van-font-size-md)}.van-nav-bar__left{left:0}.van-nav-bar__right{right:0}.van-nav-bar__text{color:var(--van-nav-bar-text-color)}.messageList ul{margin:12px 0 0 0;padding-left:12px;background:#fff}.messageList ul li{padding:20px 12px 20px 0;display:flex;justify-content:space-between;height:80px;box-sizing:border-box;border-bottom:1px solid #ddd}.messageList ul li .text-center{flex:1;max-width:calc(100vw - 140px)}.messageList ul li .text-center .title{font-size:16px;font-weight:700;color:#333}.messageList ul li .text-center .content{font-size:14px;color:#999;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.messageList ul li .text-right{display:flex}.messageList ul li .text-right .van-badge__wrapper{line-height:40px}.messageList ul li .text-right .time-or-num{text-align:center;margin-right:5px}.messageList ul li .text-right .time-or-num .time{font-size:12px;color:#999}.messageList ul li .text-right .time-or-num .num{height:16px;background:#ff4d4f;border-radius:8px;text-align:center;line-height:16px;font-size:12px;color:#fff;margin-top:8px}.messageList ul li .icon-box{width:40px;height:40px;background:#ccc;border-radius:20px;text-align:center;line-height:40px;margin-right:20px}.messageList ul li .icon-box i{font-size:20px;color:#fff}
|
