Build issue; Grid items

This commit is contained in:
James Barnsley
2016-10-25 14:09:53 +13:00
parent 3f055df3f2
commit 5372cd0334
17 changed files with 195 additions and 125 deletions

37
src/scss/components/_grid.scss Executable file
View File

@ -0,0 +1,37 @@
.grid {
padding: 40px 20px;
.grid-item {
width: 16%;
margin: 0 2% 3%;
display: inline-block;
vertical-align: top;
border-bottom: 0;
.thumbnail {
max-width: 100%;
}
.name {
@include one_line_text;
padding-top: 8px;
}
.secondary {
@include one_line_text;
padding-top: 2px;
color: $secondary_grey;
}
&:nth-child(5)::after {
@include clear;
}
&:hover{
cursor: pointer;
opacity: 0.75;
}
}
}

View File

@ -10,7 +10,7 @@
display: block;
position: relative;
padding: 8px 10px 8px 30px;
padding: 9px 10px 9px 40px;
border-top: 1px solid #EEEEEE;
border-bottom: 1px solid #EEEEEE;
margin-bottom: -1px;
@ -22,9 +22,7 @@
}
&::after {
content: '';
clear: both;
display: block;
@include clear;
}
&.selected {
@ -57,12 +55,13 @@
.select-state {
position: absolute;
top: 10px;
left: 10px;
top: 12px;
left: 15px;
font-size: 10px;
}
&.playing {
font-weight: 500;
font-weight: 600;
}
}

View File

@ -5,10 +5,11 @@ aside{
top: 0;
left: 0;
bottom: 0;
background: #333333;
background: #111111;
width: 200px;
overflow: hidden;
box-shadow: inset -20px 0px 30px -20px rgba(0, 0, 0, 0.5);
.thumbnail {
position: absolute;
top: 0;
@ -36,11 +37,11 @@ aside{
&.active {
border-color: $turquoise;
background: rgba( 0,0,0,0.1 );
background: rgba( 0, 0, 0, 0.5 );
}
&:hover {
background: rgba( 255,255,255,0.1 );
background: rgba( 255, 255, 255, 0.1 );
}
}
@ -73,13 +74,13 @@ aside{
color: #FFFFFF;
.title {
@include one_line_text
@include one_line_text;
}
.artist-list {
opacity: 0.5;
display: block;
@include one_line_text
@include one_line_text;
.artist a {
color: inherit;