attract/src/styles/_tasks.sass

.item-list.task
	overflow-x: hidden

.attract-box
	margin: 10px
	padding: 10px
	+container-box

	&.with-status
		border-top: thick solid $color-background-dark
		@include status-color-property(border-top-color, '', 'dark')
		@include status-color-property(color, ' select', 'dark')
		@include status-color-property(border-bottom-color, ' select', 'dark')

	.item-name
		font-size: 1.6em
		margin: 0

		+text-overflow-ellipsis

	span.item-name
		padding-left: 5px
		margin-top: 0
		color: $color-text-dark-secondary

	.item-description
		padding: 10px 5px
		color: $color-text-dark-primary

	.dropdown button
		height: 38px
		margin-left: 10px

	.dropdown-menu
		top: 36px
		left: initial
		right: 0
		padding-top: 0
		padding-bottom: 0
		border: thin solid $color-background
		box-shadow: 1px 1px 2px rgba(black, .1), 0 5px 25px rgba(black, .1)

		li
			display: flex
			height: 100%
			width: 100%
			padding: 0
			margin: 0

			&.divider
				height: 2px

			&.item-delete a:hover
				color: $color-danger

			a
				padding: 10px 15px 10px 12px
				flex: 1
				height: 100%
				color: $color-text-dark-primary
				i
					position: relative
					top: -1px
					left: -4px
					font-size: .9em

	.table.item-properties
		.table-body
			text-shadow: 1px 1px 0 white

			.table-row
				.table-cell
					padding: 3px 10px
					vertical-align: top
					line-height: 1.6em
					border: none
					color: $color-text-dark-primary
					@include status-color-property(color, '', 'dark')

					&:first-child
						width: 120px
						max-width: 200px
						text-align: right
						font-weight: bold
						padding-right: 10px
						border-right: thin solid $color-background-dark
						+text-overflow-ellipsis

				&.properties-assignees
					.table-cell span
						display: block
				&.properties-status
					cursor: help

.attract-box+.attract-box
	margin-top: 0

#item-add
	margin-left: auto
	font-size: .85em
	color: $color-primary

.status-indicator
	position: absolute
	height: 100%
	top: 0
	bottom: 0
	width: 5px

.task-list-item
	position: relative
	color: $color-text-dark

	&:hover
		color: $color-text-dark-primary
		background-color: $color-background-light
		text-decoration: none

	&.active
		text-decoration: none

	.status, .due_date
		display: inline-block
		margin-right: 10px
		text-transform: uppercase
		font-size: .8em
		text-decoration: none

	.due_date
		margin-left: auto
		color: $color-text-dark-primary
		+text-overflow-ellipsis

		&.late
			color: $color-danger

	.name
		padding: 5px 5px 5px 10px
		+text-overflow-ellipsis

	.shotname
		color: $color-text-dark-secondary
		margin-left: 15px
		padding-right: 10px
		position: relative
		+text-overflow-ellipsis
		&:after
			position: absolute
			width: 2px
			height: 2px
			right: 0
			border-radius: 50%
			bottom: 9px
			display: block
			content: ''
			border: thin solid $color-text-dark-hint

	.status-indicator+.name
		margin-left: 5px

	@include status-color-property(background-color, ' .status-indicator', '')

option.invalid_task
	color: $color-danger
	background-color: hsl(hue($color-danger), 80%, 90%)
task- and shot- specific lists are now called item- 2016-11-09 17:04:13 +01:00			`.item-list.task`
			`overflow-x: hidden`

Renamed attract-form to attract-box, and added with-status class. The with-status class enables the status-coloured thick border at the top. The rename from 'form' to 'box' was made to allow non-form contents too. 2016-10-04 15:15:12 +02:00			`.attract-box`
Minor style tweaks to Tasks 2016-09-21 18:26:34 +02:00			`margin: 10px`
Tweaks to read-only details on shots and tasks 2016-10-21 15:47:38 +02:00			`padding: 10px`
Minor style tweaks to Tasks 2016-09-21 18:26:34 +02:00			`+container-box`

