kanbanworkflowstimelinescrumrubyroadmapproject-planningproject-managementopenprojectangularissue-trackerifcgantt-chartganttbug-trackerboardsbcf
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
1.6 KiB
66 lines
1.6 KiB
11 years ago
|
=grid-item-columns($columns)
|
||
|
|
width: 100% / 12 * $columns
|
||
|
|
|
||
|
|
.grid-items-lines
|
||
|
|
$grid-items-background: $base-body-color
|
||
|
|
$grid-item-background: $base-body-color
|
||
|
|
$grid-item-border: 1px solid transparentize($base-font-color, 0.8)
|
||
|
|
$grid-item-columns: 4
|
||
|
|
$grid-item-big-columns: 8
|
||
|
|
$grid-item-color: $base-font-color
|
||
|
|
$grid-item-height: 14em
|
||
|
|
+clearfix
|
||
|
|
position: relative
|
||
|
|
|
||
|
|
.grid-item
|
||
|
|
+transition(all 0.2s ease-in-out)
|
||
|
|
height: $grid-item-height
|
||
|
|
background: $grid-item-background
|
||
|
|
width: 100%
|
||
|
|
overflow: hidden
|
||
|
|
float: left
|
||
|
|
padding: 2em
|
||
|
|
border-right: $grid-item-border
|
||
|
|
border-bottom: $grid-item-border
|
||
|
|
cursor: pointer
|
||
|
|
//+media($large-screen)
|
||
|
|
+grid-item-columns($grid-item-columns)
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
background: transparentize($grid-item-color, 0.95)
|
||
|
|
|
||
|
|
.grid-item img
|
||
|
|
display: block
|
||
|
|
height: 2.5em
|
||
|
|
margin-bottom: 1.2em
|
||
|
|
opacity: .2
|
||
|
|
.grid-item h1
|
||
|
|
color: $grid-item-color
|
||
|
|
font-size: 1.3em
|
||
|
|
margin-bottom: .4em
|
||
|
|
.grid-item p
|
||
|
|
color: transparentize($grid-item-color, 0.4)
|
||
|
|
//+media($medium-screen)
|
||
|
|
max-width: 70%
|
||
|
|
.grid-item-big
|
||
|
|
//+media($large-screen)
|
||
|
|
+grid-item-columns($grid-item-big-columns)
|
||
|
|
|
||
|
|
p
|
||
|
|
//+media($medium-screen)
|
||
|
|
max-width: 60%
|
||
|
|
|
||
|
|
// this, below, might not be the most beautiful solution but it removes the outer borders by using the background color.
|
||
|
|
.bottom-cover
|
||
|
|
position: absolute
|
||
|
|
bottom: 0px
|
||
|
|
width: 100%
|
||
|
|
height: 3px
|
||
|
|
background: $grid-items-background
|
||
|
|
.right-cover
|
||
|
|
position: absolute
|
||
|
|
right: 0px
|
||
|
|
height: 100%
|
||
|
|
width: 4px
|
||
|
|
background: $grid-items-background
|