.my-message[data-1664346848130] { background: #f9f9f9; .message-header { background: url("~@/assets/image/myRelated/headerBgc.png") no-repeat; background-size: 100% 100%; } .message-content-container { width: $wrapWidth; margin: 0 auto; margin-top: 30px; margin-bottom: 20px; .title { height: 30px; line-height: 30px; .title-span { @include font(18px, #334a5f); margin-left: 10px; font-weight: bold; } .title-icon { cursor: pointer; } } .table-box { margin-top: 20px; background: #fff; padding: 30px; color: #334a5f; min-height: calc(100vh - 340px - 100px - 160px); .table-title { height: 22px; line-height: 22px; margin-bottom: 10px; .title-span { @include font(18px, #334a5f); font-weight: bold; } .unread-num { @include font(16px, #d9121a); margin-right: 5px; } .mark-read { @include font(18px, #0086e7); cursor: pointer; margin-left: 10px; user-select: none; } } .table-container { border: 1px solid #bce1ff; border-bottom: 0; border-top: 2px solid #bce1ff; .block-table { width: 100%; th { background: #f2f7fb; border-color: #bce1ff; height: 80px; @include font(16px, #334a5f); } td { border-color: #bce1ff; height: 50px; @include font(16px, #334a5f); cursor: pointer; } .checked-column { .cell { text-overflow: initial; } } &::before { background-color: #bce1ff; } .check-span { display: inline-block; width: 20px; height: 20px; box-sizing: border-box; border: solid 1px #bce1ff; position: relative; top: 3px; cursor: pointer; user-select: none; img { position: absolute; left: 2px; } &.is-read { border-color: #c0c4cc; cursor: not-allowed; } } } } } .pagination_box { text-align: right; margin-top: 10px; } } }