Files
PurpleMine2/sass/plugins/redmine_backlogs/taskboard.scss
2015-01-08 09:44:36 +01:00

456 lines
9.0 KiB
SCSS

@import "common";
$issue-width: 85px;
$issue-height: 80px;
$issue-margin: 5px;
$issue-padding: 5px;
$swimlane-width: $issue-width + 2 * ($issue-margin + $issue-padding + 1px);
#content {
overflow: visible;
}
#taskboard {
position: relative;
margin-bottom: $padding-side;
table {
border-collapse: separate;
margin-left: $padding-side;
margin-right: $padding-side;
}
.issue .subject {
white-space: normal;
}
}
#impediments {
padding-top: 30px;
}
#assigned_to_id_options {
display: none;
}
#col_width {
margin-left: 5px;
input {
text-align: right;
width: 40px;
}
}
/**
* swimlane class is used by:
* - #board_header
* - .board
*
* Also use by the Column Width preference to determine the unit width of the
* swimlanes. See RB.Taskboard.initialize()
*/
.swimlane {
padding: 5px;
width: $swimlane-width;
min-width: $swimlane-width;
}
/* status labels */
#board_header {
position: absolute;
margin-bottom: 0;
margin-right: 10px;
z-index: 200;
background-color: $header-bg;
border: 1px solid darken($header-bg, 5%);
td {
height: 20px;
vertical-align: middle;
color: $header-text;
background-color: $header-bg;
border-right: 1px dotted mix($header-bg, $header-text, 70%);
text-align: center;
font-weight: bold;
&:last-child {
border-right: none;
}
}
}
.board {
color: $text-color;
background-color: $body-bg;
border: 1px solid $gray;
border-top: 0 none;
td {
border-right: 1px dotted $table-border-color;
border-bottom: 1px dotted $table-border-color;
vertical-align: top;
&:last-child {
border-right: none;
}
}
tr:last-child td {
border-bottom: none;
}
.add_new {
display: inline-block;
vertical-align: middle;
&:hover {
cursor: pointer;
background-color: #ffffcc;
}
}
}
#board_header,
.board {
td:first-child {
padding: $issue-padding;
width: (($issue-width + $issue-margin + $issue-padding) * 2);
min-width: (($issue-width + $issue-margin + $issue-padding) * 2);
}
}
.story,
.label_sprint_impediments {
display: block;
float: left;
width: $issue-width * 2;
min-height: $issue-height;
margin: $issue-margin;
padding: $issue-padding;
background-color: $tooltip-bg;
border: 0 none;
border-radius: $border-radius-large;
font-size: $font-size-small-px;
position: relative;
}
.story {
color: $gray-darker;
.id {
margin-bottom: 5px;
padding: 0 3px;
overflow: hidden;
line-height: 16px;
background-color: $body-bg;
border-radius: $border-radius-base;
font-size: .9em;
opacity: .8;
a,
.remaininghours {
float: right;
margin-left: 4px;
font-weight: normal;
}
a {
font-size: $font-size-small-px;
color: $gray-darkest;
font-weight: bold;
}
.assignee {
font-size: 9px;
}
}
.subject {
height: $issue-height * .6;
overflow: hidden;
line-height: 1.3;
padding: 2px;
}
&.closed .subject {
text-decoration: line-through;
}
.project {
text-align: left;
}
.id .v {
display: none;
}
.story_points.editable {
position: absolute;
bottom: -$issue-padding;
right: -$issue-padding;
width: 36px;
height: 36px;
line-height: 36px;
text-align: center;
font-weight: bold;
color: $brand-text;
background-color: $brand-warning;
border: 2px solid $body-bg;
border-radius: 50%;
&:empty {
display: none;
}
}
}
/* item styles used by .task and .impediment */
#taskboard {
.issue,
.placeholder {
display: block;
float: left;
position: relative;
width: $issue-width;
height: $issue-height;
margin: $issue-margin;
padding: $issue-padding;
border: 0 none;
cursor: move;
color: $gray-darker;
background-color: $gray-lighter;
border-radius: $border-radius-large;
font-size: 10px;
line-height: 1.3;
}
.placeholder {
background-color: $tooltip-bg;
border: 1px dashed $tooltip-border;
height: 78px;
width: 83px;
}
}
.issue {
.id {
margin-bottom: 5px;
padding: 0 3px;
overflow: hidden;
line-height: 16px;
background-color: $body-bg;
border-radius: $border-radius-base;
text-align: right;
font-size: $font-size-small-px;
font-weight: bold;
opacity: .8;
.v {
display: none;
}
a {
color: $gray-darkest;
}
}
.editable:hover {
background-color: transparent;
}
.subject.editable {
height: $issue-height * .5;
overflow: hidden;
padding: 2px;
}
&.closed .subject.editable {
text-decoration: line-through;
}
.assigned_to_id {
&.editable {
font-size: 9px;
height: 10px;
margin-top: 2px;
overflow: hidden;
padding: 2px;
padding-top: 0;
width: 81px;
white-space: nowrap;
}
.v {
display: none;
}
}
.priority_id {
&.editable {
border-radius: 15px;
border: 2px solid #FFFFFF;
background-color: #0000ee;
bottom: 10px;
color: #FFFFFF;
font-size: 9px;
height: 13px;
padding-left: 5px;
padding-right: 5px;
position: absolute;
right: -5px;
}
.v {
display: none;
}
}
.remaining_hours.editable {
border-radius: 15px;
border: 2px solid #FFFFFF;
background-color: #EE0000;
bottom: -5px;
color: #FFFFFF;
font-size: 9px;
height: 13px;
padding-left: 5px;
padding-right: 5px;
position: absolute;
right: -5px;
}
.blocks,
.remaining_hours.editable:empty {
display: none;
}
.indicator {
border-radius: 12px;
background-color: #FFFFFF;
background-position: center;
background-repeat: no-repeat;
border: 2px solid #000000;
display: none;
height: 16px;
left: 36px;
padding: 2px;
position: absolute;
top: 38px;
width: 16px;
}
&.saving .indicator {
background-image: url('images/indicator.gif');
display: block;
}
&.error .indicator {
background-image: url('images/warning.png');
background-position: 2px 0;
border-color: #CC0000;
display: block;
}
.editors {
display: none;
}
}
/* dialog */
.rb_editor_dialog.ui-dialog {
.ui-dialog-titlebar-close {
display: none;
}
.ui-widget-header {
background: none;
background-color: #FFFFFF;
opacity: 0.5;
}
.ui-dialog-title {
float: right;
margin-right: 0;
}
&.ui-widget-content {
box-shadow: 2px 2px 5px #777777;
background: none;
border: none;
}
.ui-dialog-buttonpane.ui-widget-content {
background: none;
background-color: none;
border: none;
}
}
/* item editor */
.rb_editor {
label {
display: block;
font-size: 11px;
text-transform: capitalize;
width: 100%;
}
.editor {
font-size: 11px;
margin-bottom: 10px;
width: 100%;
}
.subject {
height: 65px;
width: 272px;
}
.description {
height: 80px;
width: 272px;
}
.remaining_hours,
.time_entry_hours,
.time_entry_user_id,
.time_entry_spent_on,
.blocks {
width: 268px;
}
.time_entry_comments {
height: 30px;
width: 268px;
}
}
/* others */
#impediment_template, #task_template {
display: none;
}
#preloader {
left: -500px;
position: absolute;
}
#spinner {
background-image: url('images/indicator.gif');
}
#warning {
background-image: url('images/warning.png');
}
#ui-datepicker-div {
display: none;
}