summaryrefslogtreecommitdiffstats
path: root/client/components/lists/list.styl
blob: b7bc33e83288ea3901a0578e1899829404d28531 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
@import 'nib'

.list
  box-sizing: border-box
  display: flex
  flex-direction: column
  flex: 0 0 270px
  position: relative
  // Even if this background color is the same as the body we can't leave it
  // transparent, because that won't work during a list drag.
  background: darken(white, 13%)
  height: 100%
  border-left: 1px solid darken(white, 20%)
  padding: 0
  float: left

  &:first-child
    margin-left: 5px
    border-left: none

  .card-details + &
    border-left: none

  &.ui-sortable-helper
    box-shadow: -2px 2px 8px rgba(0, 0, 0, .3),
                0 0 1px rgba(0, 0, 0, .5)
    transform: rotate(4deg)
    cursor: grabbing

    .list-header.ui-sortable-handle
      cursor: grabbing

  &.placeholder
    background-color: rgba(0, 0, 0, .2)
    border-color: transparent
    box-shadow: none
    height: 100px

  &.list-composer, & .list-composer
    .open-list-composer
      color: #8c8c8c

    .list-name-input
      background: white
      margin: -3px 0 8px

.list-header
  flex: 0 0 auto
  margin: 20px 12px 4px
  position: relative
  min-height: 20px

  &.ui-sortable-handle
    cursor: grab

  .list-header-name
    display: inline
    font-size: 16px
    line-height: 17px
    margin: 0
    font-weight: bold
    min-height: 9px
    min-width: 30px
    overflow: hidden
    text-overflow: ellipsis
    word-wrap: break-word

  .list-header-watch-icon
    padding-left: 10px
    color: #a6a6a6

  .list-header-menu
    position: absolute
    padding: 7px
    margin-top: 1px
    top: -@padding
    right: -@padding

  .list-header-plus-icon
    color: #a6a6a6

  .highlight
    color: #ce1414

.list-body
  flex: 1
  display: flex
  overflow-y: auto
  padding: 5px 11px

  .minicards
    flex: 1

    form
      margin-bottom: 9px

  .ps-scrollbar-y-rail
    transform: translateX(2px)

  .open-minicard-composer
    border-radius: 2px
    color: #8c8c8c
    display: block
    padding: 7px 10px
    position: relative
    text-decoration: none
    animation: fadeIn 0.3s

    i.fa
      margin-right: 7px

    &:hover
      background: #fafafa
      color: #222
      box-shadow: 0 1px 2px rgba(0,0,0,.2)

#js-wip-limit-edit
  padding-top: 2%

  p
    margin-bottom: 0

  input
    display: inline-block

  .wip-limit-value
    width: 20%
    margin-right: 5%

  .wip-limit-error
    display: none

  .soft-wip-limit
    margin-right: 8px

  div
    float: left