Renamed attract-form to attract-box, and added with-status class. The with-status class enables the status-coloured thick border at the top. The rename from 'form' to 'box' was made to allow non-form contents too. 2016-10-04 15:15:12 +02:00			`&.with-status`
			`border-top: thick solid $color-background-dark`
			`@include status-color-property(border-top-color, '', 'dark')`
Color status select 2017-05-10 23:34:46 +02:00			`@include status-color-property(color, ' select', 'dark')`
			`@include status-color-property(border-bottom-color, ' select', 'dark')`
Shot status indicator and other minor tweaks 2016-09-22 21:27:15 +02:00
			`.item-name`
Minor style tweaks to Tasks 2016-09-21 18:26:34 +02:00			`font-size: 1.6em`
Display a bottom border on inputs, not completely transparent 2016-11-03 12:30:39 +01:00			`margin: 0`

			`+text-overflow-ellipsis`

			`span.item-name`
Style task read-only details 2016-10-21 14:47:55 +02:00			`padding-left: 5px`
Display a bottom border on inputs, not completely transparent 2016-11-03 12:30:39 +01:00			`margin-top: 0`
Style save buttons on shots/tasks 2016-11-03 13:07:46 +01:00			`color: $color-text-dark-secondary`
Style task read-only details 2016-10-21 14:47:55 +02:00
			`.item-description`
			`padding: 10px 5px`
			`color: $color-text-dark-primary`
Minor style tweaks to Tasks 2016-09-21 18:26:34 +02:00
Use dropdown for copy to clipboard/delete tasks 2016-09-29 12:57:01 +02:00			`.dropdown button`
			`height: 38px`
			`margin-left: 10px`

			`.dropdown-menu`
Open dropdown menu on mouse over 2016-10-24 16:20:35 +02:00			`top: 36px`
Use dropdown for copy to clipboard/delete tasks 2016-09-29 12:57:01 +02:00			`left: initial`
			`right: 0`
			`padding-top: 0`
			`padding-bottom: 0`
			`border: thin solid $color-background`
			`box-shadow: 1px 1px 2px rgba(black, .1), 0 5px 25px rgba(black, .1)`

			`li`
			`display: flex`
			`height: 100%`
			`width: 100%`
			`padding: 0`
			`margin: 0`

			`&.divider`
			`height: 2px`

			`&.item-delete a:hover`
			`color: $color-danger`

			`a`
			`padding: 10px 15px 10px 12px`
			`flex: 1`
			`height: 100%`
			`color: $color-text-dark-primary`
			`i`
			`position: relative`
			`top: -1px`
			`left: -4px`
			`font-size: .9em`

Style task read-only details 2016-10-21 14:47:55 +02:00			`.table.item-properties`
			`.table-body`
			`text-shadow: 1px 1px 0 white`

			`.table-row`
			`.table-cell`
Minor style tweaks to tasks/shots list 2016-11-03 16:07:55 +01:00			`padding: 3px 10px`
Style task read-only details 2016-10-21 14:47:55 +02:00			`vertical-align: top`
Minor style tweaks to tasks/shots list 2016-11-03 16:07:55 +01:00			`line-height: 1.6em`
Style task read-only details 2016-10-21 14:47:55 +02:00			`border: none`
Tweaks to read-only details on shots and tasks 2016-10-21 15:47:38 +02:00			`color: $color-text-dark-primary`
Style task read-only details 2016-10-21 14:47:55 +02:00			`@include status-color-property(color, '', 'dark')`

			`&:first-child`
Tweaks to read-only details on shots and tasks 2016-10-21 15:47:38 +02:00			`width: 120px`
Click on last update to get more info 2016-10-21 17:01:32 +02:00			`max-width: 200px`
Style task read-only details 2016-10-21 14:47:55 +02:00			`text-align: right`
			`font-weight: bold`
			`padding-right: 10px`
			`border-right: thin solid $color-background-dark`
