Improve package grid

This commit is contained in:
rubenwardy
2018-12-22 20:39:34 +00:00
parent c551201f79
commit 8eedbf64a4
4 changed files with 23 additions and 27 deletions

View File

@@ -1,24 +1,17 @@
.packagegrid {
display: flex;
flex-wrap: wrap;
flex-direction: row;
flex-grow: 1;
flex-shrink: 1;
.packagetile {
list-style: none;
padding: 0;
margin: 0 -7px;
margin: 0 7px 7px 0;
min-width: 250px;
}
.packagegrid li {
flex: 1;
display: block;
min-width: 300px;
min-height: 200px;
max-width: 332px;
li.d-flex {
list-style: none;
padding: 0;
margin: 7px;
margin: 0;
}
.packagegrid a {
.packagetile a {
display: block;
padding-bottom: 66.66%;
border-radius: 7px;
@@ -29,10 +22,6 @@
background-position: center;
}
.packagegrid a:hover {
// box-shadow: 0px 0px 16px 6px rgba(0,0,0,0.4);
}
.packagegridscrub {
position: absolute;
top: 50%;
@@ -63,15 +52,15 @@
font-weight: normal;
}
.packagegrid a:hover .packagegridinfo {
.packagetile a:hover .packagegridinfo {
top: 0;
}
.packagegrid a:hover p {
.packagetile a:hover p {
display: block;
}
.packagegrid a:hover .packagegridscrub {
.packagetile a:hover .packagegridscrub {
top: 0;
background: rgba(0,0,0,0.8);
}