@opensig/opendesign/lib/breadcrumb/style/index.css

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

.o-breadcrumb {
  --breadcrumb-color: var(--o-color-info3);
  --breadcrumb-color-hover: var(--o-color-info1);
  --breadcrumb-color-active: var(--o-color-info1);
  --breadcrumb-color-selected: var(--o-color-info1);
  --breadcrumb-text-size: var(--o-font_size-tip1);
  --breadcrumb-text-height: var(--o-line_height-tip1);
  --breadcrumb-gap: 4px;
  --breadcrumb-seperator-size: var(--o-icon_size_control-m);
  --breadcrumb-label-max-width: 140px;
}

.o-breadcrumb {
  display: inline-flex;
  align-items: center;
  color: var(--breadcrumb-color);
  font-size: var(--breadcrumb-text-size);
  line-height: var(--breadcrumb-text-height);
}
.o-breadcrumb a {
  color: inherit;
  text-decoration: none;
}

.o-breadcrumb-item {
  display: inline-flex;
  align-items: center;
}
.o-breadcrumb-item:last-child {
  color: var(--breadcrumb-color-selected);
  font-weight: 500;
}
.o-breadcrumb-item:last-child .o-breadcrumb-item-label {
  cursor: auto;
  max-width: none;
}
.o-breadcrumb-item:last-child .o-breadcrumb-item-separator {
  display: none;
}

.o-breadcrumb-item-label {
  cursor: pointer;
  max-width: var(--breadcrumb-label-max-width);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color var(--o-duration-s) var(--o-easing-standard);
}
@media (hover: hover) {
  .o-breadcrumb-item-label:hover {
    color: var(--breadcrumb-color-hover);
  }
}
.o-breadcrumb-item-label:active {
  color: var(--breadcrumb-color-active);
}

.o-breadcrumb-item-separator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--breadcrumb-seperator-size);
  font-size: var(--breadcrumb-seperator-size);
  line-height: 1;
  transition: color var(--o-duration-s) var(--o-easing-standard);
  margin: 0 var(--breadcrumb-gap);
}

@media (max-width: 1440px) {
  .o-breadcrumb {
    --breadcrumb-text-size: var(--o-font_size-tip2);
    --breadcrumb-text-height: var(--o-line_height-tip2);
    --breadcrumb-seperator-size: var(--o-icon_size_control-xs);
  }
}