54 lines
1.0 KiB
CSS
54 lines
1.0 KiB
CSS
|
.v-rating {
|
||
|
|
max-width: 100%;
|
||
|
|
display: inline-flex;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
.v-rating--readonly {
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.v-rating__wrapper {
|
||
|
|
align-items: center;
|
||
|
|
display: inline-flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
.v-rating__wrapper--bottom {
|
||
|
|
flex-direction: column-reverse;
|
||
|
|
}
|
||
|
|
|
||
|
|
.v-rating__item {
|
||
|
|
display: inline-flex;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.v-rating__item label {
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
.v-rating__item .v-btn--variant-plain {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
.v-rating__item .v-btn {
|
||
|
|
transition-property: transform;
|
||
|
|
}
|
||
|
|
.v-rating__item .v-btn .v-icon {
|
||
|
|
transition: inherit;
|
||
|
|
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
||
|
|
}
|
||
|
|
.v-rating--hover .v-rating__item:hover:not(.v-rating__item--focused) .v-btn {
|
||
|
|
transform: scale(1.25);
|
||
|
|
}
|
||
|
|
.v-rating__item--half {
|
||
|
|
overflow: hidden;
|
||
|
|
position: absolute;
|
||
|
|
clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
.v-rating__item--half .v-btn__overlay, .v-rating__item--half:hover .v-btn__overlay {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.v-rating__hidden {
|
||
|
|
height: 0;
|
||
|
|
opacity: 0;
|
||
|
|
position: absolute;
|
||
|
|
width: 0;
|
||
|
|
}
|