Polishing artist disc; About artist tiles

This commit is contained in:
James Barnsley
2017-02-08 19:31:36 +13:00
parent d08a054748
commit 1239895e88
5 changed files with 69 additions and 44 deletions

View File

@ -1,19 +1,4 @@
@mixin grid_item( $cols, $gap: 2% ){
width: ( 0% + ( 100 / $cols ) - ( $gap * 2 ) + ( ( $gap * 2 ) / $cols ) );
box-sizing: border-box;
margin: 0 $gap 3%;
&:nth-child(#{$cols}n-#{$cols}) {
margin-right: 0;
@include clearfix;
}
&:nth-child(#{$cols}n-#{$cols - 1}) {
margin-left: 0;
}
}
.grid {
.grid-item-wrapper {

View File

@ -66,4 +66,34 @@
opacity: 0.5;
}
}
}
.tile {
@include grid_item( 2 );
color: $dark_grey;
text-align: center;
position: relative;
z-index: 1;
float: left;
padding-top: 16%;
font-size: 16px;
&:before {
content: '';
display: block;
position: absolute;
top: 0;
width: 100%;
padding-bottom: 100%;
background: $light_grey;
z-index: -1;
}
.fa {
display: block;
font-size: 40px;
opacity: 0.2;
z-index: 0;
padding-bottom: 10px;
}
}