loop for column colors

pull/1/head
David Benqué 5 years ago
parent 21c3abde6f
commit 7d0d701942

@ -21,14 +21,16 @@
@board-bg: #eaeaea; @board-bg: #eaeaea;
@palette0: #C9C9C9; // Default bg color for header @palette0: #C9C9C9; // Default bg color for header
@palette1: #FFD4D4;
@palette2: #FFDECA; @kanban-colors:
@palette3: #FFE69C; #FFD4D4,
@palette4: #DBFFB7; #FFDECA,
@palette5: #AFFDC2; #FFE69C,
@palette6: #C9FFFE; #DBFFB7,
@palette7: #C8D6FF; #AFFDC2,
@palette8: #E4CAFF; #C9FFFE,
#C8D6FF,
#E4CAFF;
.kanban-board-header { .kanban-board-header {
background-color: @palette0; background-color: @palette0;
@ -46,54 +48,18 @@
.cp-kanban-palette-nocolor { .cp-kanban-palette-nocolor {
background-color: @palette0; background-color: @palette0;
} }
.cp-kanban-palette-color1 {
background-color: @palette1; .kanban-colors(@kanban-colors; @index) when (@index > 0){
&.kanban-board-inner { .kanban-colors(@kanban-colors; (@index - 1));
background-color: lighten(@palette1, 5%); @color: extract(@kanban-colors, @index);
} .cp-kanban-palette-color@{index}{
} background-color: @color;
.cp-kanban-palette-color2 {
background-color: @palette2;
&.kanban-board-inner {
background-color: lighten(@palette2, 5%);
}
}
.cp-kanban-palette-color3 {
background-color: @palette3;
&.kanban-board-inner {
background-color: lighten(@palette3, 10%);
}
}
.cp-kanban-palette-color4 {
background-color: @palette4;
&.kanban-board-inner {
background-color: lighten(@palette4, 10%);
}
}
.cp-kanban-palette-color5 {
background-color: @palette5;
&.kanban-board-inner {
background-color: lighten(@palette5, 10%);
}
}
.cp-kanban-palette-color6 {
background-color: @palette6;
&.kanban-board-inner {
background-color: lighten(@palette6, 5%);
}
}
.cp-kanban-palette-color7 {
background-color: @palette7;
&.kanban-board-inner { &.kanban-board-inner {
background-color: lighten(@palette7, 5%); background-color: fade(@color, 50%);
} }
} }
.cp-kanban-palette-color8 {
background-color: @palette8;
&.kanban-board-inner {
background-color: lighten(@palette8, 5%);
}
} }
.kanban-colors(@kanban-colors; length(@kanban-colors));
.cp-kanban-edit-modal { .cp-kanban-edit-modal {
display: flex; display: flex;

Loading…
Cancel
Save