vuestic-ui/dist/esm-node/VaListItem.css

Vue 3 UI Framework

:root,
:host {
  --va-list-width: 100%;
  /* Label */
  --va-list-label-text-align: center;
  --va-list-label-padding: 0.3rem 0;
  /* Item */
  --va-list-item-display: flex;
  --va-list-item-align-items: center;
  --va-list-item-width: 100%;
  --va-list-item-height: 100%;
  /* Item label */
  --va-list-item-label-color: #34495e;
  --va-list-item-label-display: -webkit-box;
  --va-list-item-label-box-orient: vertical;
  --va-list-item-label-overflow: hidden;
  --va-list-item-label-line-height: normal;
  --va-list-item-label-caption-font-size: 85%;
  --va-list-item-label-caption-color: #babfc2;
  /* Item Section */
  --va-list-item-section-display: flex;
  --va-list-item-section-icon-min-width: 1.5rem;
  --va-list-item-section-icon-align-items: center;
  --va-list-item-section-icon-justify-content: center;
  --va-list-item-section-icon-margin: 0.6rem 0.75rem;
  --va-list-item-section-icon-font-size: 1.25rem;
  --va-list-item-section-avatar-min-width: 3rem;
}
.va-list-item {
  display: block;
  font-family: var(--va-font-family);
}
.va-list-item--disabled {
  cursor: default;
  opacity: 0.4;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.va-list-item:not(.va-list-item--disabled):focus-visible {
  outline: 2px solid var(--va-focus) !important;
  border-radius: 2px;
  outline-offset: -2px;
}
.va-list-item__inner {
  display: var(--va-list-item-display);
  align-items: var(--va-list-item-align-items);
  width: var(--va-list-item-width);
  height: var(--va-list-item-height);
}