@spaced-out/ui-design-system/lib/components/Rating/Rating.module.css

Sense UI components library

@value (
    spaceNone,
    spaceXSmall,
    spaceXXSmall
) from '../../styles/variables/_space.css';
@value (
  colorFocusPrimary
) from '../../styles/variables/_color.css';
@value (
  borderRadiusXSmall,
  borderWidthNone,
  borderWidthTertiary
) from '../../styles/variables/_border.css';

.ratingContainer {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: spaceXSmall;
  margin: spaceXXSmall spaceXSmall;
}

.stars {
  display: flex;
}

.icon {
  composes: motionEaseInEaseOut from '../../styles/animation.module.css';
  margin: spaceNone spaceXXSmall;
}

.button {
  border-radius: borderRadiusXSmall;
  outline: none;
  cursor: pointer;
}

.button:focus {
  box-shadow: borderWidthNone borderWidthNone borderWidthNone
    borderWidthTertiary colorFocusPrimary;
}