.vxe-tip { position: relative; display: flex; flex-direction: row; color: var(--vxe-ui-font-color); margin-bottom: var(--vxe-ui-layout-padding-default); padding: var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-double); } .vxe-tip::after { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 5px; background-color: var(--vxe-ui-font-color); z-index: 1; } .vxe-tip.theme--primary { background-color: var(--vxe-ui-font-primary-tinge-color); } .vxe-tip.theme--primary::after { background-color: var(--vxe-ui-font-primary-color); } .vxe-tip.theme--primary .vxe-tip--icon { color: var(--vxe-ui-font-primary-color); } .vxe-tip.theme--success { background-color: var(--vxe-ui-status-success-tinge-color); } .vxe-tip.theme--success::after { background-color: var(--vxe-ui-status-success-color); } .vxe-tip.theme--success .vxe-tip--icon { color: var(--vxe-ui-status-success-color); } .vxe-tip.theme--info { background-color: var(--vxe-ui-status-info-tinge-color); } .vxe-tip.theme--info::after { background-color: var(--vxe-ui-status-info-color); } .vxe-tip.theme--info .vxe-tip--icon { color: var(--vxe-ui-status-info-color); } .vxe-tip.theme--warning { background-color: var(--vxe-ui-status-warning-tinge-color); } .vxe-tip.theme--warning::after { background-color: var(--vxe-ui-status-warning-color); } .vxe-tip.theme--warning .vxe-tip--icon { color: var(--vxe-ui-status-warning-color); } .vxe-tip.theme--danger { background-color: var(--vxe-ui-status-danger-tinge-color); } .vxe-tip.theme--danger::after { background-color: var(--vxe-ui-status-danger-color); } .vxe-tip.theme--danger .vxe-tip--icon { color: var(--vxe-ui-status-danger-color); } .vxe-tip.theme--error { background-color: var(--vxe-ui-status-error-tinge-color); } .vxe-tip.theme--error::after { background-color: var(--vxe-ui-status-error-color); } .vxe-tip.theme--error .vxe-tip--icon { color: var(--vxe-ui-status-error-color); } .vxe-tip.has--title { padding: var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-double) var(--vxe-ui-layout-padding-double) var(--vxe-ui-layout-padding-double); } .vxe-tip.has--title .vxe-tip--icon { font-size: 1.2em; line-height: 2em; } .vxe-tip--icon { flex-shrink: 0; padding-right: var(--vxe-ui-layout-padding-half); } .vxe-tip--body { flex-grow: 1; } .vxe-tip--title { font-size: 1.1em; line-height: 2em; font-weight: 700; } .vxe-tip { font-size: var(--vxe-ui-font-size-default); } .vxe-tip.size--medium { font-size: var(--vxe-ui-font-size-medium); } .vxe-tip.size--small { font-size: var(--vxe-ui-font-size-small); } .vxe-tip.size--mini { font-size: var(--vxe-ui-font-size-mini); }