@adobe/spectrum-css/dist/components/assetlist/index-vars.css

The Spectrum CSS top-level backwards compatible package

.spectrum-AssetList {
  --spectrum-miller-column-checkbox-margin: 0;
}

.spectrum-AssetList {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
}

[dir="ltr"] .spectrum-AssetList-item {
  padding-left: var(--spectrum-miller-column-item-padding-left, var(--spectrum-global-dimension-static-size-200));
  padding-right: var(--spectrum-miller-column-item-padding-right, var(--spectrum-global-dimension-static-size-200));
}

[dir="rtl"] .spectrum-AssetList-item {
  padding-right: var(--spectrum-miller-column-item-padding-left, var(--spectrum-global-dimension-static-size-200));
  padding-left: var(--spectrum-miller-column-item-padding-right, var(--spectrum-global-dimension-static-size-200));
}

.spectrum-AssetList-item {
  position: relative;

  display: -ms-flexbox;

  display: flex;
  box-sizing: border-box;
  -ms-flex-align: center;
      align-items: center;

  width: var(--spectrum-miller-column-width, var(--spectrum-global-dimension-static-size-3400));
  height: var(--spectrum-miller-column-item-height, var(--spectrum-global-dimension-static-size-500));

  padding-top: 0;

  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: var(--spectrum-miller-column-item-margin-bottom, var(--spectrum-global-dimension-static-size-50));
  margin-left: 0;
  margin-right: 0;

  border-radius: var(--spectrum-miller-column-item-border-radius, var(--spectrum-global-dimension-static-size-50));

  transition: background-color var(--spectrum-global-animation-duration-100, 130ms)
    ease-in-out;
  font-size: var(--spectrum-listitem-m-text-size, var(--spectrum-alias-item-text-size-m));
  font-weight: var(--spectrum-listitem-m-text-font-weight, var(--spectrum-alias-body-text-font-weight));
  font-style: normal;

  cursor: pointer;

  outline: none;
}

[dir="ltr"] .spectrum-AssetList-item::before {
    left: 0;
}

[dir="rtl"] .spectrum-AssetList-item::before {
    right: 0;
}

[dir="ltr"] .spectrum-AssetList-item::before {
    right: 0;
}

[dir="rtl"] .spectrum-AssetList-item::before {
    left: 0;
}

.spectrum-AssetList-item::before {
    content: "";

    position: absolute;

    height: var(--spectrum-miller-column-item-height, var(--spectrum-global-dimension-static-size-500));

    background-color: transparent;

    border-radius: var(--spectrum-miller-column-item-border-radius, var(--spectrum-global-dimension-static-size-50));
  }

.spectrum-AssetList-item.is-selectable .spectrum-Checkbox, .spectrum-AssetList-item.is-selected .spectrum-Checkbox, .spectrum-AssetList-item:hover .spectrum-Checkbox, .spectrum-AssetList-item:focus .spectrum-Checkbox {
      display: -ms-inline-flexbox;
      display: inline-flex;
    }

.spectrum-AssetList-item.is-branch .spectrum-AssetList-itemChildIndicator {
      display: block;
    }

[dir="ltr"] .spectrum-AssetList-item .spectrum-AssetList-itemThumbnail {
    margin-left: var(--spectrum-miller-column-thumbnail-margin-left, var(--spectrum-global-dimension-static-size-100));
}

[dir="rtl"] .spectrum-AssetList-item .spectrum-AssetList-itemThumbnail {
    margin-right: var(--spectrum-miller-column-thumbnail-margin-left, var(--spectrum-global-dimension-static-size-100));
}

.spectrum-AssetList-item .spectrum-AssetList-itemThumbnail {
    border-style: none;

    width: var(--spectrum-miller-column-thumbnail-width, var(--spectrum-global-dimension-static-size-300));
    height: var(--spectrum-miller-column-thumbnail-height, var(--spectrum-global-dimension-static-size-300));
    vertical-align: middle;
  }

[dir="ltr"] .spectrum-AssetList-itemSelector {
  margin-right: var(--spectrum-miller-column-checkbox-margin);
}

[dir="rtl"] .spectrum-AssetList-itemSelector {
  margin-left: var(--spectrum-miller-column-checkbox-margin);
}

.spectrum-AssetList-itemSelector {
  display: none;
}

[dir="rtl"] .spectrum-AssetList-itemChildIndicator { transform: matrix(-1, 0, 0, 1, 0, 0) ; }

.spectrum-AssetList-itemChildIndicator {
  display: none;
  transition: transform ease var(--spectrum-global-animation-duration-100, 130ms);
}

[dir="ltr"] .spectrum-AssetList-itemLabel {
  padding-left: var(--spectrum-miller-column-item-label-padding-left, var(--spectrum-global-dimension-static-size-100));
}

[dir="rtl"] .spectrum-AssetList-itemLabel {
  padding-right: var(--spectrum-miller-column-item-label-padding-left, var(--spectrum-global-dimension-static-size-100));
}

.spectrum-AssetList-itemLabel {
  -ms-flex: 1;
      flex: 1;

  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.spectrum-AssetList-item:hover {
    background-color: var(--spectrum-miller-column-item-background-color-hover, var(--spectrum-global-color-gray-200));
  }

.spectrum-AssetList-item:focus.focus-ring,
    .spectrum-AssetList-item:focus.is-focused {
      background-color: var(--spectrum-miller-column-item-background-color-hover, var(--spectrum-global-color-gray-200));
    }

.spectrum-AssetList-item:focus.focus-ring::before, .spectrum-AssetList-item:focus.is-focused::before {
        box-shadow: 0px 0px 0px 2px var(--spectrum-alias-border-color-focus, var(--spectrum-global-color-blue-400)) inset;
      }

.spectrum-AssetList-item.is-navigated {
    background-color: var(--spectrum-miller-column-item-background-color-down, var(--spectrum-global-color-gray-300));
  }

.spectrum-AssetList-item.is-navigated:hover,
    .spectrum-AssetList-item.is-navigated:focus {
      background-color: var(--spectrum-miller-column-item-background-color-down, var(--spectrum-global-color-gray-300));
    }

.spectrum-AssetList-item.is-selected {
    background-color: var(--spectrum-miller-column-item-background-color-selected);
  }

.spectrum-AssetList-item.is-selected:hover,
    .spectrum-AssetList-item.is-selected:focus {
      background-color: var(--spectrum-miller-column-item-background-color-selected-hover);
    }