71 lines
1.4 KiB
CSS
71 lines
1.4 KiB
CSS
|
/** { box-sizing: border-box; }*/
|
||
|
|
||
|
body {
|
||
|
font-family: sans-serif;
|
||
|
color: #333;
|
||
|
}
|
||
|
|
||
|
.gallery {
|
||
|
border: 1px solid;
|
||
|
width: 400px;
|
||
|
margin-bottom: 40px;
|
||
|
}
|
||
|
|
||
|
.gallery .cell {
|
||
|
width: 100%;
|
||
|
height: 100px;
|
||
|
background: #F09;
|
||
|
font-size: 40px;
|
||
|
color: white;
|
||
|
}
|
||
|
|
||
|
.variable-width .cell { width: 25%; } /* 100px */
|
||
|
.variable-width .cell.width2 { width: 40%; background: #F90; } /* 160px */
|
||
|
.variable-width .cell.width3 { width: 60%; background: #09F; } /* 240px */
|
||
|
|
||
|
#position-cells.percent-margin .cell { margin: 0 2%; }
|
||
|
#position-cells.pixel-margin .cell { margin: 0 10px; }
|
||
|
|
||
|
/*#drag-wrap-around { position: fixed; top: 0;}*/
|
||
|
|
||
|
.drag .cell { margin-right: 5%; }
|
||
|
|
||
|
#watch.has-after:after {
|
||
|
content: 'flickity';
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
#lazyload img {
|
||
|
display: block;
|
||
|
max-height: 100px;
|
||
|
}
|
||
|
|
||
|
/* ---- group-cells ---- */
|
||
|
|
||
|
#group-cells .cell {
|
||
|
width: 100px;
|
||
|
/* border: 1px solid;*/
|
||
|
}
|
||
|
|
||
|
#group-cells .cell--width2 { width: 200px; }
|
||
|
#group-cells .cell--width3 { width: 300px; }
|
||
|
#group-cells .cell--width4 { width: 400px; }
|
||
|
|
||
|
#group-cells.is-expanded { width: 600px; }
|
||
|
|
||
|
#group-cells .cell:nth-child(2n) { background: #09F; }
|
||
|
|
||
|
/* ---- adaptive-height ---- */
|
||
|
|
||
|
#adaptive-height .cell { width: 33.33%; }
|
||
|
|
||
|
#adaptive-height .cell--height2 { height: 200px; }
|
||
|
#adaptive-height .cell--height3 { height: 300px; }
|
||
|
#adaptive-height .cell--height4 { height: 400px; }
|
||
|
|
||
|
#adaptive-height .cell:nth-child(2n) { background: #09F; }
|
||
|
|
||
|
/* ---- select-cell ---- */
|
||
|
|
||
|
#select-cell .cell { width: 33.33%; }
|