Click on last update to get more info 2016-10-21 17:01:32 +02:00			`+text-overflow-ellipsis`
Style task read-only details 2016-10-21 14:47:55 +02:00
			`&.properties-assignees`
			`.table-cell span`
			`display: block`
Tweaks to read-only details on shots and tasks 2016-10-21 15:47:38 +02:00			`&.properties-status`
			`cursor: help`
Style task read-only details 2016-10-21 14:47:55 +02:00
Make debug info collapsable 2016-10-21 16:00:58 +02:00			`.attract-box+.attract-box`
			`margin-top: 0`
Use dropdown for copy to clipboard/delete tasks 2016-09-29 12:57:01 +02:00
task- and shot- specific lists are now called item- 2016-11-09 17:04:13 +01:00			`#item-add`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00			`margin-left: auto`
			`font-size: .85em`
Replace Status underscore and minor style tweaks 2016-09-21 15:47:24 +02:00			`color: $color-primary`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
			`.status-indicator`
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`position: absolute`
			`height: 100%`
			`top: 0`
			`bottom: 0`
			`width: 5px`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
			`.task-list-item`
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`position: relative`
Minor style tweaks to shots list 2016-10-13 19:25:22 +02:00			`color: $color-text-dark`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
			`&:hover`
minor style tweak to tasks list 2016-10-14 15:49:40 +02:00			`color: $color-text-dark-primary`
Minor style tweaks to shots list 2016-10-13 19:25:22 +02:00			`background-color: $color-background-light`
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`text-decoration: none`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
			`&.active`
			`text-decoration: none`

Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`.status, .due_date`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00			`display: inline-block`
			`margin-right: 10px`
			`text-transform: uppercase`
			`font-size: .8em`
			`text-decoration: none`

Show due_date on tasks list rather than type, as it's more used 2016-11-07 17:17:23 +01:00			`.due_date`
			`margin-left: auto`
			`color: $color-text-dark-primary`
			`+text-overflow-ellipsis`

			`&.late`
			`color: $color-danger`

Style activities on dashboard 2016-10-20 12:54:03 +02:00			`.name`
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`padding: 5px 5px 5px 10px`
Small jQuery plugin for resizing panels Still doesn't save the size, since we want to save this in the user. Which is not implemented yet. 2016-09-28 16:58:14 +02:00			`+text-overflow-ellipsis`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
Style activities on dashboard 2016-10-20 12:54:03 +02:00			`.shotname`
			`color: $color-text-dark-secondary`
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`margin-left: 15px`
Style activities on dashboard 2016-10-20 12:54:03 +02:00			`padding-right: 10px`
			`position: relative`
Small jQuery plugin for resizing panels Still doesn't save the size, since we want to save this in the user. Which is not implemented yet. 2016-09-28 16:58:14 +02:00			`+text-overflow-ellipsis`
Style activities on dashboard 2016-10-20 12:54:03 +02:00			`&:after`
			`position: absolute`
			`width: 2px`
			`height: 2px`
			`right: 0`
			`border-radius: 50%`
			`bottom: 9px`
			`display: block`
			`content: ''`
			`border: thin solid $color-text-dark-hint`
Tasks Index for a Project Work in progress 2016-09-21 14:02:05 +02:00
Unify tasks list look with other tables 2016-11-09 23:38:12 +01:00			`.status-indicator+.name`
			`margin-left: 5px`

Minor style tweaks to shots list 2016-10-13 19:25:22 +02:00			`@include status-color-property(background-color, ' .status-indicator', '')`
Fix layout 2016-09-21 14:15:25 +02:00
			`option.invalid_task`
			`color: $color-danger`
			`background-color: hsl(hue($color-danger), 80%, 90%)`