@layui/layui-vue/es/checkcard/index.css

a component library for Vue 3 base on layui-vue

.layui-checkcard{position:relative;display:inline-block;width:320px;margin-right:16px;margin-bottom:16px;color:#000000e0;font-size:14px;vertical-align:top;background-color:#fff;border-radius:var(--global-border-radius);cursor:pointer;transition:all .3s}.layui-checkcard:not(.layui-checkcard-disabled):hover{border-color:var(--global-primary-color)}.layui-checkcard-content{display:flex;padding:10px}.layui-checkcard-left{padding-right:10px}.layui-checkcard-left .layui-checkcard-avatar{width:48px;height:48px;display:inline-block}.layui-checkcard-left .layui-checkcard-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:var(--global-border-radius)}.layui-checkcard-right{width:100%}.layui-checkcard-right>div:not(:last-child){padding-bottom:4px}.layui-checkcard-right .layui-checkcard-desc{color:#000000a6}.layui-checkcard-header{display:flex;align-items:center}.layui-checkcard-header .layui-checkcard-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;color:#000000e0}.layui-checkcard-header .layui-checkcard-is-extra{flex:1}.layui-checkcard-is-cover{padding:4px}.layui-checkcard-is-cover img{width:100%;height:100%;overflow:hidden;border-radius:6px;object-fit:cover}.layui-checkcard-is-description{align-items:center}.layui-checkcard-bordered{border:1px solid var(--global-neutral-color-3)}.layui-checkcard-checked{border-color:var(--global-primary-color)}.layui-checkcard-checked:after{position:absolute;content:"";border:6px solid var(--global-primary-color);border-top-right-radius:2px;right:4px;border-bottom-color:transparent;border-left-color:transparent;top:4px}.layui-checkcard-disabled{cursor:not-allowed;background:#0000000a;border-color:#d9d9d9}.layui-checkcard-disabled .layui-checkcard-avatar{opacity:.25}.layui-checkcard-disabled .layui-checkcard-title,.layui-checkcard-disabled .layui-checkcard-desc{color:#00000040}.layui-checkcard-disabled:after{border:6px solid rgba(0,0,0,.25);border-bottom-color:transparent;border-left-color:transparent}