75 lines
1.3 KiB
CSS
75 lines
1.3 KiB
CSS
.rating {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
justify-content: center;
|
|
padding-left:1em;
|
|
}
|
|
|
|
.rating>input {
|
|
display: none;
|
|
color: rgb(241, 106, 106);
|
|
}
|
|
|
|
.rating>label {
|
|
position: relative;
|
|
width: 1em;
|
|
font-size: 3vw;
|
|
color: #ffd500;
|
|
cursor: pointer
|
|
}
|
|
|
|
.rating>label::before {
|
|
content: "\2605";
|
|
position: absolute;
|
|
opacity: 0
|
|
}
|
|
|
|
.rating>label:hover:before,
|
|
.rating>label:hover~label:before {
|
|
opacity: 1 !important
|
|
}
|
|
|
|
.rating>input:checked~label:before {
|
|
opacity: 1
|
|
}
|
|
|
|
.rating:hover>input:checked~label:before {
|
|
opacity: 0.4
|
|
}
|
|
.thank{
|
|
transition: ease-in;
|
|
transition-delay: 10s;
|
|
}
|
|
|
|
.primary{
|
|
background-color: rgb(238, 117, 238);
|
|
border-radius: 5px;
|
|
color: white;
|
|
width: 30%;
|
|
align-self: center;
|
|
margin-left: 33%;
|
|
margin-right: 33%;
|
|
}
|
|
.primary:hover{
|
|
box-shadow: 10px 10px 10px rgb(226, 226, 226);
|
|
|
|
}
|
|
|
|
.dispnum{
|
|
color: gray;
|
|
font-family: cursive;
|
|
}
|
|
@media screen and (max-width:900px){
|
|
.star{
|
|
height: 40%;
|
|
width: 40%;
|
|
}
|
|
.rating>label {
|
|
position: relative;
|
|
width: 1em;
|
|
font-size: 7vw;
|
|
color: #ffd500;
|
|
cursor: pointer;
|
|
justify-content: center;
|
|
}
|
|
} |