Skip to content

Instantly share code, notes, and snippets.

@cimmanon
Created August 31, 2015 00:56
Show Gist options
  • Save cimmanon/2811b888df9a569ec888 to your computer and use it in GitHub Desktop.
Save cimmanon/2811b888df9a569ec888 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="placeholder clear">
<div class="portfolio-holder">
<div class="portfolio-item">
<div class="small">
<img src="/images/item2.jpg">
</div>
</div>
<div class="portfolio-item">
<div class="small">
<img src="/images/item4.jpg">
</div>
</div>
<div class="portfolio-item">
<div class="large">
<img src="/images/item1.jpg">
</div>
</div>
</div>
</div>
// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----
$mobile-width: 320px;
@mixin mobile {
@media (min-width: #{$mobile-width}) {
@content;
}
}
.tiles > li{
float: left;
width: 320px;
margin-bottom: 20px;
@include mobile {
width: 100%;
}
&.placeholder{
font-family: 'robotobold';
text-transform: uppercase;
text-align: center;
background-color: #f6f6f6;
width: 300px;
height: 330px;
font-size: 28px;
padding-top: 140px;
color: #ccc;
@include mobile{
width: 100% !important;
padding-top: 20px !important;
}
}
}
.tiles > li {
float: left;
width: 320px;
margin-bottom: 20px;
}
@media (min-width: 320px) {
.tiles > li {
width: 100%;
}
}
.tiles > li.placeholder {
font-family: 'robotobold';
text-transform: uppercase;
text-align: center;
background-color: #f6f6f6;
width: 300px;
height: 330px;
font-size: 28px;
padding-top: 140px;
color: #ccc;
}
@media (min-width: 320px) {
.tiles > li.placeholder {
width: 100% !important;
padding-top: 20px !important;
}
}
<div class="placeholder clear">
<div class="portfolio-holder">
<div class="portfolio-item">
<div class="small">
<img src="/images/item2.jpg">
</div>
</div>
<div class="portfolio-item">
<div class="small">
<img src="/images/item4.jpg">
</div>
</div>
<div class="portfolio-item">
<div class="large">
<img src="/images/item1.jpg">
</div>
</div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment