scratch-www/src/views/preview/stats.scss

103 lines
1.8 KiB
SCSS

@import "../../frameless";
.stats {
line-height: 2rem;
justify-content: flex-start;
@media #{$medium-and-smaller} {
margin: 0;
width: 100%;
justify-content: center;
flex-direction: row;
}
& > div {
@media #{$medium-and-smaller} {
padding: 0 1rem;
}
}
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.project-loves,
.project-favorites,
.project-remixes,
.project-views {
display: flex;
padding-right: 2rem;
font-size: 1rem;
font-weight: bold;
align-items: center;
&:before {
display: inline-block;
margin-right: .5rem;
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
width: 1.75rem;
height: 1.75rem;
content: "";
}
}
.project-loves {
cursor: pointer;
&:before {
opacity: .5;
background-image: url("/svgs/project/love-gray.svg");
}
}
.project-loves.loved {
&:before {
opacity: 1;
background-image: url("/svgs/project/love-red.svg");
}
}
.project-favorites {
cursor: pointer;
&:before {
opacity: .5;
background-image: url("/svgs/project/fav-gray.svg");
}
}
.project-favorites.favorited {
&:before {
opacity: 1;
background-image: url("/svgs/project/fav-yellow.svg");
}
}
.project-remixes {
&:before {
opacity: .5;
background-image: url("/svgs/project/remix-gray.svg");
}
}
.project-views {
&:before {
opacity: .5;
background-image: url("/svgs/project/views-gray.svg");
}
}