Nicer grid view
This commit is contained in:
parent
6b18b057f8
commit
bd08afdede
2 changed files with 34 additions and 3 deletions
|
|
@ -259,7 +259,7 @@ div.thumb-height
|
|||
.grid-thumbnail
|
||||
{
|
||||
// Pretend that all thumbnails are 120 pixels high to align the captions properly
|
||||
height: 130px;
|
||||
height: 260px;
|
||||
}
|
||||
|
||||
// Avoid painting links to detail packages in the primary color
|
||||
|
|
@ -539,3 +539,34 @@ a.black
|
|||
animation-delay: 4s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
/* Grid view */
|
||||
.pkgcard {
|
||||
.image {
|
||||
height: 260px;
|
||||
// width: 100%;
|
||||
background: #e0e0e0;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// display: table-cell;
|
||||
// vertical-align: middle;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.text {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
.pkgname {
|
||||
font-size: 120%;
|
||||
padding: 10px;
|
||||
}
|
||||
// width: 100%;
|
||||
margin-bottom: 20px;
|
||||
display: table;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e0e0e0;
|
||||
padding: 5px;
|
||||
}
|
||||
|
|
@ -12,9 +12,9 @@
|
|||
.grid-x
|
||||
.small-9.large-10.cell
|
||||
- if @packages.length>0
|
||||
.grid-x.grid-margin-x.small-up-1.medium-up-3.large-up-4
|
||||
.grid-x.grid-margin-x.small-up-1.medium-up-2.large-up-3 data-equalizer=true data-equalize-on="medium"
|
||||
- @packages.all.each do |pkg|
|
||||
.cell
|
||||
.cell.pkgcard data-equalizer-watch=true
|
||||
= render partial: 'packages/grid_thumbnail', locals: { pkg: pkg }
|
||||
|
||||
- else
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue