tdesign-react/es/divider/style/index.css

TDesign Component for React

.t-divider {
  margin: 0;
  padding: 0;
  list-style: none;
  font: var(--td-font-body-medium);
  margin: var(--td-comp-margin-xxl) 0;
  border-top: 1px solid var(--td-border-level-1-color);
  color: var(--td-text-color-primary);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.t-divider--dashed {
  border-top-style: dashed;
}
.t-divider--horizontal {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.t-divider--vertical {
  border-top: 0;
  display: inline-block;
  margin: 0 var(--td-comp-margin-m);
  border-left: 1px solid var(--td-border-level-1-color);
  height: 0.9em;
  vertical-align: middle;
}
.t-divider--with-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-top: 0;
  white-space: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.t-divider--with-text .t-divider__inner-text:not(:empty) {
  padding: 0 1em;
  display: inline-block;
}
.t-divider--with-text::before,
.t-divider--with-text::after {
  content: "";
  width: 50%;
  border-top: 1px solid var(--td-border-level-1-color);
}
.t-divider--with-text-left::before {
  width: 5%;
}
.t-divider--with-text-left::after {
  width: 95%;
}
.t-divider--with-text-right::before {
  width: 95%;
}
.t-divider--with-text-right::after {
  width: 5%;
}
.t-divider--dashed::before,
.t-divider--dashed::after {
  border-top: 1px dashed var(--td-border-level-1-color);
}
.t-divider--vertical.t-divider--dashed {
  border-left: 1px dashed var(--td-border-level-1-color);
}