t-fighting-design/theme/divider.css

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

.f-divider{position:relative;clear:both;width:100%;border:0;border-style:solid;border-bottom:1px solid #b0b0b0;white-space:pre;margin:30px 0}.f-divider.f-divider__vertical{border:0;border-left:1px solid #b0b0b0;display:inline-block;min-width:1px;max-width:1px;height:1em;vertical-align:middle;margin:0 12px}.f-divider.f-divider__dashed{border-style:dashed}.f-divider.f-divider__dotted{border-style:dotted}.f-divider.f-divider__double{border-style:double}.f-divider.f-divider__solid{border-style:solid}.f-divider__text{position:absolute;top:50%;box-sizing:border-box;padding:0 .5rem;font-weight:500;font-size:14px;line-height:2;background:#fff}.f-divider__text.f-divider__text-center{left:50%;transform:translate(-50%,-50%)}.f-divider__text.f-divider__text-right{right:5%;transform:translateY(-50%)}.f-divider__text.f-divider__text-left{left:5%;transform:translateY(-50%)}