vue-amazing-ui/lib/list/listitem/ListItem.css

An Amazing Vue3 UI Components Library, Using TypeScript.

.list-item-wrap[data-v-ce104de3]{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;color:#000000e0;max-width:100%;transition:all .3s}.list-item-wrap .list-item-main[data-v-ce104de3]{display:flex;align-items:center;flex:1}.list-item-wrap .list-item-main .list-item-meta[data-v-ce104de3]{display:flex;flex:1;align-items:flex-start;max-width:100%}.list-item-wrap .list-item-main .list-item-meta .list-item-avatar[data-v-ce104de3]{margin-right:16px}.list-item-wrap .list-item-main .list-item-meta .list-item-content[data-v-ce104de3]{flex:1 0;width:0;color:#000000e0}.list-item-wrap .list-item-main .list-item-meta .list-item-content .list-item-title[data-v-ce104de3]{margin-bottom:4px;color:#000000e0;font-size:14px;font-weight:700;line-height:1.57142857}.list-item-wrap .list-item-main .list-item-meta .list-item-content .list-item-title[data-v-ce104de3] a{font-weight:700;color:#000000e0;transition:all .3s}.list-item-wrap .list-item-main .list-item-meta .list-item-content .list-item-title[data-v-ce104de3] a:hover{color:#1677ff}.list-item-wrap .list-item-main .list-item-meta .list-item-content .list-item-description[data-v-ce104de3]{color:#00000073;font-size:14px;line-height:1.57142857}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]{flex:0 0 auto;margin-left:48px;font-size:0}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3] svg{fill:currentColor}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]>*{position:relative;display:inline-flex;align-items:center;padding:0 8px;color:#00000073;font-size:14px;line-height:1.57142857;text-align:center}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]>*:first-child{padding-left:0}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]>*:not(:last-child):after{position:absolute;top:50%;right:0;width:1px;height:14px;transform:translateY(-50%);background-color:#0505050f;content:""}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]>a{color:#1677ff;transition:color .3s}.list-item-wrap .list-item-main .list-item-actions[data-v-ce104de3]>a:hover{color:#4096ff}.list-item-wrap .list-item-extra[data-v-ce104de3]{margin-left:24px}