vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
2 lines (1 loc) • 1.76 kB
CSS
.rate-wrap[data-v-9da2f28a]{display:inline-flex;gap:var(--rate-star-gap);line-height:normal;outline:none}.rate-wrap .rate-star[data-v-9da2f28a]{position:relative;display:inline-block;cursor:pointer;transition:transform .2s ease-in-out}.rate-wrap .rate-star[data-v-9da2f28a]:focus-visible{outline:1px dashed var(--rate-star-color);transform:scale(1.1)}.rate-wrap .rate-star[data-v-9da2f28a] svg{font-size:var(--rate-star-size);color:#0000000f;fill:currentColor;transition:color .2s}.rate-wrap .rate-star[data-v-9da2f28a]:hover{transform:scale(1.1)}.rate-wrap .rate-star .icon-character[data-v-9da2f28a]{display:inline-flex;align-items:center;vertical-align:middle;height:1em;font-size:var(--rate-star-size);color:#0000000f;transition:color .2s}.rate-wrap .rate-star .star-first[data-v-9da2f28a]{position:absolute;top:0;width:50%;height:100%;opacity:0;overflow:hidden;transition:all .2s;-webkit-user-select:none;user-select:none}.rate-wrap .rate-star .star-second[data-v-9da2f28a]{display:inline-block;-webkit-user-select:none;user-select:none}.rate-wrap .rate-star .temp-gray-first[data-v-9da2f28a]:hover{opacity:0}.rate-wrap .rate-star .temp-gray-first:hover .icon-character[data-v-9da2f28a],.rate-wrap .rate-star .temp-gray-second:hover .icon-character[data-v-9da2f28a]{color:#0000000f}.rate-wrap .star-half .star-first[data-v-9da2f28a]{opacity:1}.rate-wrap .star-half .star-first[data-v-9da2f28a] svg{color:var(--rate-star-color)}.rate-wrap .star-half .star-first .icon-character[data-v-9da2f28a]{color:var(--rate-star-color)}.rate-wrap .star-full .star-second[data-v-9da2f28a] svg{color:var(--rate-star-color)}.rate-wrap .star-full .star-second .icon-character[data-v-9da2f28a]{color:var(--rate-star-color)}.rate-disabled[data-v-9da2f28a]{pointer-events:none}