t-fighting-design/theme/list.css

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

.f-list{margin:0;padding:0;list-style:none;border:1px solid #e3e3e3;overflow-y:auto}.f-list__header{border-bottom:1px solid #e3e3e3;padding:20px;box-sizing:border-box}.f-list__footer{padding:20px;box-sizing:border-box}.f-list.f-list__zebra .f-list__item:nth-of-type(2n){background:#ecf0fe}.f-list.f-list__center .f-list__item{justify-content:center}.f-list.f-list__large .f-list__item{min-height:40px;font-size:16px}.f-list.f-list__middle .f-list__item{min-height:35px;font-size:14px}.f-list.f-list__small .f-list__item{min-height:30px;font-size:12px}.f-list-item{border-bottom:1px solid #e3e3e3;color:#333;background:#fff;font-size:14px;flex-wrap:nowrap;padding:7px 20px;box-sizing:border-box;display:flex;align-items:center;flex-wrap:wrap}.f-list-item:last-child{border-bottom:none}