/*
* # Semantic - Rating * http://github.com/semantic-org/semantic-ui/ * * * Copyright 2014 Contributor * Released under the MIT license * http://opensource.org/licenses/MIT * */
/*******************************
Theme
*******************************/
@type : ‘module’; @element : ‘rating’;
@import ‘../../theme.config’;
/*******************************
Rating
*******************************/
.ui.rating {
display: @display; font-size: 0em; vertical-align: @verticalAlign;
} .ui.rating:last-child {
margin-right: 0em;
}
.ui.rating:before {
display: block; content: ''; visibility: hidden; clear: both; height: 0;
}
/* Icon */ .ui.rating .icon {
cursor: pointer; margin: 0em; width: @iconHitbox; text-align: center; height: auto; padding: 0em; font-weight: normal; font-style: normal; vertical-align: @verticalAlign;
}
/*******************************
Types
*******************************/
/*——————-
Star
——————–*/
/* Inactive */ .ui.star.rating .icon {
width: @starIconHitbox; color: @starInactiveColor;
}
/* Active Star */ .ui.star.rating .active.icon {
color: @starActiveColor !important; text-shadow: @starActiveShadow;
}
/* Selected Star */ .ui.star.rating .icon.selected, .ui.star.rating .icon.selected.active {
color: @starSelectedColor !important;
}
.ui.star.rating.partial {
position: relative; z-index: 1;
} .ui.star.rating.partial:before {
position: absolute; z-index: -1;
}
/*——————-
Heart
——————–*/
.ui.heart.rating .icon {
width: @heartIconHitbox; color: @heartInactiveColor;
}
/* Active Heart */ .ui.heart.rating .active.icon {
color: @heartActiveColor !important; text-shadow: @heartActiveShadow;
}
/* Selected Heart */ .ui.heart.rating .icon.selected, .ui.heart.rating .icon.selected.active {
color: @heartSelectedColor !important;
}
/*******************************
States
*******************************/
/* Inactive Icon */ .ui.rating .icon {
color: @inactiveColor;
}
/* Active Icon */ .ui.rating .active.icon {
color: @activeColor;
}
/* Selected Icon */ .ui.rating .icon.selected, .ui.rating .icon.selected.active {
color: @hoverColor;
}
/*——————-
Disabled
——————–*/
/* disabled rating */ .ui.disabled.rating .icon {
cursor: default;
}
/*——————-
Interacting (Active)
——————–*/
/* Selected Rating */ .ui.rating.selected .active.icon {
opacity: @interactiveIconOpacity;
} .ui.rating.selected .icon.selected, .ui.rating .icon.selected {
opacity: @interactiveSelectedIconOpacity;
}
/*******************************
Variations
*******************************/
.ui.mini.rating .icon {
font-size: @mini;
} .ui.tiny.rating .icon {
font-size: @tiny;
} .ui.small.rating .icon {
font-size: @small;
} .ui.rating .icon {
font-size: @medium;
} .ui.large.rating .icon {
font-size: @large;
} .ui.huge.rating .icon {
font-size: @huge;
} .ui.massive.rating .icon {
font-size: @massive;
}
/* Realign */ .ui.large.rating, .ui.huge.rating, .ui.massive.rating {
vertical-align: @oversizedVerticalAlign;
}
.loadUIOverrides();