@ozen-ui/kit/__inner__/cjs/components/FileIcon/FileIcon.css

React component library

/* stylelint-disable */
.FileIcon {
  font: var(--typography-text-s_1-font);
  letter-spacing: var(--typography-text-s_1-letter_spacing, 0);
  text-transform: var(--typography-text-s_1-text_transform, none);
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  inline-size: var(--file-icon-size);
  block-size: var(--file-icon-size);
  background-color: var(--file-icon-background-color);
  transition: background-color var(--transition-default), color var(--transition-default);
  color: var(--file-icon-content-color);
  border-radius: var(--file-icon-border-radius);
  overflow: hidden;
}
.FileIcon_size_xs {
    --file-icon-size: var(--control-height-xs);
    --file-icon-border-radius: var(--border-radius-m);
  }
.FileIcon_size_m {
    --file-icon-size: var(--control-height-m);
    --file-icon-border-radius: var(--border-radius-l);
  }
.FileIcon_color_main {
    --file-icon-background-color: var(--color-background-primary);
    --file-icon-content-color: var(--color-content-primary);
  }
.FileIcon_color_primary {
    --file-icon-background-color: var(--color-background-secondary);
    --file-icon-content-color: var(--color-content-primary);
  }
.FileIcon_status_error {
    --file-icon-background-color: var(--color-background-error-light);
    --file-icon-content-color: var(--color-content-error)
  }
.FileIcon_status_loading {
    --file-icon-background-color: var(--color-background-disabled);
    --file-icon-content-color: var(--color-content-disabled);
  }
.FileIcon_status_unknown {
    --file-icon-background-color: var(--color-background-success-light);
    --file-icon-content-color: var(--color-content-success);
  }