mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-12-13 01:01:29 -05:00
19f469db48
These warnings were annoying me because the noise makes it easy to miss real issues. The `no-mergeable-selectors` rule is one that we do want to have, but right now it asks that you merge selectors in different `@media` blocks. When the next release happens we should put that back. https://github.com/sasstools/sass-lint/issues/307 Similarly, we want `force-element-nesting` but there is a problem with that because there's no easy way to have a nested selector in a list of selectors. https://github.com/sasstools/sass-lint/issues/575 Finally, until they implement per-line overrides, we have to silence `class-name-format` because we don't have control over the ReactModal class names. It's a useful rule to keep class names consistent though. Per-line ignores should be coming soon: https://github.com/sasstools/sass-lint/issues/70
94 lines
1.8 KiB
SCSS
94 lines
1.8 KiB
SCSS
@import "../../colors";
|
|
|
|
.thumbnail {
|
|
.thumbnail-image {
|
|
display: block;
|
|
|
|
img {
|
|
margin-bottom: 2px;
|
|
border: 1px solid $ui-border;
|
|
}
|
|
}
|
|
|
|
$extras: ".thumbnail-creator, .thumbnail-loves, .thumbnail-remixes";
|
|
|
|
.thumbnail-title,
|
|
#{$extras} {
|
|
line-height: normal;
|
|
word-wrap: break-word;
|
|
|
|
a {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
|
|
.thumbnail-title {
|
|
margin-bottom: 1px;
|
|
font-size: .923em;
|
|
font-weight: 800;
|
|
|
|
a {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
#{$extras} {
|
|
color: $type-gray;
|
|
font-size: .8462em;
|
|
|
|
a {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
.thumbnail-loves,
|
|
.thumbnail-remixes {
|
|
&:before {
|
|
display: inline-block;
|
|
margin-right: .1rem;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
background-size: contain;
|
|
width: .93rem;
|
|
height: .93rem;
|
|
vertical-align: text-top;
|
|
content: "";
|
|
}
|
|
}
|
|
|
|
.thumbnail-loves {
|
|
&:before {
|
|
background-image: url("/svgs/love/love_type-gray.svg");
|
|
}
|
|
}
|
|
|
|
.thumbnail-remixes {
|
|
&:before {
|
|
background-image: url("/svgs/remix/remix_type-gray.svg");
|
|
}
|
|
}
|
|
|
|
&.project {
|
|
$project-width: 144px;
|
|
$project-height: 108px;
|
|
width: $project-width;
|
|
|
|
img {
|
|
width: $project-width;
|
|
height: $project-height;
|
|
}
|
|
}
|
|
|
|
&.gallery {
|
|
$gallery-width: 170px;
|
|
$gallery-height: 100px;
|
|
width: $gallery-width;
|
|
|
|
img {
|
|
width: $gallery-width;
|
|
height: $gallery-height;
|
|
}
|
|
}
|
|
}
|