summaryrefslogtreecommitdiffstats
path: root/client/components/boards/boardBody.styl
blob: 32207d8202b84e08ba98ea0166a27fcaeb27d411 (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
@import 'nib'

position()
  if arguments[0] == cover || arguments[0] == fixed-cover
    if arguments[0] == cover
      position: absolute
    else
      position: fixed
    left: 0
    right: 0
    top: 0
    bottom: 0
  else
    position: arguments

.board-wrapper
  position: cover
  overflow-x: hidden
  overflow-y: hidden

  .board-canvas
    position: cover
    transition: margin .1s
    overflow-y: auto

    &.is-sibling-sidebar-open
      margin-right: 248px

    .board-overlay
      position: fixed-cover
      top: -100px
      right: -400px
      background: black
      opacity: 0.33
      animation: fadeIn 0.2s
      z-index: 16

    &.is-dragging-active
      .open-minicard-composer,
      .minicard-wrapper.is-checked
        display: none

@media screen and (max-width: 800px)
  .board-wrapper

    .board-canvas

      .swimlane
        border-bottom: 1px solid #CCC
        display: flex
        flex-direction: column
        margin: 0
        padding: 0 0px 0px 0
        overflow-x: hidden
        overflow-y: auto

calendar-event-color(background, borderColor, color...)
  background: background !important
  border-color: borderColor
  if color
    color: color !important //overwrite text for better visibility

.calendar-event-green
  calendar-event-color(#3cb500, #2a8000, #ffffff) //White text for better visibility

.calendar-event-yellow
  calendar-event-color(#fad900, #c7ac00, #000) //Black text for better visibility

.calendar-event-orange
  calendar-event-color(#ff9f19, #cc7c14, #000) //Black text for better visibility

.calendar-event-red
  calendar-event-color(#eb4646, #b83737, #ffffff) //White text for better visibility

.calendar-event-purple
  calendar-event-color(#a632db, #7d26a6, #ffffff) //White text for better visibility

.calendar-event-blue
  calendar-event-color(#0079bf, #005a8a, #ffffff) //White text for better visibility

.calendar-event-pink
  calendar-event-color(#ff78cb, #cc62a3, #000) //Black text for better visibility

.calendar-event-sky
  calendar-event-color(#00c2e0, #0094ab, #ffffff) //White text for better visibility

.calendar-event-black
  calendar-event-color(#4d4d4d, #1a1a1a, #ffffff) //White text for better visibility

.calendar-event-lime
  calendar-event-color(#51e898, #3eb375, #000) //Black text for better visibility

.calendar-event-silver
  calendar-event-color(#c0c0c0, #8c8c8c, #000) //Black text for better visibility

.calendar-event-peachpuff
  calendar-event-color(#ffdab9, #ccaf95, #000) //Black text for better visibility

.calendar-event-crimson
  calendar-event-color(#dc143c, #a8112f, #ffffff) //White text for better visibility

.calendar-event-plum
  calendar-event-color(#dda0dd, #a87ba8, #000) //Black text for better visibility

.calendar-event-darkgreen
  calendar-event-color(#006400, #003000, #ffffff) //White text for better visibility

.calendar-event-slateblue
  calendar-event-color(#6a5acd, #4f4399, #ffffff) //White text for better visibility

.calendar-event-magenta
  calendar-event-color(#ff00ff, #cc00cc, #ffffff) //White text for better visibility

.calendar-event-gold
  calendar-event-color(#ffd700, #ccaa00, #000) //Black text for better visibility

.calendar-event-navy
  calendar-event-color(#000080, #000033, #ffffff) //White text for better visibility

.calendar-event-gray
  calendar-event-color(#808080, #333333, #ffffff) //White text for better visibility

.calendar-event-saddlebrown
  calendar-event-color(#8b4513, #572b0c, #ffffff) //White text for better visibility

.calendar-event-paleturquoise
  calendar-event-color(#afeeee, #8ababa, #000) //Black text for better visibility

.calendar-event-mistyrose
  calendar-event-color(#ffe4e1, #ccb8b6, #000) //Black text for better visibility

.calendar-event-indigo
  calendar-event-color(#4b0082, #2b004d, #ffffff) //White text for better visibility