@opentiny/vue-theme/user-card/index.css

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

.tiny-card{--tv-UserCard-border-color:var(--tv-color-border, #c2c2c2);--tv-UserCard-image-border-radius:var(--tv-border-radius-md, 6px);--tv-UserCard-state-online-text-color:var(--tv-color-success-text, #5cb300);--tv-UserCard-state-busy-text-color:var(--tv-color-error-text, #f23030);--tv-UserCard-state-goaway-text-color:var(--tv-color-warn-text, #ff8800);--tv-UserCard-state-offline-text-color:var(--tv-color-text-disabled, #c2c2c2);border:1px solid var(--tv-UserCard-border-color);-webkit-box-shadow:2px 3px 7px rgba(0,0,0,.15);box-shadow:2px 3px 7px rgba(0,0,0,.15)}.tiny-card .dialog-foot{display:block}.tiny-card .dialog-foot>div{width:100%;text-align:center}.tiny-card h5,.tiny-card p{margin:5px 0}.tiny-card .card-top{margin-bottom:10px}.tiny-card .card-top img{width:80px;height:80px;border-radius:var(--tv-UserCard-image-border-radius,3px)}.tiny-card .card-top .card-top-text{padding:5px 10px;overflow:hidden}.tiny-card .card-top .card-top-img,.tiny-card .card-top .card-top-text{display:inline-block;vertical-align:middle}.tiny-card .card-bottom{text-align:center;display:block;height:20px;margin:0 -20px -20px}.tiny-card .espace-online{color:var(--tv-UserCard-state-online-text-color)}.tiny-card .espace-busy{color:var(--tv-UserCard-state-busy-text-color);font-size:23px;vertical-align:middle;margin-top:-5px}.tiny-card .espace-goaway{color:var(--tv-UserCard-state-goaway-text-color);background:#fff;border-radius:50%;font-size:13px}.tiny-card .espace-offline{color:var(--tv-UserCard-state-offline-text-color);font-size:23px;vertical-align:middle;margin-top:-5px}