VCL rating

Rating.

Features

Can visualize the current average rating and take ratings as input by click on a discrete rating item. The rating items are vclIcons with proper ARIA attributes. As an input control, it supports a read read-only mode.

Usage

Basic.

basic example

Highlighted items to visualize the covered range of a rating when hovered with a pointer. In this example, the third item is hovered.

highlight example

Disabled (read-only).

disabled example

Classes

• vclRating
• vclRatingItem

Modifiers

• vclDisabled
• vclRatingItemHighlighted: For rating items to visualize the range of a rating affordance on hover.

Variables

• --rating-item-color
• --rating-item-disabled-color
• --rating-item-highlighted-color

Demo

example.html on GH-pages.