fine-true/lib/collapse-item/index.less

A small and beautiful Vue3 version of the UI Library

@import '../style/var.less';

.fine-collapse-item {
  display: block;
  .fine-collapse-head {
    display: flex;
    padding: 12px 25px;
    background-color: #fafafa;
    cursor: pointer;
    .fine-collapse-title {
      flex: 1;
      font-size: var(--fine-collapse-title-size);
      color: var(--fine-collapse-title-color);
    }
    .fine-collapse-icons {
      font-size: var(--fine-collapse-icon-size);
      color: var(--fine-collapse-icon-color);
      .fine-collapse-icon-on,
      .fine-collapse-icon-off {
        font-size: var(--fine-collapse-icon-size);
        color: var(--fine-collapse-icon-color);
        display: inline-block;
        transition: transform 0.25s;
      }
      .fine-collapse-icon-on {
        transform: rotate(90deg);
      }
    }
  }
  .fine-collapse-body {
    padding: var(--fine-collapse-body-padding);
  }
}