Newer
Older
navi-1 / webclient / src / components / artifacts / styles / _lists.scss
.artifact-item {
  width: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 0;
  border-left: var(--gn-border-width-accent) solid transparent; /* active bar, same row geometry */
  background: transparent;
  color: var(--gn-color-text-light);
  text-align: left;
  cursor: pointer;
  transition: background var(--gn-motion-fast) var(--gn-motion-ease), border-color var(--gn-motion-fast) var(--gn-motion-ease);
}

.artifact-item:hover {
  background: color-mix(in srgb, var(--gn-color-text-light) 7%, transparent);
}

.artifact-item.is-active {
  border-left-color: var(--gn-color-secondary);
  background: var(--gn-surface-panel-muted);
}

.artifact-icon {
  display: inline-flex;
  flex-shrink: 0;
  color: var(--gn-color-accent);
  font-size: 20px;
}

.artifact-info {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.artifact-title,
.artifact-detail-title,
.artifact-detail-filename {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.artifact-title {
  font-size: 13px;
  font-weight: 500;
}

.artifact-meta {
  font-size: 11px;
  color: var(--gn-color-text-dark);
}