/*
Elements
The elements a css star rating component consists of.
Her you can see the html structure and the combination of elements.
The star rating component consists of:
- A star element
to display the star state
- A star-container element
to handle multiple stars as a rating
- A label element
to display the additional test next to the rating
markup:
Star:
Star Container:
Label:
good
sg-wrapper:
Styleguide 1.2
*/
/*
Star Element
The Star element.
markup:
Styleguide 1.2.1
*/
/*
Star fill states
The Star element visualizes the interactive star element it it's three fill states.
.empty - displays the star element as empty
.half - displays the star element as half filled
.filled - displays the star element as filled
markup:
Styleguide 1.2.1.1
*/
/*
Star colors
The different star colors.
.positive - Stars is colored positive
.ok - Stars is colored ok
.negative - Stars is colored negative
markup:
Styleguide 1.2.1.2
*/
/*
Star types
The different star types.
.svg - Stars svg icon is used
.icon - Stars character icon is used
.custom-icon - Stars character icon is used
markup:
Styleguide 1.2.1.1.3
*/
/*
Star icons
The different star icons.
.fa.fa-star-half-o - font-awesome star-icon
.ion-ios-star-half - bootstrap star-icon
.fa.fa-gear - ionicons star-icon
markup:
Styleguide 1.2.1.1.3.1
*/
/*
Star sizes
The Star sizes.
.small - displays star in small size
.medium - displays star in medium size
.large - displays star in large size
markup:
Styleguide 1.2.1.3
*/
/*
Star Disabled state
The Star element in disabled state.
.disabled - displays star in disabled state
markup:
Styleguide 1.2.1.4
*/
/*
The the direction of the star icon.
.direction-rtl - displays star icon in right to left direction.
.direction-ltr - displays star icon in left to right direction.
markup:
sg-wrapper:
Styleguide 1.2.1.5
*/
/*
Star Container
The wrapper container for many stars.
markup:
Styleguide 1.2.2
*/
/*
Container Direction
The the direction of the star container.
.direction-rtl - displays star in right to left direction.
.direction-ltr - displays star in left to right direction.
markup:
Styleguide 1.2.2.1
*/
/*
Container stars space
The spacing between stars.
.space-between - stars take all available space to position. Space is only between the stars.
.space-around - stars take all available space to position. Space is only around the stars.
markup:
Styleguide 1.2.2.4
*/
/*
Label Element
The Label element.
markup:
3.5
Styleguide 1.2.3
*/
/*
Label Sizes
The Label element.
.small - displays star in small size
.medium - displays star in medium size
.large - displays star in large size
markup:
3.5
Styleguide 1.2.3.1
*/
/*
Label Disabled state
The Label n disabled state.
.disabled - displays label in disabled state
markup: