|
0
|
1 // main: ../style.scss
|
|
|
2 /********************************
|
|
|
3 *********************************
|
|
|
4 Kanban
|
|
|
5 *********************************
|
|
|
6 *********************************/
|
|
|
7
|
|
|
8 /* Kanban Widget
|
|
|
9 ========================*/
|
|
|
10 .kanban-widget {
|
|
|
11 overflow-x: auto;
|
|
|
12 .category-list {
|
|
|
13 display: flex;
|
|
|
14 flex-flow: row;
|
|
|
15 flex-wrap: nowrap;
|
|
|
16 align-items: flex-start;
|
|
|
17 }
|
|
|
18 .category-item {
|
|
|
19 padding: 1.5em;
|
|
|
20 background: #fff;
|
|
|
21 margin-right: 1em;
|
|
|
22 width: 100%;
|
|
|
23 flex: 1;
|
|
|
24 height: calc(100vh - $nav-height);
|
|
|
25
|
|
|
26 &:last-of-type {
|
|
|
27 margin-right: 0;
|
|
|
28 }
|
|
|
29
|
|
|
30 .add-new-task {
|
|
|
31 cursor: pointer;
|
|
|
32 }
|
|
|
33 }
|
|
|
34
|
|
|
35 .category-title {
|
|
|
36 margin-top: 0;
|
|
|
37 margin-bottom: 1.5em;
|
|
|
38 }
|
|
|
39
|
|
|
40 .task-item {
|
|
|
41 background: $body-bg;
|
|
|
42 margin-bottom: em(20);
|
|
|
43 padding: 1em;
|
|
|
44 position: relative;
|
|
|
45 cursor: pointer;
|
|
|
46 transition: all $transition-duration $transition-function;
|
|
|
47
|
|
|
48 &:hover {
|
|
|
49 background: darken($body-bg, 5%);
|
|
|
50 }
|
|
|
51
|
|
|
52 .badge {
|
|
|
53 font-size: $font-size-base;
|
|
|
54 }
|
|
|
55 }
|
|
|
56
|
|
|
57 .task-label {
|
|
|
58 @include position(absolute, -2px 10px null null);
|
|
|
59 line-height: 1;
|
|
|
60 }
|
|
|
61
|
|
|
62 .task-title {
|
|
|
63 margin: 0 0 .5em;
|
|
|
64 }
|
|
|
65
|
|
|
66 .task-item:hover .task-users figure {
|
|
|
67 border-color: darken($body-bg, 5%);
|
|
|
68 }
|
|
|
69
|
|
|
70 .task-users {
|
|
|
71 figure {
|
|
|
72 margin-bottom: 0;
|
|
|
73 margin-left: -20px;
|
|
|
74 border: 5px solid $body-bg;
|
|
|
75 border-radius: 100px;
|
|
|
76 transition: all $transition-duration $transition-function;
|
|
|
77
|
|
|
78 &:first-child {
|
|
|
79 margin-left: 0;
|
|
|
80 }
|
|
|
81 }
|
|
|
82 }
|
|
|
83 }
|
