vue-amazing-ui/lib/rate/Rate.css

An Amazing Vue3 UI Components Library, Using TypeScript.

.m-rate[data-v-57cf03a8]{display:inline-flex;gap:var(--rate-star-gap);line-height:normal;outline:none}.m-rate .rate-star[data-v-57cf03a8]{position:relative;display:inline-block;cursor:pointer;transition:transform .2s ease-in-out}.m-rate .rate-star[data-v-57cf03a8]:focus-visible{outline:1px dashed var(--rate-star-color);transform:scale(1.1)}.m-rate .rate-star[data-v-57cf03a8] svg{font-size:var(--rate-star-size);color:#0000000f;fill:currentColor;transition:color .2s}.m-rate .rate-star[data-v-57cf03a8]:hover{transform:scale(1.1)}.m-rate .rate-star .icon-character[data-v-57cf03a8]{display:inline-flex;align-items:center;vertical-align:middle;height:1em;font-size:var(--rate-star-size);color:#0000000f;transition:color .2s}.m-rate .rate-star .star-first[data-v-57cf03a8]{position:absolute;top:0;width:50%;height:100%;opacity:0;overflow:hidden;transition:all .2s;-webkit-user-select:none;user-select:none}.m-rate .rate-star .star-second[data-v-57cf03a8]{display:inline-block;-webkit-user-select:none;user-select:none}.m-rate .rate-star .temp-gray-first[data-v-57cf03a8]:hover{opacity:0}.m-rate .rate-star .temp-gray-first:hover .icon-character[data-v-57cf03a8],.m-rate .rate-star .temp-gray-second:hover .icon-character[data-v-57cf03a8]{color:#0000000f}.m-rate .star-half .star-first[data-v-57cf03a8]{opacity:1}.m-rate .star-half .star-first[data-v-57cf03a8] svg{color:var(--rate-star-color)}.m-rate .star-half .star-first .icon-character[data-v-57cf03a8]{color:var(--rate-star-color)}.m-rate .star-full .star-second[data-v-57cf03a8] svg{color:var(--rate-star-color)}.m-rate .star-full .star-second .icon-character[data-v-57cf03a8]{color:var(--rate-star-color)}.rate-disabled[data-v-57cf03a8]{pointer-events:none}