-
Notifications
You must be signed in to change notification settings - Fork 44
/
ActionControls.scss
71 lines (60 loc) · 1.72 KB
/
ActionControls.scss
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
@import '../../variables';
.ba {
.ba-action-controls {
background: white;
color: $fours;
margin: 0;
white-space: normal;
}
.ba-annotation-input-container {
border-top: none;
width: 252px; // Hard-coded width to solve layout issues
}
.bcs-comment .bcs-comment-headline {
flex-flow: column wrap;
}
.bcs-comment-user-name ~ .bcs-comment-created-at {
margin: 0;
}
.ba-annotator-label ~ .ba-action-controls .ba-action-controls-draw,
.ba-annotator-label ~ .ba-action-controls .ba-action-controls-highlight {
border-left: 1px solid $see-see;
margin-left: 5px;
}
// TABLET-SPECIFIC CSS
@media #{$mobile}, #{$tablet} {
.ba-create-popover .ba-action-controls {
border: none;
box-shadow: none;
}
.ba-annotation-input-container {
bottom: 0;
padding: 15px;
position: absolute;
width: 100%;
}
.ba-annotator-label ~ .ba-action-controls .ba-action-controls-draw,
.ba-annotator-label ~ .ba-action-controls .ba-action-controls-highlight {
border-left: 0;
margin: 0;
}
}
// MOBILE CSS
@media #{$mobile} {
.ba-action-controls {
background: white;
justify-content: flex-end;
width: 100%;
}
.ba-annotation-input-container {
padding: 15px;
width: 100%;
}
.ba-create-popover .ba-annotation-input-container {
border-top: 1px solid $seesee;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .1);
padding: 15px;
width: 100%;
}
}
}