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.
127 lines
2.2 KiB
127 lines
2.2 KiB
$grid--gap-width: 20px
|
|
$grid--header-width: 20px
|
|
|
|
@mixin grid--commons
|
|
display: grid
|
|
grid-column-gap: $grid--gap-width
|
|
grid-row-gap: $grid--gap-width
|
|
|
|
.grid--container
|
|
@include grid--commons
|
|
|
|
.grid--area
|
|
overflow: hidden
|
|
|
|
&.-drop-target
|
|
background-color: $gray-light
|
|
|
|
&.-resize-target
|
|
z-index: 1000
|
|
|
|
&.-widgeted
|
|
z-index: 10
|
|
@include widget-box--style
|
|
margin: 0
|
|
padding: 20px
|
|
|
|
.widget-box
|
|
height: 100%
|
|
|
|
&.-resizing
|
|
border: 1px solid $primary-color
|
|
z-index: 100
|
|
|
|
&.-addable
|
|
display: flex
|
|
flex-direction: column
|
|
justify-content: center
|
|
align-items: center
|
|
|
|
.resizer
|
|
margin-top: 0
|
|
margin-left: auto
|
|
margin-right: -20px
|
|
position: relative
|
|
|
|
.cdk-drag-handle
|
|
cursor: grab
|
|
|
|
.grid--area-content
|
|
height: 100%
|
|
|
|
ng-component
|
|
display: flex
|
|
flex-direction: column
|
|
height: 100%
|
|
|
|
.grid--widget-content
|
|
height: 100%
|
|
overflow-x: auto
|
|
overflow-y: auto
|
|
|
|
.grid--widget-limited-text
|
|
max-height: 5rem
|
|
position: relative
|
|
overflow: hidden
|
|
|
|
&:before
|
|
content: ''
|
|
width: 100%
|
|
height: 100%
|
|
position: absolute
|
|
left: 0
|
|
top: 0
|
|
background: linear-gradient(to bottom, rgba($body-background, 0) 60%, rgba($body-background, 1))
|
|
|
|
.grid--widget-add
|
|
padding: 15px
|
|
background-color: $gray
|
|
border-radius: 50%
|
|
|
|
&:before
|
|
@include icon-font-common
|
|
@include icon-mixin-add
|
|
|
|
.grid--widget-remove
|
|
float: right
|
|
margin-top: -10px
|
|
margin-right: -10px
|
|
cursor: pointer
|
|
|
|
&:before
|
|
@include icon-font-common
|
|
@include icon-mixin-remove
|
|
font-size: 0.75em
|
|
|
|
.grid--column-headers
|
|
@include grid--commons
|
|
grid-template-rows: $grid--header-width
|
|
|
|
.grid--row-headers
|
|
@include grid--commons
|
|
grid-template-columns: $grid--header-width
|
|
float: left
|
|
margin-left: -$grid--header-width
|
|
|
|
.grid--header
|
|
background-color: $gray-light
|
|
transition: background-color 4s ease
|
|
|
|
&:hover
|
|
background-color: $gray
|
|
transition: background-color 1s ease
|
|
|
|
.grid--addable-widget
|
|
min-width: 400px
|
|
padding: 20px 5px
|
|
border-bottom: 1px solid $gray
|
|
cursor: pointer
|
|
background: none
|
|
transition: background 4s ease
|
|
|
|
&:hover
|
|
background: $gray-light
|
|
transition: background 1s ease
|
|
|
|
&:last-of-type
|
|
border-bottom: none
|
|
|